JavaScript 的簡(jiǎn)單數(shù)據(jù)類型是數(shù)字、字符串浴骂、布爾值(true/false)钱磅、null 以及 undefined巩踏,其它所有的值都是對(duì)象。這些對(duì)象是可變的鍵值對(duì)集合续搀。
對(duì)象是屬性的容器塞琼,每個(gè)屬性都有名字和值。屬性的名字可以是包含空字符串在內(nèi)的任何字符串禁舷,而屬性值是除 undefined 值之外的任意值彪杉。
對(duì)象是無(wú)類型的毅往,它對(duì)屬性的名字和值沒(méi)有類型限制。所以對(duì)象很適合匯集和管理數(shù)據(jù)派近。對(duì)象可以包含其他對(duì)象攀唯,所以可以很容易地表示成樹(shù)狀或圖形數(shù)據(jù)結(jié)構(gòu)。
使用原型鏈渴丸,可以讓一個(gè)對(duì)象繼承另一個(gè)對(duì)象的屬性侯嘀。合理地使用這一特性,可以減少初始化對(duì)象所消耗的內(nèi)存和時(shí)間谱轨。
1 對(duì)象字面量
對(duì)象字面量是包圍在一對(duì)花括號(hào)中的零或多個(gè)名值對(duì)戒幔,它可以出現(xiàn)在任何允許表達(dá)式出現(xiàn)的地方:
var empty_object = {};
var stooge = {
"first-name": "deniro",
"last-name": "Li"
};
屬性的名字可以是包含空字符串在內(nèi)的任何字符串。如果屬性名是合法的 JavaScript 標(biāo)識(shí)符土童,則可以不加引號(hào)诗茎。逗號(hào)用來(lái)分隔多個(gè)名值對(duì)。
屬性值可以是任意的表達(dá)式(包括另一個(gè)對(duì)象字面量)献汗,即對(duì)象是可潛逃的:
var flight = {
airline: "Oceanic",
number: 815,
departure: {
IATA: "SYD",
time: "2017-08-02 19:00",
city: "Sydney"
},
arrival: {
IATA: "LAX",
time: "2017-08-03 21:37",
city: "Los Angeles"
}
};
2 檢索
可以使用 [ ]
語(yǔ)法來(lái)獲取對(duì)象的值敢订。如果字符串表達(dá)式是一個(gè)字符串字面量,而且它又是一個(gè)合法的 JavaScript 標(biāo)識(shí)符罢吃,那么也可以使用 .
語(yǔ)法楚午。優(yōu)先使用 .
語(yǔ)法,因?yàn)樗o湊尿招,而且可讀性更好:
console.log(stooge["first-name"]);//"deniro"
console.log(flight.departure.IATA);//"SYD"(優(yōu)先考慮 . 表示法)
如果要檢索的屬性的值不存在矾柜,會(huì)返回 undefined:
console.log(stooge["middle-name"]);
console.log(flight.status);
console.log(stooge["FIRST-NAME"]);
||
運(yùn)算符可用來(lái)填充默認(rèn)值:
console.log(stooge["middle-name"] || "(none)");//(none)
console.log(flight.status || "unknown");//unknown
從 undefined 的屬性中取值會(huì)拋出 TypeError 異常,我們可以使用 &&
來(lái)避免這個(gè)問(wèn)題:
console.log(flight.equipment);//undefined
//console.log(flight.equipment.model);//拋出 TypeError
console.log(flight.equipment && flight.equipment.model);//undefined
3 更新
可以通過(guò)賦值語(yǔ)句來(lái)更新對(duì)象的值泊业。如果屬性名已存在于對(duì)象中把沼,那么屬性的值就會(huì)被替換:
stooge["first-name"] = "lily";
console.log(stooge["first-name"]);//"lily"
如果對(duì)象之前沒(méi)有這個(gè)屬性啊易,那么這個(gè)新屬性就會(huì)被擴(kuò)充到對(duì)象中:
stooge["middle-name"] = "Song";
console.log(stooge["middle-name"]);//"Song"
stooge.nickname = "Deniro";
console.log(stooge.nickname);//"Deniro"
flight.equipment = {
model: "Boeiing 787"
};
console.log(flight.equipment.model);//"Boeiing 787"
flight.status = "overdue";
console.log(flight.status);//"overdue"
4 引用
對(duì)象是通過(guò)引用來(lái)傳遞的吁伺,所以它們永遠(yuǎn)不會(huì)被復(fù)制:
var x = stooge;
x.nickname = "Lucy";
console.log(stooge.nickname);//"Lucy";x 與 stooge 指向同一個(gè)引用
var a = {}, b = {}, c = {};//a租谈、b篮奄、c 引用一個(gè)不同的空對(duì)象
a = b = c = {};//a、b割去、c 引用同一個(gè)空對(duì)象
5 原型
每個(gè)對(duì)象都連接到一個(gè)原型對(duì)象窟却,然后繼承原型對(duì)象的屬性。所有通過(guò)對(duì)象字面量創(chuàng)建的對(duì)象都連接到 Object.prototype呻逆,它是標(biāo)配對(duì)象夸赫。
創(chuàng)建一個(gè)新對(duì)象時(shí),可以指定某個(gè)對(duì)象作為它的原型咖城。我們?yōu)?Object 新增一個(gè) create 方法茬腿,它會(huì)創(chuàng)建并返回一個(gè)使用原對(duì)象作為原型對(duì)象的新對(duì)象:
if (typeof Object.beget !== "function") {
Object.create = function (o) {
var F = function () {
};
F.prototype = o;
return new F();
}
}
var another_stooge = Object.create(stooge);
更新某個(gè)對(duì)象時(shí)呼奢,是不會(huì)更新原型對(duì)象的:
another_stooge["first-name"] = "Jack";
console.log(another_stooge["first-name"]);//"Jack"
console.log(stooge["first-name"]);//"lily"
只有在檢索的時(shí)候,才會(huì)用到原型對(duì)象切平。如果沒(méi)有在對(duì)象中檢索到某個(gè)屬性握础,那么 JavaScript 就會(huì)試著從原型對(duì)象中獲取屬性值,如果還是沒(méi)有找到悴品,JavaScript 就會(huì)沿著原型鏈向上回溯禀综,直到 Object。如果都不存在苔严,就會(huì)返回 undefined定枷。
原型關(guān)系是動(dòng)態(tài)的關(guān)系。如果我們新增一個(gè)屬性到原型鏈中邦蜜,那么這個(gè)屬性就會(huì)立即對(duì)所有基于該原型所創(chuàng)建的對(duì)象可見(jiàn):
stooge.profession = "actor";
console.log(another_stooge.profession);//"actor"
6 反射
typeof 操作符有助于確定屬性的類型:
console.log(typeof flight.number);//number
console.log(typeof flight.status);//string
console.log(typeof flight.arrival);//object
console.log(typeof flight.manifest);//undefined
注意原型鏈中的任何屬性都會(huì)產(chǎn)生值:
console.log(typeof flight.toString);//function
console.log(typeof flight.constructor);//function
有兩種方法可以去除這些屬性:
- 檢查并丟棄值為函數(shù)的屬性依鸥。
- 使用 hasOwnProperty 方法,如果對(duì)象擁有獨(dú)有的屬性悼沈,它就會(huì)返回 true:
console.log(flight.hasOwnProperty("number"));//true
console.log(flight.hasOwnProperty("constructor"));//false
7 枚舉
for in 語(yǔ)句會(huì)遍歷一個(gè)對(duì)象中的所有屬性名贱迟,所以要過(guò)濾掉那些你不想要的屬性:
var name;
for (name in another_stooge) {
if (typeof another_stooge[name] !== 'function') {//過(guò)濾掉函數(shù)
document.writeln(name + ': ' + another_stooge[name] + "; ");
}
}
屬性名出現(xiàn)的順序是不確定的。如果要讓屬性以特定的順序出現(xiàn)絮供,就要?jiǎng)?chuàng)建一個(gè)包含特定屬性名的數(shù)組:
var i;
var properties = [
"first-name",
"middle-name",
"last-name",
'profession'
];//定義想要的屬性以及屬性順序
for (i = 0; i < properties.length; i += 1) {
document.writeln(properties[i] + ": " + another_stooge[properties[i]] + "; ");
}
7 刪除
delete 運(yùn)算符會(huì)刪除對(duì)象的屬性衣吠,但它不會(huì)涉及原型鏈中的任何對(duì)象。
刪除對(duì)象的屬性可能會(huì)讓來(lái)自原型鏈的屬性呈現(xiàn)出來(lái):
another_stooge.nickname = "Jack";
console.log(another_stooge.nickname);//Jack
delete another_stooge.nickname;
console.log(another_stooge.nickname);//Lucy
8 減少全局變量的污染
全局變量削弱了程序的靈活性壤靶,所以要避免使用缚俏。
只創(chuàng)建一個(gè)唯一的全局變量:
var MYAPP = {};
這個(gè)變量就變成我們應(yīng)用的容器:
MYAPP.stooge = {
"first-name": "deniro",
"last-name": "Li"
};
MYAPP.flight = {
airline: "Oceanic",
number: 815,
departure: {
IATA: "SYD",
time: "2017-08-02 19:00",
city: "Sydney"
},
arrival: {
IATA: "LAX",
time: "2017-08-03 21:37",
city: "Los Angeles"
}
};
要把全局性的資源都納入一個(gè)命名空間下,這樣我們的程序與其他類庫(kù)發(fā)生沖突的可能性會(huì)顯著降低贮乳,而且程序也變得更易閱讀忧换。