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
|
---
title: Object.keys()
slug: Web/JavaScript/Reference/Global_Objects/Object/keys
tags:
- 'CCAC: Chrome Console Auto Copy'
- ECMAScript 5
- JavaScript
- Method
- Object
translation_of: Web/JavaScript/Reference/Global_Objects/Object/keys
---
<p>{{JSRef}}</p>
<p><code><strong>Object.keys()</strong></code> 方法会返回一个由一个给定对象的自身可枚举属性组成的数组，数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致 。</p>
<h2 id="Syntax" name="Syntax">语法</h2>
<pre class="syntaxbox"><code>Object.keys(<var>obj</var>)</code></pre>
<h3 id="Parameters" name="Parameters">参数</h3>
<dl>
<dt>obj</dt>
<dd>要返回其枚举自身属性的对象。</dd>
</dl>
<h3 id="返回值">返回值</h3>
<p>一个表示给定对象的所有可枚举属性的字符串数组。</p>
<h2 id="Description" name="Description">描述</h2>
<p><code>Object.keys</code> 返回一个所有元素为字符串的数组，其元素来自于从给定的<code>object</code>上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。</p>
<h2 id="例子">例子</h2>
<pre class="brush: js">// simple array
var arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); // console: ['0', '1', '2']
// array like object
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']
// array like object with random key ordering
var anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.keys(anObj)); // console: ['2', '7', '100']
// getFoo is a property which isn't enumerable
var myObj = Object.create({}, {
getFoo: {
value: function () { return this.foo; }
}
});
myObj.foo = 1;
console.log(Object.keys(myObj)); // console: ['foo']</pre>
<p>如果你想获取一个对象的所有属性,，甚至包括不可枚举的，请查看{{jsxref("Object.getOwnPropertyNames")}}。</p>
<h2 id="注意">注意</h2>
<p>在ES5里，如果此方法的参数不是对象（而是一个原始值），那么它会抛出 TypeError。在ES2015中，非对象的参数将被强制转换为一个对象。</p>
<pre class="brush: js">Object.keys("foo");
// TypeError: "foo" is not an object (ES5 code)
Object.keys("foo");
// ["0", "1", "2"] (ES2015 code)</pre>
<h2 id="Polyfill">Polyfill</h2>
<p>要在原生不支持的旧环境中添加兼容的<code>Object.keys</code>，请复制以下代码段：</p>
<pre class="brush: js">if (!Object.keys) {
Object.keys = (function () {
var hasOwnProperty = Object.prototype.hasOwnProperty,
hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
dontEnums = [
'toString',
'toLocaleString',
'valueOf',
'hasOwnProperty',
'isPrototypeOf',
'propertyIsEnumerable',
'constructor'
],
dontEnumsLength = dontEnums.length;
return function (obj) {
if (typeof obj !== 'object' && typeof obj !== 'function' || obj === null) throw new TypeError('Object.keys called on non-object');
var result = [];
for (var prop in obj) {
if (hasOwnProperty.call(obj, prop)) result.push(prop);
}
if (hasDontEnumBug) {
for (var i=0; i < dontEnumsLength; i++) {
if (hasOwnProperty.call(obj, dontEnums[i])) result.push(dontEnums[i]);
}
}
return result;
}
})()
};
</pre>
<p>上面的代码在IE7（也许IE8也是）下有个问题，就是如果传入一个来自其他 window 对象下的对象时，不可枚举的属性也会获取到。</p>
<p>另一个简单的实现，参见<a class="external" href="http://tokenposts.blogspot.com.au/2012/04/javascript-objectkeys-browser.html">Javascript - Object.keys Browser Compatibility</a>。</p>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-15.2.3.14', 'Object.keys')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td>Initial definition.<br>
Implemented in JavaScript 1.8.5</td>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-object.keys', 'Object.keys')}}</td>
<td>{{Spec2('ES6')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-object.keys', 'Object.keys')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容">浏览器兼容</h2>
<div>
<p>{{Compat("javascript.builtins.Object.keys")}}</p>
</div>
<h2 id="See_also" name="See_also">相关链接</h2>
<ul>
<li><a href="https://developer.mozilla.org/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
<li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li>
<li>{{jsxref("Object.create()")}}</li>
<li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
<li>{{jsxref("Object.values()")}}</li>
<li>{{jsxref("Object.entries()")}}</li>
</ul>
|
