一篇文章帶你瞭解JavaScript-對象
創建對象
對象直接量
對象直接量是由若幹名/值對組成的映射表,名/值對中間用冒號分隔,名/值對之間用逗號分隔,整個映射表用花括號括起來。
var empty = {}; var point = { x:0, y:0}; var point2 = {x:point.x, y:point.y+1}; var book = { "main title":"JavaScript", //屬性名字裡有空格,必須用字符串表示 "sub-title":"The", //屬性名字裡有連字符,必須用字符串表示 "for":"all", //"for"是保留字,必須用字符串表示 author:{ //這個屬性的值是一個對象 name:"123" //註意,在裡的屬性名都沒有引號 } };
通過new創建對象
var o = new Object(); //創建一個空對象,和{}一樣 var a = new Array(); //創建一個空數組,和[]一樣 var d = new Date(); //創建一個表示當前時間的Date對象 var r = new RegExp("js"); //創建一個可以進行匹配的RegExp對象
原型
所有通過對象直接量創建的對象都具有同一個原型對象,並可以通過JavaScript代碼Object.prototype獲得對原型對象的引用。通過關鍵字new和構造函數調用創建的對象的原型就是構造函數的prototype屬性的值。因此,同使用{}創建對象一樣,通過new Object()創建的對象也繼承自Object.prototype。同樣,通過new Array()創建的對象的原型就是Array.prototype,通過new Date()創建的對象的原型就是Date.prototype。
沒有原型的對象為數不多,Object.prototype就是其中之一。它不繼承任何屬性。其他原型對象都是普通對象,普通對象都具有原型。所有的內置構造函數(以及大部分自定義的構造函數)都具有一個繼承自Object.prototype的原型。例如,Date.prototype的屬性繼承自Object.prototype,因此由new Date()創建的Date對象的屬性同時繼承自Date.prototype和Object.prototype。這一系列鏈接的原型對象就是所謂的“原型鏈”(prototype chain)。
Object.create()
創建一個新對象,其中第一個參數是這個對象的原型。Object.create()提供第二個可選參數,用以對對象的屬性進行進一步描述。
Object.create()是一個靜態函數,而不是提供給某個對象調用的方法。使用它的方法很簡單,隻須傳入所需的原型對象即可:
var AB = Object.create({x:1,y:2});
屬性的查詢和設置
var a = book.author; //得到book的"author"屬性 book.edition = 6; //給book創建一個名為"edition"的屬性並賦值 book["main title"] = "123" //給"main title"屬性賦值
繼承
假設要查詢對象o的屬性x,如果o中不存在x,那麼將會繼續在o的原型對象中查詢屬性x。如果原型對象中也沒有x,但這個原型對象也有原型,那麼繼續在這個原型對象的原型上執行查詢,直到找到x或者查找到一個原型是null的對象為止。
var o = {} o.x = 1;//給o定義一個屬性x var p = inherit(o);//p繼承o p.y = 2;//給p定義一個屬性y var q = inherit(p);//q繼承p q.z = 3;//給q定義一個屬性z q.x + q.y // 3 x和y分別繼承自o和p
屬性賦值操作首先檢查原型鏈,以此判定是否允許賦值操作。如果允許屬性賦值操作,它也總是在原始對象上創建屬性或對已有的屬性賦值,而不會去修改原型鏈。
var u = { r:1 }; var c = inherit(u); c.x = 1; c.y =1; c.r =2; u.r; // 1 原型對象沒有修改
屬性訪問錯誤
當book沒有a屬性
book.a // undefined var l = book.a.length; //拋出一個類型錯誤異常,undefined沒有屬性
刪除屬性
delete運算符可以刪除對象的屬性。
delete book.author; //book不再有屬性author delete book["main title"]; //book不再有屬性"main title"
delete運算符隻能刪除自有屬性,不能刪除繼承屬性(要刪除繼承屬性必須從定義這個屬性的原型對象上刪除它,而且這會影響到所有繼承自這個原型的對象)。
當delete表達式刪除成功或沒有任何副作用(比如刪除不存在的屬性)時,它返回true。如果delete後不是一個屬性訪問表達式,delete同樣返回true:
o = {x:1}; delete o.x; //刪除x,返回true delete o.x; //什麼都沒做(x已經不存在瞭),返回true delete o.toString; //什麼也沒做(toString是繼承來的),返回true delete 1; //無意義,返回true
delete不能刪除那些可配置性為false的屬性
在這些情況下的delete操作會返回false:
delete Object.prototype;//不能刪除,屬性是不可配置的 var x = 1; //聲明一個全局變量 delete this.x; //不能刪除這個屬性 function f (){}//聲明一個全局函數 delete this.f; //也不能刪除全局函數
檢測屬性
in運算符的左側是屬性名(字符串),右側是對象。如果對象的自有屬性或繼承屬性中包含這個屬性則返回true:
var o = { x:1 } "x" in o; //true "x"是o的屬性 "y" in o; //false "y"不是o的屬性 "toString" in o; //true o繼承toString屬性
對象的hasOwnProperty()方法用來檢測給定的名字是否是對象的自有屬性。對於繼承屬性它將返回false:
var o = { x:1 } o.hasOwnProperty("x");//true o有一個自有屬性x o.hasOwnProperty("y");//false o中不存在屬性y o.hasOwnProperty("toString");//false toString是繼承屬性
propertyIsEnumerable()是hasOwnProperty()的增強版,隻有檢測到是自有屬性且這個屬性的可枚舉性(enumerable attribute)為true時它才返回true。
var o = inherit({ y:2}); o.x = 1; o.propertyIsEnumerable("x"); //true o有一個可枚舉的自有屬性x o.propertyIsEnumerable("y"); //false y是繼承來的 Object.propertyIsEnumerable("toString"); //false 不可枚舉
除瞭使用in運算符之外,另一種更簡便的方法是使用“!==”判斷一個屬性是否是undefined:
var o = { x:1 } o.x !== undefined; //true o中有屬性x o.y !== undefined; //false o中沒有屬性y o.toString !== undefined; //true o繼承瞭toString屬性
序列化對象
對象序列化(serialization)是指將對象的狀態轉換為字符串,也可將字符串還原為對象。ECMAScript 5提供瞭內置函數JSON.stringify()和JSON.parse()用來序列化和還原JavaScript對象。這些方法都使用JSON作為數據交換格式,JSON的全稱是“JavaScript Object Notation”
o = {x:1, y:{z:[false,null,""]}}; s = JSON.stringify(o); //s是'{"x":1,"y":{"z":[false,null,""]}}' p = JSON.parse(s); // p == o
總結
本篇文章就到這裡瞭,希望能給你帶來幫助,也希望您能夠多多關註WalkonNet的更多內容!
推薦閱讀:
- JavaScript判斷是否為數組的各種方法匯總
- JS疑惑的數據類型及類型判斷方法詳解
- JS判斷對象屬性是否存在的五種方案分享
- 分享JavaScript 類型判斷的幾種方法
- Javascript中判斷對象是否具有屬性的5種方法分享