ECMAScript5之Object学习笔记(三)

2023-04-24,,

第三部分继续...

Object.getOwnPropertyDescriptor(obj, prop)

获取一个对象的属性描述符

根据"Own"这个词我们可以猜到,prop只能是obj的“直接”属性,prototype链上的无效

来几个直观的例子,以作说明:

     var person = {},
nameDesc, // name descriptor
titleDesc, // title descriptor
ageDesc; // age descriptor person.name = 'Andrew';
nameDesc = Object.getOwnPropertyDescriptor(person, 'name'); console.dir(nameDesc);
// { "configurable": true, "enumerable": true, "value": "Andrew", "writable": true } Object.defineProperty(person, 'title', {
value: 'sales manager',
writable: true
});
titleDesc = Object.getOwnPropertyDescriptor(person, 'title'); console.dir(titleDesc);
// { "configurable": false, "enumerable": false, "value": "sales manager", "writable": true } var _age = 25;
Object.defineProperty(person, 'age', {
get: function() {
return _age + ' years old';
},
set: function(age) {
_age = age;
}
}); person.age = 20;
console.log(_age); //
console.log(person.age) // 20 years old ageDesc = Object.getOwnPropertyDescriptor(person, 'age');
console.dir(ageDesc);
// { "configurable": false, "enumerable": false, "get": function () {...}, "set": function (age) {...} }

Object.getOwnPropertyNames(obj)

获取对象的(非原型链上的)“直接”属性名集合(无论该属性是否可列举)

代码示例如下:

     var arr = ['1st', '2nd', '3rd'];
console.log( Object.getOwnPropertyNames(arr) );
// ["0", "1", "2", "length"] var usa = {
president: 'Obama',
states: 52
};
console.log( Object.getOwnPropertyNames(usa) );
// ["president", "states"] Object.defineProperty(usa, 'population', {
enumerable: false,
value: '300million'
});
// 即使属性不可列举,依然能获得
console.log( Object.getOwnPropertyNames(usa) );
// ["president", "states", "population"]

Object.getPrototypeOf(obj)

返回对象的prototype

上代码:

     var Base = function() {}

     Base.prototype.base_method1 = function() {};
Base.prototype.base_method2 = function() {}; var base = new Base(); console.log( Object.getPrototypeOf(base) );
// { base_method1: function, base_method2: function } var Sub = function() {
Base.call(this);
} Sub.prototype = Object.create(Base.prototype);
Sub.prototype.constructor = Sub; Sub.prototype.sub_method1 = function() {}; var sub = new Sub();
console.log( Object.getPrototypeOf(sub) );
// { constructor: function, sub_method1: function, base_method1: function, base_method2: function }

为了方便说明,chrome中输出的内容如下:

从上面的例子,可以发现Object.getPrototypeOf(obj)可以返回对象的prototype,并且通过prototype链(通过__proto__)可以查看到”基类“从”父类“上继承的方法(或属性)。

在chrome中还可以看到返回的prototype对象包括constructor(构造函数)和__proto__(非标准,但现代浏览器都支持,当然IE除外)

Object.keys(obj)

返回对象自身的可列举属性集合

上代码:

     var arr = ['Tom', 'Focker', 'linkon'];
console.log( Object.keys(arr) );
// ["0", "1", "2"] var person = {
name: 'Andrew',
age: 25,
gender: 'male'
};
console.log( Object.keys(person) );
// ["name", "age", "gender"] Object.defineProperty(person, 'address', {
value: 'SuZhou,China',
enumerable: false
});
// address属性不可以列举,所以Object.keys的返回结果不变
console.log( Object.keys(person) );
// ["name", "age", "gender"]

第三部分就到此为止。

ECMAScript5之Object学习笔记(三)的相关教程结束。

《ECMAScript5之Object学习笔记(三).doc》

下载本文的Word格式文档,以方便收藏与打印。