ECMAScript5新特性之對象篇

1、Ojbect.create(O[,properties]):

var Person = {
name : ‘hcc’,
hungry : false,
play : function (){
this.hungry = true;
return ‘I am playing!’;
},
speak : function () {
return ‘I am speaking!’;
}
};
var p = Object.create(Person);
我們發現這樣創建對象的方式更加簡化,以前是怎麼創建呢,我們先回憶一下:

function Person(name) {
this.name = name;
this.hungry = false;
}
Person.prototype = {
constructor : Person,
play : function () {
this.hungry = true;
return ‘I am playing!’;
},
speak : function () {
return ‘I am speaking!’;
}
};
還很熟悉吧。當然,這種創建對象的方式還可以簡化,形式如下:

var p = Object.create({
name : ‘hcc’,
hungry : false,
play : function () { this.hungry = true; return ‘I am playing!’; },
speak : function () { return ‘I am speaking!’; }
});
console.info(p);
2、Object.defineProperty

當然也可以配置該對象的單個屬性,並且可以配置屬性的特性,比如說,writeable,enumable,configuable, get ,set

Object.defineProperty( p, “age”, {
value: 24, // p.age = 24
writable: false, //This perperty is not allowd to be writen.
enumerable: true,
configurable: true
});
訪問該對象的age可以通過

console.info(p.age);
如你想象的一樣,顯示爲24.如果我們想設置這個屬性的值呢?

p.age = “33”;
console.info(p.age);
結果是33嗎?你可以把上面的代碼拷貝到ff的控制檯中運行下,結果並非你所願,結果還是原始值24,

原因就是將該屬性的writeable(Defaults to false)設置成了false,如果在設計是允許改變其值,可以改成true。我們再看下別的屬性:

configurable : 如果爲false,writeable,enumerable將不起作用。Defaults to false

enumerable : 如果爲true,可以使用for (var prop in obj){}進行遍歷。Defaults to false

再看下get,set的用法:

var Dog = {
name : ‘dog’
};
var dog = Object.create(Dog);

Object.defineProperty(dog, ‘age’, {
set : function (age) { this.humanYears = age * 7; },
get : function () { return this.humanYears / 7; },
enumerable : true
});

dog.age = 2;
console.info(dog.humanYears);
當執行到dog.age = 2時,就調用set方法。

3、Ojbect.defineProperties

該方法可以給對象一次性定義多個屬性,

var obj = {};

Object.defineProperties(obj, {
“value”: {
value: true,
writable: false
},
“name”: {
value: “John”,
writable: false
}
});
4、Other Feature

(1)Object.getOwnPropertyDescriptor(): 獲得對象自身的屬性描述(value,configure,writeable等),不包括動態添加的:

var Dog = {
name : ‘dog’
};
Dog.age = “123”;

Object.getOwnPropertyDescriptor(Dog, “name”);

Object.getOwnPropertyDescriptor(Dog, “123”);
(2)Object.keys

獲得對象的key值:

var obj = { name: “hcc”, age: “http://ejohn.org/“, address : “xi’an” };

console.info(Object.keys(obj).join(“,”));
另:Object.keys基本等同於Object.getOwnPropertyNames(),後者返回的是字符串數組,前者返回的是對象的屬性。

(3)Object.seal() and Object.isSealed()

seal的英文意思是“密封,封條”的意思。在這裏就是阻止代碼修改或刪除對象的描述、增加屬性、。功能基本等同Object.freeze()和Object.isFrozen(),只不過這兩個方法使得屬性不可編輯。

(4)檢測是否是動態增加的對象

var obj = {};
obj.name = “hcc”;

console.info(obj.name);
console.info(Object.isExtensible(obj));//檢測是否是擴展的

Object.preventExtensions(obj);//阻止其擴展屬性
console.info(Object.isExtensible(obj));//重新檢測

obj.age = 23;
console.info(obj.age);
通過運行代碼可以發現,當設置阻止對象擴展屬性後,重新設置age屬性,將不再起作用,所以obj.age的屬性爲undefined。

好了。ES5的基本特性就基本介紹完了,有問題請留言。

發佈了60 篇原創文章 · 獲贊 22 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章