×
Creating solutions

Arrow functions a operátor this (JavaScript)

JavaScript arrow functions majú viacero obmedzení, medzi ktoré patrí aj absencia zmeny objektu this. Pre niekoho vyhovujúci stav, pre niekoho, kto arrow function vidí prvý krát, neštandardné správanie. Výhodou v tomto prípade je skutočnosť, že nie je potrebné do arrow function posúvať scope. Funkcia totiž pracuje s platným this a nie s objektom window.
Príklad: Demonštrácia prace s this v arrow function.
1
2
3
4
5
6
7
8
9
10
11
12
var app = {
prop: 1,
test: function () {
var fun1 = value => value * this.prop;
var fun2 = function(value) {
return value * this.prop;
}
console.log(fun1(5)); // 5
console.log(fun2(5)); // NaN
}
}
app.test();
V nasledujúcom príklade je demonštrovaná práca s this detailnejšie a zrozumiteľnejšie, vďaka čomu vidíme okrem návratovej hodnoty aj hodnotu objektu this.
Príklad: Demonštrácia prace s this v arrow function.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var app = {
prop: 1,
test: function () {
var fun1 = value => {
console.log(this);
return value * this.prop;
};
var fun2 = function (value) {
console.log(this);
return value * this.prop;
}
console.log(fun1(5));
console.log(fun2(5));
}
}
app.test();
Ako vidieť, arrow function používa aktuálny scope a nie window. Táto vlastnosť môže byť užitočná, ak potrebujeme pracovať s aktuálnym objektom vďaka čomu nemusíme používať techniky na posúvanie scope do funkcie.

Záver

Arrow functions ako novinka v rámci ECMAScriptu majú aj ďalšie odlišnosti od klasických funkcií. Ale o nich až nabudúce.


JavaScript,arrow functions,this,ECMAScript
No part of this article may be reproduced without mention of the author and URL to this website.
For more information, see the About section.

Comments

Article has no comments.

Add a comment

Name (required)
Website
Message (required)
Submit
From latest