iT邦幫忙

0

JavaScript 基礎知識-物件+陣列的組合

若同時需要很多個物件,不妨參考一下前面說到陣列適合儲存多個資料,儲存物件也不例外,我們可以在陣列內儲存多個物件,如下:

var farms = [
    {
        farmer: 'Jerry',
        chicken: 5,
        duck: 6,
        dogs: ['小白','小黑']
     },
    {
       farmer: 'Tom',
       chicken: 8,
       duck: 3,
       dogs: ['皮皮']
     }
];

前面有講到屬性不只可以賦予值,也可以是函式,不妨來增加點有函式的屬性:

   farms[0].poultry = function(){
       var total = this.chicken + this.duck;
       console.log(total);
   };
   farms[1].poultry = function(){
       var total = this.chicken + this.duck;
       console.log(total);
   };

以上複習到了前面兩個觀念:

  1. 陣列的讀取是要中括號搭配索引編號
  2. 讀取物件的屬性

所以我們在整個 farms 陣列內先讀取第一個資料,即 farms[0]
接下來為它新增一個屬性 farms[0].poultry
且這個屬性賦予一個函式用來計算所有的家禽farms[0].poultry = function(){...}

若此時在 console 呼叫 farms 這個陣列會如下:

var farms = [
    {
        farmer: 'Jerry',
        chicken: 5,
        duck: 6,
        dogs: ['小白','小黑'],
        poultry: function(){
            var total = this.chicken + this.duck;
            console.log(total);
        }
     },
    {
       farmer: 'Tom',
       chicken: 8,
       duck: 3,
       dogs: ['皮皮'],
       poultry: function(){
            var total = this.chicken + this.duck;
            console.log(total);
        }
     }
];

如果此時想要計算第二個物件的家禽數量:

console.log(farms[1].poultry());

此時會在 console 看到 11

如果想要讀取第一個物件的 dogs 屬性的第一筆資料,則:

console.log(farms[0].dogs[0]);

此時會在 console 看到 小白

這裡資料型態讀取上都是依照前面講過的觀念,不同資料型態讀取上會較複雜,可以多重複看幾次來消化
/images/emoticon/emoticon31.gif


尚未有邦友留言

立即登入留言