快捷導(dǎo)航

JavaScript類型系統(tǒng)之Object詳解

更新時間：2016年01月07日 11:31:56 作者：小火柴的藍色理想

對象其實就是一組數(shù)據(jù)和功能的集合。對象可以通過執(zhí)行new操作符后跟要創(chuàng)建的對象類型的名稱來創(chuàng)建。而創(chuàng)建Object類型的實例并為其添加屬性和（或）方法，就可以創(chuàng)建自定義對象

前面的話

　　在javascript中，對象為王；Javascript里的幾乎所有東西都是對象或者用起來像對象。理解了對象，就理解了Javascript。在javascript中，引用類型是一種數(shù)據(jù)結(jié)構(gòu)，用于將數(shù)據(jù)和功能組織在一起，它也常被稱為類。引用類型有時也被稱為對象定義，因為它們描述的是一類對象所具有的屬性和方法

　　大部分引用類型的值都是Object類型的實例；而且，Object也是javascript中使用最多的一個類型。雖然Object實例不具備多少功能，但對于在應(yīng)用程序中存儲和傳輸數(shù)據(jù)，它們確實是非常理想的選擇

創(chuàng)建對象

　　有兩種Object類型的創(chuàng)建方法

[1]Object構(gòu)造函數(shù)

var person = new Object();
//如果不給構(gòu)造函數(shù)傳遞參數(shù)可以不加括號 var person = new Object;
person.name = 'bai';
person.age = 29; 
//創(chuàng)建無屬性的空對象
var cody1 = new Object();
var cody2 = new Object(undefined);
var cody3 = new Object(null);
console.log(typeof cody1,typeof cody2, typeof cody3);//object object object 
//創(chuàng)建string、number、array、function、boolean、regex
console.log(new Object('foo'));
console.log(new Object(1));
console.log(new Object([]));
console.log(new Object(function(){}));
console.log(new Object(true));
console.log(new Object(/\bbt[a-z]+\b/));

　　[注意]Object()構(gòu)造函數(shù)本身就是對象，構(gòu)造函數(shù)是基于Function構(gòu)造函數(shù)創(chuàng)建的對象

[2]使用對象字面量

　　Javascript提供了叫做字面量的快捷方式，用于創(chuàng)建大多數(shù)原生對象值。使用字面量只是隱藏了與使用new 操作符相同的

基本過程

var person = {
name : 'bai',
age : 29,
5 : true
};

　　[注意]在對象字面量中使用逗號來分隔不同的屬性，但是在最后一個屬性后面添加逗號，會在IE7-導(dǎo)致錯誤

　　使用對象字面量的方法來定義對象，屬性名會自動轉(zhuǎn)換成字符串

//同上
var person = {
'name' : 'bai',
'age' : 29,
'5' : true
};

　　如果留空其花括號，則可以定義只包含默認屬性和方法的對象

//等價于var person = new Object();
var person = {}; 
[tips]使用對象字面量封裝多個可選參數(shù)
function displayInfo(args){
var output = '';
if(typeof args.name == 'string'){
output += 'name:' + args.name +'\n';
}
if(typeof args.age == 'number'){
output += 'Age:' + args.age + '\n';
}
console.log(output);
};
displayInfo({
name: 'Nicholas',
age: 29
});
displayInfo({
name: 'match'
});

　　以上這種傳遞參數(shù)的模式最適合需要向函數(shù)傳入大量可選參數(shù)的情況。一般來說，雖然命名參數(shù)容易處理，但有多個可選參數(shù)時就會不夠靈活。因此，對于必須值使用形參，而使用對象字面量來封裝多個可選參數(shù)

設(shè)置對象

　　有兩種訪問對象屬性的方法，可以用點表示法或中括號表示法獲取、設(shè)置或更新對象的屬性

　　中括號法的兩個優(yōu)點分別是可以通過變量來訪問屬性、屬性名稱可以為Javascript無效標識符

　　　　[注意]變量中可以存在中文，因為中文相當于字符，與英文字符同樣對待，因此可以寫成person.白或person['白']

var myObject = {
123:'zero',
class:'foo'
};
console.log(myObject['123'],myObject['class']);//'zero' 'foo'
console.log(myObject.123);//報錯

　　方括號中的值若是非字符串類型會使用String()隱式轉(zhuǎn)換成字符串再輸出；如果是字符串類型，若有引號則原值輸出，否則會被識別為變量，若變量未定義，則報錯

person[0] = 1; //[]中的數(shù)字不會報錯，而是自動轉(zhuǎn)換成字符串
person[a] = 1; //[]中符合變量命名規(guī)則的元素會被當成變量，變量未被定義，而報錯
person[''] = 2; //[]中的空字符串不會報錯,是實際存在的且可以調(diào)用,但不會在控制臺右側(cè)的集合中顯示
person[undefined 或 null 或 true 或 false] = 4;// 不會報錯，而是自動轉(zhuǎn)換成字符串
person['白'] = 6; // 不會報錯

刪除對象

　　delete操作符可以用于將屬性從一個對象中完全刪除。delete是將屬性從一個對象中刪除的唯一辦法，將屬性設(shè)置為undefined或null只能改變屬性的值，而不會將屬性從對象中刪除。delete只能刪除對象下的數(shù)據(jù)，其他5種基礎(chǔ)類型的值是刪除不掉的

　　[注意]delete不會刪除在原型鏈上找到的屬性

var foo = {bar: 'bar'};
delete foo.bar;
console.log('bar' in foo);//false 
var a = 123;
delete a;
console.log(a);//123

　　如果在全局狀態(tài)下聲明變量a，相當于window對象下的一個數(shù)據(jù)a,可以通過window.a或a來對a賦值，且window.a和a的值總是相等，但就是無法刪除

var a;
a = 10;
console.log(a,window.a);//10 10
window.a = 20;
console.log(a,window.a);//20 20
delete a ;
console.log(a,window.a);//20 20
delete window.a;
console.log(a,window.a);//20 20

　　如果用window.b 來聲明并賦值(b相當于聲明在window對象下),可以刪除,且用delete b 和 delete window.b 的效果相同，刪除后，console.log(b)提示變量不存在，console.log(window.b)提示undefined

window.b = 10;
console.log(b,window.b);//10 10
delete b;
console.log(b);//報錯
console.log(window.b);//undefined 
window.b = 10;
console.log(b,window.b);//10 10
delete window.b;
console.log(b);//報錯
console.log(window.b);//undefined

對象嵌套

　　對象可以嵌套，但必須逐層取值

var student = {
name : {
chinese : 1,
englisth : 2
},
sex : 1,
age : 26
}

　　[注意]取值只能一層一層取，如student.name.chinese，而不能跨過name，直接用student.chinese，因為與name的同級下也可能有叫chinese的元素

var object1 = {
object1_1:{
object1_1_1:{foo: 'bar'},
object1_1_2:{}
},
object1_2:{
object1_2_1:{},
object1_2_2:{}
}
};
console.log(object1.object1_1.object1_1_1.foo);//bar

實例方法

　　constructor:保存著用于創(chuàng)建當前對象的函數(shù)
　　hasOwnProperty(propertyName):用于檢查給定的屬性在當前對象實例中(而不是在實例的原型中)是否存在。其中，propertyName必須以字符串形式指定

　　isPrototypeOf(object):用于檢查傳入的對象是否是傳入對象的原型

　　propertyIsEnumerable(propertyName):用于檢查給定的屬性是否能夠使用for-in語句來枚舉。其中，propertyName必須以字符串形式指定

　　toLocaleString():返回對象的字符串表示，該字符串與執(zhí)行環(huán)境的地區(qū)對應(yīng)

　　toString():返回對象的字符串表示

　　valueOf():返回對象的字符串、數(shù)值或布爾值表示，通常與toString()方法的返回值相同

var myObject = {
mark: true
};
console.log(myObject.constructor);//function Object(){}
console.log(myObject.hasOwnProperty('mark'));//true
console.log(Object.prototype.isPrototypeOf(myObject));//true
console.log(myObject.propertyIsEnumerable('mark'));//true
console.log(myObject.toLocaleString());//[object Object]
console.log(myObject.toString());//[object Object]
console.log(typeof myObject.valueOf(),myObject.valueOf());// object Object{mark:true}

小結(jié)：

Object類型

　　對象其實就是一組數(shù)據(jù)和功能的集合。對象可以通過執(zhí)行new操作符后跟要創(chuàng)建的對象類型的名稱來創(chuàng)建。而創(chuàng)建Object類型的實例并為其添加屬性和（或）方法，就可以創(chuàng)建自定義對象。

var o = new Object();

　　Object的每個實例都具有下列屬性和方法：

　　● constructor——保存著用于創(chuàng)建當前對象的函數(shù)
　　● hasOwnProperty(propertyName)——用于檢查給定的屬性在當前對象實例中（而不是在實例的原型中）是否存在。其中，作為參數(shù)的屬性名(propertyName)必須以字符串形式指定（例如：o.hasOwnProperty("name")）
　　● isPrototypeOf(object)——用于檢查傳入的對象是否是另一個對象的原型
　　● propertyIsEnumerable(propertyName)——用于檢查給定的屬性是否能夠使用for-in語句來枚舉
　　● toString()——返回對象的字符串表示
　　● valueOf()——返回對象的字符串、數(shù)值或布爾值表示。通常與toString()方法的返回值相同。

您可能感興趣的文章: