-
Notifications
You must be signed in to change notification settings - Fork 30
/
object.md
312 lines (213 loc) · 7.68 KB
/
object.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
JavaScript 中的对象,和其它编程语言中的对象一样,可以比照现实生活中的对象来理解它。 JavaScript 中对象的概念可以比照着现实生活中实实在在的物体来理解。
在 JavaScript 中,一个对象可以是一个单独的拥有属性和类型的实体。拿它和一个杯子做下类比,一个杯子是一个对象,拥有属性。杯子有颜色、图案、重量等等。同样, JavaScript 对象也有属性来定义它的特征。
方法 是关联到某个对象的函数,或者简单地说,一个方法是一个值为某个函数的对象属性。定义方法就象定义普通的函数,除了它们必须被赋给对象的某个属性。
### 对象分类- 内置对象/原生对象就是 JavaScript 语言预定义的对象。在 ECMAScript 标准定义,由 JavaScript 解释器/引擎提供具体实现。- 宿主对象指的是 JavaScript 运行环境提供的对象。一般是由浏览器厂商提供实现(目前也有独立的 JavaScript 解释器/引擎提供实现),主要分为 BOM 和 DOM。- 自定义对象就是由开发人员自主创建的对象。## 创建对象### 对象初始化器方式使用对象初始化器也被称作通过字面值创建对象。通过对象初始化器创建对象的语法如下:
```javascript
var obj = { property_1: value_1, // property_# 作为一个标示符 property_2: value_2, // 标示符可以是一个数字值 // ..., "property_n": value_n // 标示符也可以是一个字符串};
```
- obj 是创建的对象名称。- 标示符和值都是可选的。### 构造函数方式- 通过 JavaScript 提供的预定义类型的构造函数来创建对象,如下示例:
```javascript
var date = new Date();// 创建一个 Date 对象var str = new String("this is string.");// 创建一个 String 对象var num = new Number(100);// 创建一个 Number 对象
```
- 通过 JavaScript 提供的 Object 类型的构造函数来创建自定义对象,如下示例:
```javascript
var obj = new Object();// 创建一个自定义对象
```
### Object.create() 方法
Object.create() 方法创建一个拥有指定原型和若干个指定属性的对象。语法如下:
```javascript
Object.create(proto, [ propertiesObject ])
```
参数:
- proto 参数: 一个对象,作为新创建对象的原型。- propertiesObject 参数: 可选。该参数对象是一组属性与值,该对象的属性名称将是新创建的对象的属性名称,值是属性描述符。
通过 Object.create() 方法创建一个新对象,同时扩展自有属性:
```javascript
var flyer = { name : "A380", speed : 1000 }var plane = Object.create( flyer,{ capacity : { value : 555, writable : true, enumerable : true }});
```
Object.create() 方法的一些特殊用法:
- 创建一个原型为 null 的空对象。```javascript
var obj = Object.create( null );
```
- 实现子类型构造函数的原型继承父类型构造函数的原型。```javascript
Sub.prototype = Object.create( Super.prototype );
```
- 创建普通空对象。```javascript
var obj = Object.create( Object.prototype );// 等效于 var o = {}
```
## 对象的属性
### 定义对象的属性一个 JavaScript 对象有很多属性。一个对象的属性可以被解释成一个附加到对象上的变量。对象的属性和普通的 JavaScript 变量基本没什么区别,仅仅是属性属于某个对象。
- 可以通过点符号来访问一个对象的属性。```javascript
var myCar = new Object();myCar.make = "Ford";myCar.model = "Mustang";myCar.year = 1969;
```
- JavaScript 对象的属性也可以通过方括号访问。对象有时也被叫作关联数组, 因为每个属性都有一个用于访问它的字符串值。```javascript
var myCar = new Object();myCar["make"] = "Ford";myCar["model"] = "Mustang";myCar["year"] = 1969;
```
### 访问对象的属性- JavaScript 可以通过点符号来访问一个对象的属性。
```javascript
var emp = { ename : 'Tom', salary : 3500 };emp.ename = 'Tommy';// 修改属性的值console.log(emp.ename);// 获取属性的值
```
- JavaScript 对象的属性也可以通过方括号访问。```javascript
var emp = { ename : 'Tom', salary : 3500 };emp[ 'ename' ] = 'Tony';// 修改属性的值console.log(emp[ "ename" ]);// 获取属性的值
```
### 遍历(枚举)属性JavaScript 提供了三种原生方法用于遍历或枚举对象的属性:
- for…in 循环: 该方法依次访问一个对象及其原型链中所有可枚举的属性。
```javascript
var emp = { ename : 'Tom', salary : 3500 };
for (var n in emp){
console.log(n, emp[n]);
}
```
- Object.keys( object ) 方法: 该方法返回一个对象 o 自身包含(不包括原型中)的所有属性的名称的数组。
```javascript
var emp = { ename : 'Tom', salary : 3500 };
var arr = Object.keys(emp);
for (var i=0;i<arr.length;i++){
console.log(arr[i],emp[arr[i]]);
}
```
- Object.getOwnPropertyNames( object ) 方法: 该方法返回一个数组,它包含了对象 o 所有拥有的属性(无论是否可枚举)的名称。```javascript
var emp = { ename : 'Tom', salary : 3500 };
var arr = Object.getOwnPropertyNames(emp);
for (var i=0;i<arr.length;i++){
console.log(arr[i],emp[arr[i]]);
}
```
### 属性访问出错当不确定对象是否存在、对象的属性是否存在时,可以使用错误处理结构 try…catch 语句块来捕捉抛出的错误,避免程序异常终止。```javascript
//访问未声明的变量console.log( emp );// ReferenceEerror//访问未声明的属性 var emp = { };console.log( emp.ename );// undefined//访问未声明的属性的成员console.log( emp.ename.length );// TypeError
```
### 检测对象的属性可以使用如下四种方法检测对象中是否存在指定属性:
- 使用 in 关键字。```javascript
console.log( 'ename' in emp );
```
- 使用 Object 对象的 hasOwnProperty() 方法。```javascript
console.log( emp.hasOwnProperty( 'ename' ));
```
- 使用 undefined 进行判断。```javascript
console.log( emp.ename === undefined );
```
- 使用 if 语句进行判断。```javascript
if( emp.ename ){
console.log( 'ename属性存在' );
}
```
### 删除对象的属性可以用 delete 操作符删除一个不是继承而来的属性。如下示例:
```javascript
// 创建一个 myobj 对象,具有 a 和 b 属性var myobj = new Object;myobj.a = 5;myobj.b = 12;// 删除 myobj 对象的自有属性 adelete myobj.a;
```
## 对象的方法### 定义对象的方法定义方法就象定义普通的函数,除了它们必须被赋给对象的某个属性。如下示例:
```javascript
var obj = new Object();obj.sayMe = function(){ console.log( "this is me." );}var obj = { name : "javascript", sayMe : function(){ console.log( "this is me." ); }}
```
### 调用对象的方法对象方法的调用类似于对象属性的调用,同样具有以下两种方式:
- 通过点符号来访问一个对象的方法。```javascript
var obj = new Object();obj.sayMe = function(){ console.log( "this is me." );}obj.sayMe();// 调用 obj 对象的 sayMe 方法
```
- 也可以通过方括号访问一个对象的方法。```javascript
var obj = { name : "javascript", sayMe : function(){ console.log( "this is me." ); }}obj[ "sayMe" ]();// 访问 obj 对象的 sayMe 方法
```
### 删除对象的方法可以用 delete 操作符删除对象的方法,如下示例:
```javascript
var obj = { name : "javascript", sayMe : function(){ console.log( "this is me." ); }}delete obj.sayMe;// 这里没有 "()"
```
> **值得注意的是:** 删除对象的方法时,不需要小括号“()”。如果有小括号则删除失败。