JavaScript物件字面量LOGIN

JavaScript物件字面量

在JavaScript中,可以透過類別的實例化來建立對象,也可以使用 對象字面量 直接建立物件。

在程式語言中,字面量是一種表示值的記法,例如,"Hello, World!" 在許多語言中都表示字串字面量(string literal )。 JavaScript也不例外,如5、true、false和null,它們分別表示一個整數、兩個布林值和一個空物件。

JavaScript 支援物件字面量,允許使用簡潔而可讀的記法來建立物件。

物件字面量是一個 名/值 對列表,每個 名/值 對之間用逗號分隔,最後用一個大括號括起來。名/值對 表示物件的屬性或方法,名稱和值之間用冒號分隔。

例如:

var  myCar={
        "price" : ",000" ,   // 属性
        "color" : "red" ,   // 属性
        "run" : function(){ return " 120 km/h "; }   // 方法
    }
var myHome={
        population : "10,000" ,
        area : "10,000" ,
        adress : {  // 属性
                country : "China" ,
                province : "shanxi" ,
                city : "xian"
            },
        say : function(){  // 方法
                return "My hometown is very beautiful ! ";
            }
    }

建立一個zhangsan物件:

var zhangsan={
    name : "张三",
    sex : "男",
    say:function(){
        return "嗨!大家好,我来了。";
    },
    contact : {
        tel : "029-81895644",
        qq : "1370753465",
        email : "it@gmail.com"
    }
}
alert("姓名:"+zhangsan.name);
alert("性别:"+zhangsan.sex);
alert(zhangsan.say());
alert("电话:"+zhangsan.contact.tel);
alert("QQ:"+zhangsan.contact.qq);
alert("邮箱:"+zhangsan.contact.email);

可以看出來:

  • ##使用物件字面量可以建立單個對象,語意直觀。

  • 物件字面量可以嵌套。


物件字面量也可以先創建,再加入屬性和方法。
上面的zhangsan對象,也可以這樣來建立:

var zhangsan={}
zhangsan.name = "张三";
zhangsan.sex = "男";
zhangsan.say = function(){
        return "嗨!大家好,我来了。";
    }
zhangsan.contact = {
    tel : "029-81895644",
    qq : "1370753465",
    email : "it@gmail.com"
}


下一節

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script>var zhangsan={ name : "张三", sex : "男", say:function(){ return "嗨!大家好,我来了。"; }, contact : { tel : "029-81895644", qq : "1370753465", email : "it@gmail.com" } } alert("姓名:"+zhangsan.name); alert("性别:"+zhangsan.sex); alert(zhangsan.say()); alert("电话:"+zhangsan.contact.tel); alert("QQ:"+zhangsan.contact.qq); alert("邮箱:"+zhangsan.contact.email);</script> </head> <body> </body> </html>
章節課件