Articles of ecmascript 6

¿Cómo probar una clase ES6 que necesita jquery?

Tengo un módulo ES6 que necesita jquery. import $ from ‘jquery’; export class Weather { /** * Constructor for Weather class * * @param latitude * @param longitude */ constructor(latitude, longitude) { this.latitude = latitude; this.longitude = longitude; } /** * Fetches the weather using API */ getWeather() { return $.ajax({ url: ‘http://localhost:8080/weather?lat=’ + this.latitude […]

Typescript / Angular / ES6: ¿puedo finalmente dejar que `hasOwnProperty ()` muera para los loops?

Siempre me ha desagradado la necesidad de verificar hasOwnProperty() al pasar sobre objetos en javascript: for ( var key in object ) { if ( !object.hasOwnProperty( key ) ) { continue; } // Now I can do whatever I needed to do } Siempre parece un espacio vertical desperdiciado recorrer las teclas de un objeto […]

¿Qué podemos hacer con ES6 Generator que no podemos con for loop?

Pasé por las características de ES6 y Generators me llamó la atención. Una cosa que me vino a la mente es encadenar objetos Promesa, que no podría hacer con bucles. ¿Qué otra mecánica podremos hacer, que antes no podríamos? Entiendo que esta es una pregunta amplia, todavía no puedo pensar en nada más que en […]

Importa dinámicamente imágenes de un directorio usando un paquete web

Así que aquí está mi flujo de trabajo actual para importar imágenes e icons en un paquete web a través de ES6: import cat from ‘./images/cat1.jpg’ import cat2 from ‘./images/cat2.svg’ import doggy from ‘./images/doggy.png’ import turtle from ‘./images/turtle.png’ Esto se pone desordenado rápido. Esto es lo que quiero: import * from ‘./images’ Siento que debe […]

¿Qué son getters y setters para las clases de ECMAScript 6?

Estoy confundido en cuanto a qué punto de captadores y establecedores están en las clases de ECMAScript 6. ¿Cuál es el propósito? A continuación se muestra un ejemplo al que me refiero: class Employee { constructor(name) { this._name = name; } doWork() { return `${this._name} is working`; } get name() { return this._name.toUpperCase(); } set […]

Typescript: no se puede acceder al valor de miembro en el constructor de clases heredado

Tengo una clase A y una clase B heredada de ella. class A { constructor(){ this.init(); } init(){} } class B extends A { private myMember = {value:1}; constructor(){ super(); } init(){ console.log(this.myMember.value); } } const x = new B(); Cuando ejecuto este código, aparece el siguiente error: Uncaught TypeError: Cannot read property ‘value’ of […]

¿Cuál es la diferencia entre usar constructor vs state = {} para declarar el estado en el componente reactjsr?

Encontré que hay dos formas de declarar el estado en el componente de la clase como a continuación class App extends Component { constructor(props) { super(props); this.state = { name: ‘John’ } } render() { return {this.state.name} } } y class App extends Component { state = { name: ‘John’ } render() { return {this.state.name} […]

¿Por qué los generadores no son compatibles con map ()?

Me parece completamente natural que los generadores, que funcionan de forma muy similar a las matrices, deberían admitir las operaciones básicas de la lista, como map() , filter() y reduce() . ¿Me estoy perdiendo de algo? Escribí el código para el map y parece bastante simple, pero sería mucho mejor tener todas las funciones integradas […]

Valor predeterminado del parámetro de la función de asignación de objeto ES6 desestructurante

Hola. Estaba revisando ejemplos del uso de la desestructuración de objetos al pasar los parámetros de la función. Demostración de destrucción de objetos function drawES6Chart({size = ‘big’, cords = { x: 0, y: 0 }, radius = 25} = **{}**) { console.log(size, cords, radius); // do some chart drawing } // In Firefox, default values […]

función de flecha y esto

Estoy navegando por Twitter y encontré este tweet: ES6 Arrow funcs can't bind `this`:const double = () => this.x * 2;const numDouble = double.bind({ x: 5 });numDouble(); // Error #js — Eric Elliott (@_ericelliott) April 22, 2017 Aquí está el código del tweet: const double = () => this.x * 2; const numDouble = double.bind({ […]