Programowanie w JavaScript Rusz głową!

234

Rozdział 5.

Słowo kluczowe this

Dlaczego metoda drive nic nie wie

o właściwości started?

Oto mamy zagadkę: w metodzie obiektu

fiat

użyliśmy referencji do właściwości

started

, a zazwyczaj, kiedy chcemy odwołać się do zmiennej wewnątrz funkcji, okazuje

się, że zmienna ta jest zmienną lokalną, parametrem funkcji lub zmienną globalną.

Jednak w metodzie

drive started

nie jest żadną z tych trzech rzeczy — jest natomiast

właściwością obiektu

fiat

.

Czy ten kod nie powinien po prostu działać? Chodzi o to, że zdefiniowaliśmy właściwość

started

w obiekcie

fiat

, czy zatem JavaScript nie powinien być na tyle sprytny,

by zorientować się, że chodzi o właściwość

started

?

Niestety, nie. Jak widać, interpreter JavaScriptu nie jest tak mądry. A niby dlaczego

miałby być?

Wygląda to tak: to, co wewnątrz metody wygląda na zmienną, jest właściwością obiektu,

jednak problem polega na tym, że my nie określamy w kodzie, o jaki obiekt chodzi.

Możesz sobie pomyśleć: „Ale to przecież oczywiste, że chodzi o TEN obiekt, dokładnie

ten, w którym jest zdefiniowana metoda! Jakim cudem można się nie domyślić, że o niego

chodzi?”. I faktycznie, chodzi dokładnie o właściwość tego obiektu. Okazuje się, że

JavaScript udostępnia specjalne słowo kluczowe,

this

, którego użycie informuje język

JavaScript, że chodzi

dokładnie o ten obiekt, w którym się aktualnie znajdujemy.

A teraz zastosujemy słowo kluczowe

this

i uruchomimy nasz kod.

Słuchaj, jeśli chcesz,

żebym wiedział, do

którego obiektu należy

started, musisz mi o tym

powiedzieć.

var fiat = {

make: ”Fiat”,

// tu sÈ pozostaïe wïaĂciwoĂci, pominiemy je, oszczÚdzajÈc nieco miejsca

started: false,

start: function() {

this.started = true;

},

stop: function() {

this.started = false;

},

drive: function() {

if (this.started) {

alert(”Brum wrrrr!”);

} else {

alert(”Najpierw musisz wïÈczyÊ silnik.”);

}

}

};

Przed każdym wystąpieniem

właściwości started zastosuj słowo

kluczowe this oraz zapis z kropką,

aby poinformować interpreter

JavaScriptu, że chodzi o właściwość

TEGO obiektu, a nie odwołanie do

jakiejś zmiennej.

drive: function() {

if (started) {

...

}

}

jesteś tutaj

235

Zrozumieć obiekty

Jazda próbna ze słowem kluczowym this

No dalej, zaktualizuj kod i weź go w obroty!

A to nam udało się uzyskać.

var song = {

name: ”Brothers in Arms”,

artist: ”Dire Straits”,

minutes: 4,

seconds: 3,

genre: ”80s”,

playing: false,

play: function() {

if (!playing) {

this = true;

console.log(”Odtwarzam teraz ”

+ name + ” wykonywany przez ” +

artist + ”.”);

}

},

pause: function() {

if (playing) {

this.playing = false;

}

}

};

this.play();

this.pause();

Spokojnie możesz zaznaczać

błędy bezpośrednio tu, w książce.

BĄDŹ przeglądarką

Poniżej znajdziesz kod JavaScript, w którym celowo wprowadziliśmy kilka błędów.

Twoim zadaniem jest wcielić się w rolę przeglądarki i wykryć błędy w tym kodzie.

Kiedy zrobisz już to ćwiczenie, zajrzyj na koniec rozdziału i sprawdź, czy udało Ci

się znaleźć wszystkie.