Saludos!!!
0:00/10:01
Saludos!!!
Yo utilizaría las funciones de flecha con los array methods, como lo son: some, reduce, filter, find, every, etc. Saludos!!!
Clase 15: Funciones de flecha y el this
arrow functions su this queda relacionado al ambito externo.// El return está implícito sino añadimos las llaves.
const getResult = () => "Results";
//Sin arrows functions
[1, 2, 3]
.map(function (n) {
return n * 2;
})
[
// Con arrows functions
(1, 2, 3)
].map((n) => n * 2);
// Ejemplos del this
const counter = {
number: 0,
increase() {
setInterval(() => console.log(++this.number), 1000);
},
};
counter.increase(); //> 1 2 3 4 5
const counter = {
number: 0,
increase() {
setInterval(function () {
console.log(++this.number);
}, 1000);
},
};
counter.increase(); //> NaN, NaN, NaN, NaN, NaN
const counter = {
number: 0,
increase() {
setInterval(
function () {
console.log(++this.number);
}.bind(this),
1000
);
},
};
counter.increase(); //> 1 2 3 4 5
los callback con función flecha heredan el this del contenedor
A mi me gustan las arrow function por que son mas simples a la vista.
¿Cuándo conviene usar this?
El método bind() permite crear una nueva función cuyo valor de this queda fijado permanentemente al objeto indicado.
const persona = {
nombre: "Juan"
};
function saludar() {
console.log(this.nombre);
}
const saludarPersona = saludar.bind(persona);
saludarPersona();
En este ejemplo, bind() devuelve una nueva función donde this siempre será persona, sin importar desde dónde se invoque.
Este mecanismo es especialmente útil cuando una función se pasa como callback y existe el riesgo de perder el contexto original.
Las Arrow Functions fueron introducidas en ECMAScript 2015 (ES6) con el objetivo de ofrecer una sintaxis más concisa para escribir funciones y, principalmente, solucionar algunos problemas relacionados con el manejo de this.
A diferencia de una función tradicional, una Arrow Function puede escribirse de forma mucho más compacta cuando su cuerpo contiene una sola expresión.
Tengo una duda. ¿Es recomendable usar función flecha en vez de de las funciones normales?
El código esta sencillo de entender pero la explicacion deberia ser mas aprofundida de por que funciona o enfatizar mas en el estandar ECM6
José Antonio Medina Sánchez
Saludos!!!
Reinaldo Mendoza
Ja, pero no
freddy conto mena
(function)(); para auto invocar es mas limpio.
José Antonio Medina Sánchez
Yo utilizaría las funciones de flecha con los array methods, como lo son: some, reduce, filter, find, every, etc. Saludos!!!
Sergio Brandon De Lucio Chavero
personalmente las uso en todos lados xD
Bryan Castano
Hiii, Yo tambien las uso dentro de Array methods, \n
Genial .
LEONARD CUENCA
Markin Piero Pulache Guarniz
buen aporte
Kevin Giovanni Cano Blanco
A mi me gustan las arrow function por que son mas simples a la vista.
Edith Ortiz
¿Cuándo conviene usar this?
Brandon Lee Aguero Fernandez
Sería cuando trabajes con prototipos o con la sintaxis CLASS(Opinión personal). Pero...lo puedes usar también en objetos para construir métodos. CONCLUSIÓN: Usalo según tus necesidades.
Ayriel Noriega
El método bind() permite crear una nueva función cuyo valor de this queda fijado permanentemente al objeto indicado.
const persona = { nombre: "Juan" }; function saludar() { console.log(this.nombre); } const saludarPersona = saludar.bind(persona); saludarPersona();
En este ejemplo, bind() devuelve una nueva función donde this siempre será persona, sin importar desde dónde se invoque.
Este mecanismo es especialmente útil cuando una función se pasa como callback y existe el riesgo de perder el contexto original.
Ayriel Noriega
Las Arrow Functions fueron introducidas en ECMAScript 2015 (ES6) con el objetivo de ofrecer una sintaxis más concisa para escribir funciones y, principalmente, solucionar algunos problemas relacionados con el manejo de this.
A diferencia de una función tradicional, una Arrow Function puede escribirse de forma mucho más compacta cuando su cuerpo contiene una sola expresión.
Juan Camilo Salazar Rojas
Tengo una duda. ¿Es recomendable usar función flecha en vez de de las funciones normales?
Sandra Rosa Arroyo Paredes
La elección entre funciones flecha y funciones normales depende del contexto y el propósito específico. No hay una recomendación universal de usar siempre un tipo sobre el otro.
Recomendaciones de uso:
Usa funciones flecha cuando:
this del ámbito que la contiene.this.Usa funciones normales cuando:
this.new).arguments.this.Consideraciones adicionales:
this, lo que puede ser ventajoso o problemático dependiendo del caso.this.this, usa una función normal.En resumen, no es recomendable usar exclusivamente funciones flecha o funciones normales. Lo mejor es entender las diferencias y elegir el tipo de función adecuado según el contexto y los requisitos específicos de tu código. La clave está en usar cada tipo de función donde sus características particulares sean más beneficiosas.
Guillermo Jimenez
El código esta sencillo de entender pero la explicacion deberia ser mas aprofundida de por que funciona o enfatizar mas en el estandar ECM6
José Miguel Vásquez Guerra
La gente que programa con fondo blanco ha de vivir en el sol.
Ana Rotela Cabrera
Resumen de la clase
Luis Eduardo Payano Villar
const counter ={ number: 0, increase(){ setInterval(() =>console.log(++this.number), 100); }, }; counter.increase();
Misael Valdez
Alguien sabe que tema usa la profe en su editor? Esta muy bueno!
José Miguel Vásquez Guerra
Ya lo he preguntado antes, pero creo que no hay notificación para cuando te responden y no recuerdo en cuales videos lo hice x_X
Clase 15: Funciones de flecha y el this
arrow functions su this queda relacionado al ambito externo.// El return está implícito sino añadimos las llaves. const getResult = () => "Results"; //Sin arrows functions [1, 2, 3] .map(function (n) { return n * 2; }) [ // Con arrows functions (1, 2, 3) ].map((n) => n * 2); // Ejemplos del this const counter = { number: 0, increase() { setInterval(() => console.log(++this.number), 1000); }, }; counter.increase(); //> 1 2 3 4 5 const counter = { number: 0, increase() { setInterval(function () { console.log(++this.number); }, 1000); }, }; counter.increase(); //> NaN, NaN, NaN, NaN, NaN const counter = { number: 0, increase() { setInterval( function () { console.log(++this.number); }.bind(this), 1000 ); }, }; counter.increase(); //> 1 2 3 4 5