iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 9
2
Modern Web

JavaScript 初心者筆記系列 第 9

JavaScript 初心者筆記: 物件簡介

物件的意義

物件就是將各種變數函式整理成一個懶人包,不過在物件中,變數稱為「特性」,特性可以告訴我們有關物件的特徵;而函式稱為「方法」,方法代表物件所連結的相關動作。
特性跟方法有他們自己的名稱,就像屬性名稱一樣,只不過在物件中稱為「鍵」(key),當然,鍵有相對應的值。

在 JavaScript 的世界裡,所有東西都是物件,只有分原始型別和物件型別。兩種型別的差異在於,前者無法自由擴增屬性,後者可以。

原始型別:

number - 數值
string - 字串
boolean - 布林
null - 空值
undefined - 未定義

物件型別:

除了原始型別以外的東西都是屬於這個類別,包含陣列及函式也都是物件。

物件的寫法

用大括號將內部所有資訊包起來,鍵跟值之間用冒號區隔。結束一行程式碼時用逗號做結尾,但物件中最後一行程式碼不需要逗號。

var farm = {
  farmer : '馬格蕾特',
  ...
}

物件的新增與修改

首先要說明如何選取物件內的鍵:「物件名稱 + 一個點點 + 鍵的名稱」。

  1. 在物件外面要新增一組資料進去
    物件名稱.欲新增的鍵名稱 = 欲新增的值;
  2. 修改物件中某一個鍵的值
    物件名稱.鍵名稱 = 欲修改的值;

查詢鍵的值

查詢鍵值的方式,就是物件名.鍵名:
console.log(farm.farmer);

當鍵的值是用陣列表示時,查詢的方法就像下方這樣:
console.log(farm.dog[0]);

如果想用變數讀取物件裡的陣列的其中一個值:

var dog1 = farm.dog[0];
console.log(dog1);

如何執行物件的方法

建立方法

鍵名: function(){
       方法要執行的內容;
      },

這裡的方法就是函式。不用命名。

呼叫方法

物件名.方法的鍵名();
這裡的小括號是叫方法跑起來

用陣列合併 2 個以上的物件

宣告一個陣列,裡面個別用大括號 { } 將各個物件包起來,物件跟物件間用逗點隔開。

var farms = [
 {
   farmer: '馬格蕾特',
   dogs: ['John' , 'Bob'],
 },
 {
   farmer: '史黛菲',
   dogs: ['Tim']
 }
]

讀取方法

  1. 先選擇陣列中編號第幾號物件,再選擇該物件的哪個鍵。
    console.log(farms[0].farmer);
  2. 如果鍵值也是個陣列時,就要用陣列的選取方式([ 編號 ])。
    console.log(farms[1].dogs[0]);

在 Medium 上看到幾篇優質的技術文讓我獲益匪淺,而且作者跟我的程度好像差不多,不過最後一次更新是五月的事了。於是留言鼓勵作者繼續發文,才知道原來作者已經另有職涯規劃、沒有再繼續學習了。
頓時覺得很惋惜,一方面是惋惜少了一個同樣程度可以互相切磋的對象,另一方面是惋惜作者這麼有才,繼續耕耘前端應該大有可為才對。
於是又再次體悟到,資質很重要、努力很重要,但是堅持下去的毅力更是重中之重,我想這也是鐵人賽的精神吧。


上一篇
JavaScript 初心者筆記: 陣列簡介
下一篇
JavaScript 初心者筆記: JS 內建物件 - 全域物件篇
系列文
JavaScript 初心者筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言