JavaScript入門-物件

js物件

本篇主要介紹js裡如何建立物件，以及for迴圈訪問物件的成員...

什麼是物件？

• 物件，並不是中文裡有男女朋友意思，它是從英文裡翻譯來的，英文叫[Object]，目標，物體，物品的意思。
• 在程式設計裡，我們經常聽到有人說，物件導向。那這個物件，你簡單來理解，就是一個容器，一個能裝變數、函式體的容器。也可以在裡面繼續裝下物件。

物件的建立

    //方法一（推薦）
    var obj = {
        name : 'rainbow',
        run : function(){
            console.log('跑步中...')
        }
    }
    //方法二（不推薦）
    var obj = new Object()
    obj.name = 'rainbow'
    obj.run = function(){
        console.log('running...')
    }

    //方法三(推薦)
    var obj = {}
    obj.name = 'rainbow'
    obj.say = function(){
        console.log('saying ...')
    }

ps:

1. 以上就是建立物件的三種方法，儘量避免第二種方法，因為new Object效率低，建議使用第三種或者第一種。
2. 屬性名可以單引，可以雙引，也可以不引，但他的型別永遠都是string型別
3. 變數裡的成員變數，也可以被賦值方法。但是不推薦這麼做。

for迴圈訪問物件成員

for...in

    //先定義一個物件
    var obj =  {
        name : 'rainbow',
        age : 20,
        sex : 'man',
        run : function(){
            console.log('I'm running...')
        }
    }

    for ( var key in obj ){
        if('function' == typeof obj[key]){
            obj[key]()
            break
        }
        console.log(obj[key])
    }

    //輸出結果如下
    rainbow
    20
    man
    I am running...

    /*估計有些人會問，為什麼不是用obj.key訪問呢？？
    那我們不妨列印看看，boj.key是什麼?
    那請往下看：*/
    for (var key in obj) {
        console.log(key , typeof key)
        console.log(obj.key)//undefined
    }

• 列印如下
  

ps:我們可以知道，在js裡，for...in不能用點運算訪問，而是用obj[key]訪問，並且方法名也可以訪問。

for...of

    //1.使用js內建的物件，建立一個陣列物件
    var array = new Array(11,56,89,78,-12)
    console.log( typeof array )//object
    for ( var val of array){
        console.log(val)//11,56,89,78,-12
    }

    //2.用的自定義的物件
    var obj =  {
        name : 'rainbow',
        age : 20,
        sex : 'man',
        run : function(){
            console.log('I'm running...')
        }
    }
    for ( var val of obj ){
        console.log(obj)//obj is not iterable
    }
    這裡報錯的意思是，obj這個物件是不可迭代的

總結

• 用for...of不能迭代自定義物件
• 用for...in，不能用點運算訪問成員，而是用物件[屬性名]，可以訪問一個不存在的屬性，但是返回值為undefined
• 不要使用普通for迴圈訪問物件成員