JavaScript学习——面向对象的程序设计（一）

JavaScript——理解对象

面向对象（Object-Oriented,OO）

ECMAScript中没有类的概念，因此它的对象也与基于类的语言中的对象有所不同。

ECMA-262把对象定义为：无序属性的集合，其属性可以包含基本值、对象或者函数。（想象成散列表：一组名值对，其中值可以是数据或函数。）

每个对象都是基于一个引用类型创建的。

eg:

var box = {name : "chenxiaoming",age : 18,job : "Web-dev"}

对象属性在创建时都会带有一些特征值（characteristic），JavaScript通过这些特征值来定义它们的行为。

理解对象

1.属性类型

ECMAScript中有两种属性：数据属性和访问器属性

a.数据属性

数据属性包含一个数据值的位置。数据属性有4个描述其行为的特性。

[[Configurable]]:表示能否通过delete删除属性从而重新定义属性。默认为true。

[[Enumerable]]:表示能否通过for-in循环返回属性。默认为true。

[[Writable]]:表示能否修改属性的值。默认为true。

[[Value]]:包含这个属性的数据值。默认为undefined.

要修改属性默认的特性，必须使用ECMAScript5的Object.defineProperty()方法。这个方法接受三个参数：属性所在的对象、属性的名字和一个描述符对象（descriptor）。描述符对象的属性为configurable、enumerable、writable、value。设置其中的一个或多个值，可以修改对应的特性值。

eg:

var box = {};Object.defineProperty(box,"name",{writable : false,value : "chenxiaoming"});console.log(box.name);//chenxiaomingperson.name = "Greg";console.log(box.name);//chenxiaoming

注意严格模式和非严格模式下，属性值设置不同所产生的不同错误。

b.访问器属性

在读取访问器属性时，会调用getter函数，这个函数负责返回有效的值。

在写入访问器属性时，会调用setter函数并传入新值，这个函数负责决定如何处理数据。

访问器属性有：

[[Configurable]]:表示能否通过delete删除属性从而重新定义属性。默认为true。

[[Enumerable]]:表示能否通过for-in循环返回属性。默认为true。

[[Get]]:在读取属性时调用的函数。默认值为undefined。

[[Set]]:在写入属性时调用的函数。默认值为undefined。

eg:

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;

console.log(book.edition);//2

_year前面的下划线是一种常用的几号，用于表示只能通过对象访问的属性。

设置一个属性的值会导致其他属性发生变化。
非严格模式下，不一定非要同时指定getter和setter。

严格模式下，尝试写入只指定了getter函数的属性会抛出错误。类似的，只指定setter函数的属性也不能读，否则在非严格模式下会返回undefined。

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

2.定义多个属性

Object.defineProperties()，利用这个方法可以通过描述符一次定义多个属性。这个方法接收两个参数：第一个对象是要添加和修改其属性的对象那个，第二个对象的属性与第一个对象中要添加或修改的属性一一对应。

eg:

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

这种方法定义属性与Object.defineProperty()唯一的区别是这里的属性都是在同一时间创建的。

3.读取属性的特性

使用ECMAScript5的Object.getOwnPropertyDescriptor()方法，可以取得给定属性的描述符。这个方法接收两个参数：属性所在的对象和要读取其描述符的属性名称。返回值是一个对象。

eg:

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;console.log(book.edition);//2var descriptior = Object.getOwnPropertyDescriptor(book,"_year");console.log(descriptior.value);console.log(descriptior.configurable);//trueconsole.log(descriptior.enumerable);//trueconsole.log(descriptior.writable);//trueconsole.log(typeof descriptior.get);//undefined

---

以上笔记整理自《JavaScript权威指南》/《JavaScript高级程序设计（第3版）》，用做个人学习分享。