JavaScript中,对象的属性有两种:数据属性和访问器属性。

数据属性

特性:

数据属性包括一个数据值的位置。在这个位置可以读取和写入值。数据属性有4个特性。

  • [[configurable]]:可配置。表示能否删除属性、能否修改属性的特性、能否把属性变为访问器属性。
  • [[enumerable]]:可枚举。表示能否通过for-in循环进行遍历。
  • [[writable]]:可写。表示能否修改属性的值。
  • [[value]]:表示这个属性的数据值。
设置:

ES5提供了Object.defineProperty()方法,来设置属性的默认特性。该方法接收三个参数:属性所在对象、属性名字、属性描述符对象。其中,描述符对象用来设置configurable、enumerable、writable、value中的一个或多个值。

ES5也提供了Object.defineProperties方法,可以定义多个属性。

  • 在设置了属性的特性后,任何尝试超过configurable或writable权限的操作,在非严格模式下将会被忽略,在严格模式下将会抛出错误。
  • 一旦把属性定义为configurable: false,就不能再变回configurable: true了。否则,无论是否处于严格模式,都会抛出TypeError错误。
  • 例外:即便属性是foncigurable: false,仍然可以把writable的状态由true改为false,但是无法由false改为true。
  1. var person = {};
  2. Object.defineProperty(person, 'name', {
  3. configurable: false,
  4. writable: false,
  5. value: 'Nicholas'
  6. });
  7. // 测试:删除属性
  8. delete person.name; // 由于configurable: false,删除失败
  9. console.log(person.name); // Nicholas
  10. // 测试:修改特性
  11. Object.defineProperty(person, 'name', {
  12. configurable: true
  13. }); // 抛出错误:TypeError: Cannot redefine property: name
  14. // 测试:修改属性的值
  15. person.name = 'Greg'; // 由于writable: false,修改失败
  16. console.log(person.name); // Nicholas
  • 结合configurable: falsewritable: false,就可以创建一个真正的常量属性。
  • Object.seal()方法,会在一个现有对象上调用Object.preventExtensions(),并把所有属性标记为configurable: false
  • Object.freeze()方法,会在一个现有对象上调用Object.seal(),并把所有属性标记为writable: false
读取:

ES5提供了Object.getOwnPropertyDescriptor()方法,来取得给定属性的描述符。该方法接收两个参数:属性所在对象、属性名字。返回值是一个对象,其属性有configurable、enumerable、writable、value。

还有一种区分枚举属性enumerable的方法是propertyIsEnumerable()。该方法不检查原型链。

  • 在调用Object.defineProperty()方法时,如果不指定,configurable、enumerable、writable的默认值为false。
  • 对于直接定义在对象上的属性,configurable、enumerable、writable的默认值为true,value的值为undefined。
  1. // 使用Object.definedProperty设置的属性
  2. var descriptor = Object.getOwnPropertyDescriptor(person, 'name');
  3. console.log(descriptor.configurable); // false
  4. console.log(descriptor.enumerable); // false
  5. console.log(descriptor.writable); // false
  6. console.log(descriptor.value); // Nicholas
  7. // 直接定义在对象上的属性
  8. var person2 = { name: "Greg" };
  9. var descriptor2 = Object.getOwnPropertyDescriptor(person2, 'name');
  10. console.log(descriptor2.configurable); // true
  11. console.log(descriptor2.enumerable); // true
  12. console.log(descriptor2.writable); // true
  13. console.log(descriptor2.value); // Greg
  14. // propertyIsEnumerable()方法
  15. console.log(person.propertyIsEnumerable('name')); // false
  16. console.log(person2.propertyIsEnumerable('name')); // true
关于可枚举属性
  • Object.keys(obj)会返回一个数组,包含所有可枚举属性。不检查原型链。
  • Object.getOwnPropertyNames(obj)会返回一个数组,包含所有属性,无论是否枚举。不检查原型链。
  • prop in obj会返回一个布尔值,判断对象的属性是否存在,无论是否枚举。检查原型链。
  • obj.hasOwnProperty(prop)会返回一个布尔值,判断对象的指定属性是否存在,无论是否枚举。不会检查原型链。
  • 不可枚举的属性,不会出现在for-in循环的遍历中。
  1. var myObject = {};
  2. Object.defineProperty(myObject, 'a', {
  3. enumerable: true,
  4. value: 2
  5. });
  6. Object.defineProperty(myObject, 'b', {
  7. enumerable: false,
  8. value: 3
  9. });
  10. // propertyIsEnumerable
  11. console.log(myObject.propertyIsEnumerable('a')); // true
  12. console.log(myObject.propertyIsEnumerable('b')); // false
  13. // Object.keys()
  14. console.log(Object.keys(myObject)); // ["a"]
  15. // Object.getOwnPropertyNames()
  16. Object.getOwnPropertyNames(myObject); // ["a", "b"]
  17. // in操作符
  18. console.log('a' in myObject); // true
  19. console.log('b' in myObject); // true
  20. console.log('toString' in myObject); // true
  21. // hasOwnProperty()
  22. console.log(myObject.hasOwnProperty('a')); // true
  23. console.log(myObject.hasOwnProperty('b')); // true
  24. console.log(myObject.hasOwnProperty('toString')); // false
  25. // 遍历
  26. for (var k in myObject) {
  27. console.log( k, myObject[k] );
  28. } // a 2

访问器属性

特性:

访问器属性有4个特性。对于访问器属性,JavaScript会忽略它们的writable和value特性,取而代之的该关心get和set属性。

  • [[configurable]]:表示能否删除属性、能否修改属性的特性、能否把属性变为访问器属性。
  • [[enumerable]]:表示能否通过for-in循环进行遍历。直接定义在对象上的属性,默认值为true。
  • [[get]]:读取属性时调用的函数。直接定义在对象上的属性,默认值为undefined。
  • [[set]]:写入属性时调用的函数。直接定义在对象上的属性,默认值为undefined。
设置:

同样使用Object.defineProperty()方法和Object.defineProperties方法设置访问其属性。

  • 不一定非要同时指定getter和setter函数。
  • 只指定getter函数意味着属性不能写。尝试写入属性,在非严格模式下将会被忽略,在严格模式下将会抛出错误。
  • 只指定setter函数意味着属性不能读。尝试读取属性,在非严格模式下将会返回undefined,在严格模式下将会抛出错误。
  1. var book = {
  2. _year: 2004,
  3. edition: 1
  4. };
  5. Object.defineProperty(book, 'year', {
  6. get: function() {
  7. return this._year;
  8. },
  9. set: function(newYear) {
  10. if (newYear > 2004) {
  11. this._year = newYear;
  12. this.edition += (newYear - 2004);
  13. }
  14. }
  15. });
  16. // 测试
  17. book.year = 2005; // 注意:defineProperty中定义的属性名为year,而非_year
  18. console.log(book.edition); // 2

另一种设置getter和setter函数的方法如下:

  1. var myObject = {
  2. // 定义getter
  3. get foo() {
  4. return 'You get: ' + this._foo_;
  5. },
  6. // 定义setter
  7. set foo(val) {
  8. this._foo_ = val;
  9. }
  10. }
  11. // 测试
  12. myObject.foo = 2;
  13. console.log(myObject.foo); // You get: 2
读取:

同样使用Object.getOwnPropertyDescriptor()方法取得给定属性的描述符。

  • 在调用Object.defineProperty()方法时,如果不指定,configurable、enumerable的默认值为false,get、set的默认值为undefined。
  • 对于直接定义在对象上的属性,configurable、enumerable的默认值为true。
  1. // 使用Object.definedProperty设置的属性
  2. var descriptor = Object.getOwnPropertyDescriptor(book, 'year');
  3. console.log(descriptor.configurable); // false
  4. console.log(descriptor.enumerable); // false
  5. console.log(typeof descriptor.get); // function
  6. console.log(typeof descriptor.set); // function
  7. // 直接定义在对象上的属性
  8. var descriptor = Object.getOwnPropertyDescriptor(myObject, 'foo');
  9. console.log(descriptor.configurable); // true
  10. console.log(descriptor.enumerable); // true
  11. console.log(typeof descriptor.get); // function
  12. console.log(typeof descriptor.set); // function

参考:《JavaScript高级程序设计》、《你不知道的JavaScript(上卷)》

JavaScript中对象的属性类型的更多相关文章

  1. JavaScript中对象的属性

    在JavaScript中,属性决定了一个对象的状态,本文详细的研究了它们是如何工作的. 属性类型 JavaScript中有三种不同类型的属性:命名数据属性(named data properties) ...

  2. 记录,javascript中对象的属性名是字符串,却可以不用引号

    问题描述:今日看书,里面介绍js的对象的属性名是包括空字符串在内的所以字符串 问题来了,我们平时定义的对象如下,是没有引号""or’'的 var someone  = {    f ...

  3. javascript中对象的属性的特性

    1.ES5的属性特性包括下面六个: configurable: 表示能否通过delete来删除属性从而重新定义属性,能够修改属性的特性,默认为true enumberable: 表示是否能通过for- ...

  4. JavaScript中对象的属性:如何遍历属性

    for/in 语句循环遍历对象的属性. js中获取key得到某对象中相对应的value的方法:obj.key js中根据动态key得到某对象中相对应的value的方法有二: 一.var key = & ...

  5. javascript中对象字面量的理解

    javascript中对象字面量与数组字面量 第一部分 我们知道JavaScript中的数据类型有基本数据类型和引用类型,其中Object类型就是非常常用的类型.那么如果创建一个Object类型的实例 ...

  6. 关于JavaScript中对象的继承实现的学习总结

    一.原型链 JavaScript 中原型链是实现继承的主要方法.其主要的思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.实现原型链有一种基本模式,其代码如下. function Super ...

  7. javascript中对象的深度克隆

    记录一个常见的面试题,javascript中对象的深度克隆,转载自:http://www.2cto.com/kf/201409/332955.html 今天就聊一下一个常见的笔试.面试题,js中对象的 ...

  8. Javascript中对象的Obeject.defineProperty()方法-------------(ES5/个人理解)

    在讲到Obeject.defineProperty()方法之前先得说明一下ECMAScript中有两种属性:数据属性和访问器属性. 两种属性存在的意义:描述对象属性(key)的一些特性,因为这些属性是 ...

  9. C#保留2位小数几种场景总结 游标遍历所有数据库循环执行修改数据库的sql命令 原生js轮盘抽奖实例分析(幸运大转盘抽奖) javascript中的typeof和类型判断

    C#保留2位小数几种场景总结   场景1: C#保留2位小数,.ToString("f2")确实可以,但是如果这个数字本来就小数点后面三位比如1.253,那么转化之后就会变成1.2 ...

随机推荐

  1. Redis、Memcache

    ★ Redis redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set(集合).zset(sor ...

  2. 【状压DP】【P2831】【NOIP2016D2T3】愤怒的小鸟

    传送门 Description Kiana 最近沉迷于一款神奇的游戏无法自拔. 简单来说,这款游戏是在一个平面上进行的. 有一架弹弓位于 $(0,0)$ 处,每次 Kiana 可以用它向第一象限发射一 ...

  3. Poco::Path 和 DirectoryIterator

    #include<iostream>#include<typeinfo>#include<Poco/Path.h>using namespace std;using ...

  4. Tomcat启动时报org.springframework.web.context.ContextLoaderListener错误解决方案

    问题现象:新从svn上检出maven的项目maven+spring+springmvc项目在Tomcat启动时,报如下错误. 严重: Error configuring application lis ...

  5. 阐述ArrayList、Vector、LinkedList的存储性能和特性?

    ArrayList 和Vector他们底层的实现都是一样的,都是使用数组方式存储数据,此数组元素数大于实际存储的数据以便增加和插入元素,它们都允许直接按序号索引元素,但是插入元素要涉及数组元素移动等内 ...

  6. Desert King 最小比率生成树 (好题)

    Description David the Great has just become the king of a desert country. To win the respect of his ...

  7. LruCache:从网络加载图片缓存实例

    OOM异常 堆内存用于存储实例对象,当程序不断创建对象,并且对象都有引用指向,那么垃圾回收机制就不会清理这些对象,当对象多到挤满堆内存的上限后,就产生OOM异常.Android系统为每个应用程序使用的 ...

  8. 【题解】Crash的数字表格 BZOJ 2154 莫比乌斯反演

    题目传送门 http://www.lydsy.com/JudgeOnline/problem.php?id=2154 人生中第一道自己做出来的莫比乌斯反演 人生中第一篇用LaTeX写数学公式的博客 大 ...

  9. bzoj 1131 [POI2008]Sta 树形dp 转移根模板题

    [POI2008]Sta Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 1889  Solved: 729[Submit][Status][Discu ...

  10. How to configue session timeout in Hive

    This article explains how to configure the following settings in Hive:hive.server2.session.check.int ...