Day12. 物件!物件!多少混亂假汝之名而行

Day12. 物件!物件!多少混亂假汝之名而行

本日閱讀進度:第五章 認識物件(186~205頁)

重點摘要:

1.變數裡放的是物件嗎?

還記得之前的文章提過JavaScript的引數傳遞是pass by value,但是有例外嗎?例外就是遇到物件的時候。

var abui = {
  name: "Abui",
  weight: 3,
  age: 1,
  color: "orange",
  breed: "mixed,
  tnr: true
};

abui這個變數所保存的實際上不是物件,而是物件的址參器(reference)。

址參器就像是一個指向實際物件的指標(pointer)或位址(address)。

在JavaScript中,我們並不知道址參器變數裡所保存的是什麼東西,但不管它是什麼,它會指向我們的一個物件。

以下照抄課本原文,但我看不是很懂,之後再找別的資料來研究。

當叫用一個函式並把一個物件傳遞給它時,傳遞的是物件址參器,而不是物件本身。所以根據按值傳遞的語義,這會使得址參器的副本被傳進參數,而該址參器仍然指向原本的物件。 所以,這意味著如果你在函式中改變物件的一個屬性,會因而改變原本物件的屬性。所以當函式執行完畢時,你在函式中對物件所做的任何改變仍然會存在。

2.可以把函式加入物件嗎?

可以的,就像下面的例子:

var camry = {
  maker: "toyota",
  color: "white",
  year: 2014,
  drive: function() {
    alert.log("Zoom zoom!");
  }
};

注意到函式右邊的圓括號裡是空的了嗎?這裡沒有提供名稱給函式,因為函式的名稱就是屬性的名稱。

3.this的運作原理

this有點像Ruby裡的self。可以把this想成是一個變數,而且該變數被分配給了剛才被我們呼叫了方法的物件。

用以下例子來看:

var camry = {
  maker: "toyota",
  color: "white",
  year: 2014,
  started: false,
  
  start: function() {
    started = true;  //這裡有誤
  },

在這裡用了一個started屬性,但是把started寫在camry物件裡,JavaScript知道我們指的是started屬性嗎?

答案是JavaScript不知道,所以我們需要在started前加上this,this會指向camry這個物件,程式就能順利運作了。

  start: function() {
    this.started = true;  //這樣才是對的
  },
  
  stop: function() {
    this.started = false;
  },
  
  drive: function() {
    if (this.started) {
      alert("Zoom zoom!");
    } else {
      alert("You need to start the engine first.")
    }
  }
};

camry.drive();
camry.start();
camry.drive();
camry.stop();

是不是覺得物件很複雜呢?我也這麼覺得。但已經比第一次接觸時多懂了一些些,慢慢累積就會越來越清晰了。(應該啦)

本文同步發表於iT邦幫忙

Recent post