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
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
|
---
title: Reflect.construct()
slug: Web/JavaScript/Reference/Global_Objects/Reflect/construct
translation_of: Web/JavaScript/Reference/Global_Objects/Reflect/construct
---
<div>{{JSRef}}</div>
<p><code><strong>Reflect</strong></code><strong><code>.construct()</code></strong> 方法的行为有点像 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new"><code>new</code> 操作符</a> 构造函数 ， 相当于运行 <code>new target(...args)</code>.</p>
<h2 id="语法">语法</h2>
<pre class="syntaxbox notranslate">Reflect.construct(target, argumentsList[, newTarget])
</pre>
<h3 id="参数">参数</h3>
<dl>
<dt><code>target</code></dt>
<dd>被运行的目标构造函数</dd>
<dt><code>argumentsList</code></dt>
<dd>类数组，目标构造函数调用时的参数。</dd>
<dt><code>newTarget</code> {{optional_inline}}</dt>
<dd>作为新创建对象的原型对象的<code>constructor</code>属性， 参考 <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/new.target">new.target</a></code> 操作符，默认值为<code>target。</code></dd>
</dl>
<h3 id="返回值"><code>返回值</code></h3>
<p>以<code>target</code>（如果<code>newTarget</code>存在，则为<code>newTarget</code>）函数为构造函数，<code>argumentList</code>为其初始化参数的对象实例。</p>
<h3 id="异常">异常</h3>
<p>如果target或者newTarget不是构造函数，抛出{{jsxref("TypeError")}},异常。</p>
<h2 id="描述">描述</h2>
<p><code>Reflect.construct</code>允许你使用可变的参数来调用构造函数 ，这和使用<a href="https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/new">new操作符</a>搭配<a href="https://developer.mozilla.org/ zh-CN/docs/Web/JavaScript/Reference/Operators/new">对象展开符</a>调用一样。</p>
<pre class="brush: js notranslate">var obj = new Foo(...args);
var obj = Reflect.construct(Foo, args); </pre>
<h3 id="Reflect.construct_vs_Object.create"><code>Reflect.construct()</code> vs <code>Object.create()</code></h3>
<p><code>在新语法Reflect</code>出现之前，是通过明确指定构造函数和原型对象（ 使用{{jsxref("Object.create()")}}）来创建一个对象的。</p>
<pre class="brush: js notranslate">function OneClass() {
this.name = 'one';
}
function OtherClass() {
this.name = 'other';
}
// 创建一个对象:
var obj1 = Reflect.construct(OneClass, args, OtherClass);
// 与上述方法等效:
var obj2 = Object.create(OtherClass.prototype);
OneClass.apply(obj2, args);
console.log(obj1.name); // 'one'
console.log(obj2.name); // 'one'
console.log(obj1 instanceof OneClass); // false
console.log(obj2 instanceof OneClass); // false
console.log(obj1 instanceof OtherClass); // true
console.log(obj2 instanceof OtherClass); // true</pre>
<p>虽然两种方式结果相同，但在创建对象过程中仍一点不同。 </p>
<p>当使用<code>Object.create()</code>和{{jsxref("Function.prototype.apply()")}}时，如果不使用<code>new</code>操作符调用构造函数，构造函数内部的<code>new.target</code>值会指向<code>undefined</code>。</p>
<p>当调用<code>Reflect.construct()</code>来创建对象，<code>new.target</code>值会自动指定到<code>target</code>（或者newTarget，前提是newTarget指定了）。</p>
<pre class="brush: js notranslate">function OneClass() {
console.log('OneClass');
console.log(new.target);
}
function OtherClass() {
console.log('OtherClass');
console.log(new.target);
}
var obj1 = Reflect.construct(OneClass, args);
// 输出:
// OneClass
// function OneClass { ... }
var obj2 = Reflect.construct(OneClass, args, OtherClass);
// 输出:
// OneClass
// function OtherClass { ... }
var obj3 = Object.create(OtherClass.prototype);
OneClass.apply(obj3, args);
// 输出:
// OneClass
// undefined</pre>
<h2 id="举例"><strong>举例</strong></h2>
<h3 id="使用_Reflect.construct">使用 <code>Reflect.construct()</code></h3>
<pre class="brush: js notranslate">var d = Reflect.construct(Date, [1776, 6, 4]);
d instanceof Date; // true
d.getFullYear(); // 1776
</pre>
<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('ES6', '#sec-reflect.construct', 'Reflect.construct')}}</td>
<td>{{Spec2('ES6')}}</td>
<td>Initial definition.</td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-reflect.construct', 'Reflect.construct')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容">浏览器兼容</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>49</td>
<td>{{CompatGeckoDesktop(42)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Chrome for Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatGeckoMobile(42)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="相关链接">相关链接</h2>
<ul>
<li>{{jsxref("Reflect")}}</li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new"><code>new</code></a></li>
<li><code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/new.target">new.target</a></code></li>
</ul>
|
