Pytanie 1
Co będzie wynikiem działania poniższego kodu JavaScript?
| const obj = { name: 'John', greet: function() { setTimeout(function() { console.log(`Hello, ${this.name}`); }, 1000); } }; obj.greet(); |
A. Hello, null
B. Hello, undefined
C. Hello, John
D. TypeError
Odpowiedzi `Hello, John`, `TypeError` oraz `Hello, null` są wynikiem niepełnego zrozumienia zasad działania kontekstu `this` w JavaScript oraz mechanizmów związanych z wywołaniami funkcji w różnych kontekstach. W przypadku pierwszej z tych odpowiedzi, można by sądzić, że `this` w funkcji anonimowej odwołuje się do obiektu `obj`, co jest błędne, ponieważ w momencie wywołania funkcji przez `setTimeout` kontekst `this` traci odniesienie do obiektu, a zamiast tego wskazuje na obiekt globalny. W efekcie `this.name` nie zwraca wartości `'John'`, lecz `undefined`. Druga odpowiedź, związana z `TypeError`, nie zrozumiała, że żadne błędy nie są generowane w tym kodzie, a funkcja anonimowa wykonuje się bezproblemowo, jednak z błędnym kontekstem. Ostatnia propozycja, `Hello, null`, również jest nietrafiona, ponieważ nie istnieje sytuacja, w której `this` w tym kontekście mogłoby się odwoływać do `null`. Należy również pamiętać, że JavaScript różni się od wielu innych języków programowania, gdzie `this` jest bardziej ściśle powiązane z obiektem, w którym metoda została wywołana. Zrozumienie kontekstu `this` jest kluczowe w pracy z JavaScript, szczególnie w pracy z funkcjami asynchronicznymi oraz w zastosowaniach programowania obiektowego.
