ECMA-262 把对象定义为:“无序属性的集合,其属性可以包含基本值、对象或者函数。”

严格来讲,这就相当于说对象是一组没有特定顺序的值。对象的每个属性或者方法都有一个名字,而每个名字都映射到一个值。

正因为这样,我们可以把 ECMAScript 的对象想象成散列表:无非就是一组名值对,其中值可以是数据或函数。

属性类型

ECMA-262 第5版在定义只有内部采用的特性(attribute)时,描述了属性(property)的各种特征。

定义这些特性是为了实现 JavaScript 引擎用的,因此在 JavaScript 中不能直接访问它们。为了表示特性是内部值,该规范把它们放在了两对儿方括号中,例如 [[Enumerable]] 。

ECMAScript 中有两种属性(property):数据属性和访问器属性。

1. 数据属性

数据属性包含一个数据值的位置。在这个位置可以读取和写入值。数据属性有4个描述其行为的特性。

  • [[Configurable]]:表示是否可以通过 delete 删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。一般这个特性默认为 true。
  • [[Enumerable]]:表示是否可以通过 for-in循环返回属性。默认为 true。
  • [[Writable]]:表示能否修改属性的值。默认为 true。
  • [[Value]]:包含这个属性的数据值。读取属性值的时候,从这个位置读;写入属性的值时,把新值保存在这个位置。默认值为 undefined。

要修改属性默认的特性,用 ECMAScript5 的 Object.definedProperty() 方法。这个方法接收三个参数:属性所在的对象,属性的名字和一个描述符对象。其中,描述符(descriptor)对象的属性必须是:configurable, enumerable, writable 和 value。设置其中的一个或多个值,可以修改对应的特性值。

var person = {};
Object.defineProperty(person, "name", {
writable: false,
value: "Nick"
}); alert(person.name); // "Nick"
person.name = "Gray";
alert(person.name); // "Nick" // name是只读属性,非严格模式下,赋值操作会被忽略;严格模式下,赋值操作会抛出错误
var person = {};
Object.defineProperty(person, "name", {
configurable: false;
value: "Nick"
}); alert(person.name); // "Nick"
delete person.name;
alert(person.name); // "Nick" // 把 configurable 设置为 false,表示不能从对象中删除属性
// 如果对这个属性调用 delete,则非严格模式下什么也不会发生,而在严格模式下回导致错误
// 而且,一旦把属性定义为不可配置,就再不能把它变回可配置了
// 此时,再调用 Object.defineProperty() 方法修改除 writable 之外的特性,都会导致错误

2. 访问器属性

访问器属性不包含数据值;它们包含一对儿 getter 和 setter 函数(不过,这两个函数都不是必需的)。

在读取访问器属性时,会调用 getter 函数,这个函数负责返回有效的值;在写入访问器属性时,会调用 setter 函数并传入新值,这个函数负责决定如何处理数据。访问器属性有如下4个特性:

  • [[Configurable]]:表示是否可以通过 delete 删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。一般这个特性默认为 true。
  • [[Enumerable]]:表示是否可以通过 for-in循环返回属性。默认为 true。
  • [[Get]]:在读取属性时调用的函数。默认值为 undefined。
  • [[Set]]:在写入属性时调用的函数。默认值为 undefined。

访问器属性不能直接定义,必须使用 Object.defineProperty() 来定义。

var book = {
_year: 2004,
edition: 1
}; Object.defineProperty(book, "year", {
get: function(){
return this._year;
},
set: function(newValue) {
if (newValue > 2004) {
this._year = newValue;
this.edition += newValue -2004;
}
}
}); book.year = 2005;
alert(book.edition); //

book 对象定义了两个默认的属性:_year 和 edition。_year前面的下划线是一种常用记号,用于表示只能通过对象方法访问的属性。而访问器属性 year 则包含一个 getter 函数和一个 setter 函数。getter 函数返回 _year 的值,setter 函数通过计算来确定正确的版本。因此,把 year 属性修改为 2005 会导致 _year 变成 2005,而 edition 变为2。这是使用访问器属性的常见方式,即设置一个属性的值会导致其它属性发生变化。

不一定非要同时指定 getter 和 setter。只指定 getter 意味着属性是不能写,尝试写入属性会别忽略。严格模式下,尝试写入只指定了getter 函数的属性会抛出错误。类似的,只指定 setter 函数的属性也不能读,否则非严格模式下会返回 undefined,而严格模式下会抛出错误。

支持 ECMASCript5 的这个方法 Object.defineProperty() 的浏览器有 IE9+, Firefox4+, Safari5+, Opera12+ 和 Chrome。在这个方法之前,要创建访问器属性,一般都使用两个非标注方法:__defineGetter__() 和 __defineSetter__()。

var book = {
_year: 2004,
edition: 1
}; // 定义访问器的旧有方法
book.__defineGetter__("year", function(){
return this._year;
}); book.__defineSetter__("year", function(newValue){
if (newValue > 2004) {
this._year = newValue;
this.edition += newValue - 2004;
}
}); book.year = 2005;
alert(book.edition); //

在不支持 Object.defineProperty() 方法的浏览器中不能修改 [[Configurable]] 和 [[Enumerable]]。

3. 定义多个属性

ECMAScript5 中定义了Object.defineProperties() 方法,可以通过描述符一次定义多个属性。

这个方法接收两个对象参数:

第一个对象是要添加或修改其属性的对象;第二个对象的属性与第一个对象中药添加或修改的属性一一对应。

var book = {};

Object.defineProperties(book, {
_year: {
value: 2004
}, edition: {
value: 1
}, year: {
get: function(){
return this._year;
}, set: function(newValue){
if(newValue > 2004){
this._year = newValue;
this.edition += newValue - 2004;
}
}
}
});

已上代码在 book 对象上定义了两个数据属性 _year 和 edition 和一个访问器属性 year。

最终的对象与上一节中定义的对象相同。唯一的区别是这里的属性都是同一时间创建的。

4. 读取属性的特性

使用 ECMASCript5 的 Object.getOwnPropertyDescriptor() 方法,可以取得给定属性的描述符。

这个方法接收两个参数:属性所在的对象和要读取其描述符的属性的名称。返回值是一个对象。

例如上一节所创建的 book 对象:

var descriptor = Object.getOwnPropertyDescriptor(book, "_year");
alert(descriptor.value); //
alert(descriptor.configurable); //false
alert(typeof descriptor.get) // "undfined" var descriptor = Object.getOwnPropertyDescriptor(book, "year");
alert(descriptor.value); // undefined
alert(descriptor.enumerable); //false
alert(typeof descriptor.get) // "function"

在 JavaScript 中,可以针对任何对象——包括DOM和BOM对象,使用 Object.getOwnPropertyDescriptor() 方法。

JavaScript: 理解对象的更多相关文章

  1. javascript 理解对象--- 定义多个属性和读取属性的特性

    一 定义多个属性 ECMAScript5 定义了一个Object.defineProperties()方法,用于定义多个属性.此方法接受两个对象参数: 第一个对象:要添加或修改其属性的对象 第二个对象 ...

  2. javascript 理解对象--- 属性类型

    ECMA-262 把对象定义为:无序属性的集合,其属性可以包含基本值.对象或者函数: var Person = { name:"wsc", age :"25", ...

  3. 03.JavaScript 面向对象精要--理解对象

    JavaScript 面向对象精要--理解对象 尽管JavaScript里有大量内建引用类型,很可能你还是会频繁的创建自己的对象.JavaScript中的对象是动态的. 一.定义属性 当一个属性第1次 ...

  4. 自己理解的javascript 的对象和类理解

    首先需要先理解类和对象的意义,我个人理解如下: 类:对象的抽象化: 对象:类的实体: javascript中没有class关键字和类的用法,只能用伪类来做类的,所以要用function来定义累的名字: ...

  5. javascript 面向对象程序设计--深刻理解对象

    javascript中,每个对象都是基于一个引用类型创建的,我们可以把ECMAScript 的对象想象成散列表:无非就是一组名值对,其中值可以是数据或函数. 深刻理解对象 创建自定义对象的最简单方式就 ...

  6. 转载:Javascript面向对象编程原理 -- 理解对象

    源地址:http://www.html-js.com/article/1717 虽然JavaScript中已经自带了很多内建引用类型,你还是会很频繁的需要创建自己的对象.JavaScript编程的很大 ...

  7. JavaScript 面向对象的程序设计(一)之理解对象属性

    首先,JavaScript 面向对象的程序设计,主要分三部分. 理解对象属性: 理解并创建对象: 理解继承. 本文主要从第一方面来阐述: 理解对象属性 首先我们来理解Javascript对象是什么?在 ...

  8. JavaScript 面向对象编程 · 理解对象

    前言:      在我们深入 面向对象编程之前 ,让我们先理解一下Javascript的 对象(Object),我们可以把ECMAScript对象想象成散列表,其值无非就是一组名值对,其中值可以是数据 ...

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

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

随机推荐

  1. HDU 1712 ACboy needs your help AC男需要你的帮助 (分组的背包)

    分组背包问题:有N件物品和一个容量为V的背包.第i件物品的体积是c[i],价值是w[i].这些物品被划分为若干组,每组中的物品互相冲突,最多选一件.求解将哪些物品装入背包可使这些物品的体积总和不超过背 ...

  2. Linux uart程序

    我用的是jetson tx1 开发板 都是linux系统出了串口文件可能不同其他的没有什么不同都能用. 我安装的是qt5 新建一个none  qt c工程,用c 语言开发 期间调试了两天结果还是发送和 ...

  3. 允许被ping设置方法

    参考下图设置:

  4. JS调试debug

    1. debugger; 我以前也说过,你可以在JavaScript代码中加入一句debugger;来手工造成一个断点效果.需要带有条件的断点吗?你只需要用if语句包围它: if (something ...

  5. 前端三大框架 Vue.js、AngularJS、React 的区别

    Vue.js Vue.js 是一种构建数据驱动的Web界面的渐进式框架,Vue.js 采用自底向上增量开发的设计. Vue.js 轻量高效,数据双向绑定(响应式数据绑定), 它会自动响应数据的变化情况 ...

  6. Bootstrap历练实例:简单的可折叠

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  7. 详解JVM工作原理和特点

    在我们运行和调试Java程序的时候,经常会提到一个JVM的概念.本文将为大家讲解JVM工作原理和特点,希望对大家有所帮助. AD:网+线下沙龙 | 移动APP模式创新:给你一个做APP的理由>& ...

  8. Java传值分析

    public class Example{String str=new String("good");char[] ch={'a','b','c'};public static v ...

  9. python 实现剪刀石头布(三局两胜)

    # -*- coding:utf-8 -*- import random # best of three def finger_guess(): rule = {1:'rock', 2:'paper' ...

  10. Python学习笔记(三):文件和集合操作

    python string与list互转 因为python的read和write方法的操作对象都是string.而操作二进制的时候会把string转换成list进行解析,解析后重新写入文件的时候,还得 ...