Questi valori per le funzioni freccia

Sto cercando di capire le funzioni delle frecce in ECMAScript 6.

Questa è la definizione che ho trovato leggendo:

Le funzioni delle frecce hanno implicito this legame, il che significa che il valore di this valore all’interno di una funzione di freccia è uguale al valore di this nello scope in cui è definita la funzione di freccia!

Secondo la definizione, credo che per una arrow function debbano contenere gli stessi valori a livello di blocco in cui è stata definita la funzione di freccia.

Codice:

 var test = { id: "123123", k: { laptop: "ramen", testfunc: () => console.log(this) } } console.log(test.k.testfunc);

Tuttavia, sto ottenendo questo risultato dal codice

 function testfunc() { return console.log(undefined); }

Quello che pensavo di ottenere sarebbe un risultato di:

 {"laptop": "ramen"}

se l’ho eseguito

console.log(test.k.testfunc());

Trasformiamo nel codice ES5 equivalente:

 var test = { id: "123123", k: { laptop: "ramen", testfunc: function(){return console.log(this)}.bind(this) } }

Ricorda che this dipende da come chiami la funzione. L’esterno non è all’interno di una funzione, quindi verrà impostato come predefinito in modalità rigorosa.

Scenario semplificato di seguito:

 console.log(this) // undefined var test = { a: this // same `this` as above }

Stai definendo la funzione freccia nello stesso ambito che hai definito var test . Se si sta definendo il test nell’ambito globale, anche il contesto della funzione freccia sarà lo scopo globale.

Se si sta definendo un test all’interno di un metodo, la funzione freccia condividerà il contesto del metodo.

 function method() { const self = this; const test = { foo: () => console.log(self === this); } test.foo() // console: true }