let temp = { a: 10, b: 20, sum() { return this.a + this.b; }, multi: () => { return this.a * this.b; }, }; console.log(temp.sum()) console.log(temp.multi())Soy principiante es JavaScript. Quiero preguntar por qué la salida del código es
30 and NaNLa sintaxis es incorrecta, use
multi: function() { return this.a * this.b; }en el objeto
Editar
La razón por la que la función de flecha [=>()] da un error es porque no reconoce this como el contexto del objeto al que se llama sino, en este caso, el contexto global. De ahí este resultado.
var a=2, b=5; let temp = { a: 10, b: 20, sum() { return this.a + this.b; }, multi: () => { return this.a * this.b; }, }; console.log(temp.sum()); console.log(temp.multi());La razón por la que devuelve NaN cuando se llama a multi() es por la peculiaridad de this palabra clave. El this en la función multi no se refiere al objeto temp como cabría esperar, sino que se refiere al this global. Ejecute el siguiente código para ver los valores específicos que se utilizan en multi :
let temp = { a: 10, b: 20, sum() { console.log('running `sum`:', 'this === window?', this === window); console.log(this.a, this.b, this.a + this.b); return this.a + this.b; }, multi: () => { console.log('running `multi`:', 'this === window?', this === window); console.log(this.a, this.b, this.a * this.b); return this.a * this.b; } }; console.log(temp.sum()); console.log(temp.multi()); Para resolverlo en multi , llame a las propiedades de temp en lugar de this (o cambie la firma de multi para que sea multi() { como es sum ):
let temp = { a: 10, b: 20, sum() { console.log('running `sum`:', 'this === window?', this === window); console.log(this.a, this.b, this.a + this.b); return this.a + this.b; }, multi: () => { console.log('running `multi`:', 'temp === window?', temp === window); console.log(temp.a, temp.b, temp.a * temp.b); return temp.a * temp.b; } }; console.log(temp.sum()); console.log(temp.multi());Las expresiones de función de flecha no deben usarse como métodos, ya que no tienen sus propios enlaces a esto de acuerdo con MDN . Se llama "léxico esto". Normalmente, las funciones tradicionales unen "this" al objeto (por lo tanto, this.a significa 10). Si usa "esto" en la función de flecha, significaría el objeto global 'Ventana'. Por lo tanto, se convirtió en indefinido * indefinido, que es NaN.