Notas de estudio de JavaScript del sitio web oficial de Liao Xuefeng
1. Forma básica
Las funciones de flecha son equivalentes a funciones anónimas y simplifican la definición de la función.
x => x * x
Equivalente a
function (x) {
return x * x;
}
Otras formas:
// 两个参数:
(x, y) => x * x + y * y
// 无参数:
() => 3.14
// 可变参数:
(x, y, ...rest) => {
var i, sum = x + y;
for (i=0; i<rest.length; i++) {
sum += rest[i];
}
return sum;
}
Si desea devolver un objeto:
x => ({
foo: x })
Los paréntesis no se pueden omitir porque hay un conflicto de sintaxis con el {…} del cuerpo de la función, como el siguiente:
// SyntaxError:
x => {
foo: x }
Dos, este
Existe una diferencia obvia entre las funciones de flecha y las funciones anónimas : la función this dentro de la flecha es el alcance léxico, que está determinado por el contexto.
La definición de esto en 1.js
Es una palabra clave del lenguaje Javascript, representa un objeto interno que se genera automáticamente cuando la función está en ejecución, se determina automáticamente según el alcance de cada función y apunta al llamador .
var obj = {
birth: 1990,
getAge: function () {
var b = this.birth; // 1990
var fn = function () {
return new Date().getFullYear() - this.birth; // this指向window或undefined
};
return fn();
}
};
2.
La función de flecha fija completamente la dirección de esto. Esto siempre apunta al ámbito léxico, que es el obj llamador externo . esto apunta a esto heredado de la primera función ordinaria de la capa exterior cuando fue definida . Este objeto en el cuerpo de la función es el objeto cuando se define y no tiene nada que ver con el objeto cuando se utiliza .
var obj = {
birth: 1990,
getAge: function () {
var b = this.birth; // 1990
var fn = () => new Date().getFullYear() - this.birth; // this指向obj对象
return fn();
}
};
obj.getAge(); // 25