1 files changed, 132 insertions, 0 deletions
diff --git a/files/zh-cn/web/javascript/reference/classes/constructor/index.html b/files/zh-cn/web/javascript/reference/classes/constructor/index.html
new file mode 100644
index 0000000000..334b80e7ad
--- /dev/null
+++ b/files/zh-cn/web/javascript/reference/classes/constructor/index.html
@@ -0,0 +1,132 @@
+---
+title: 构造方法
+slug: Web/JavaScript/Reference/Classes/constructor
+tags:
+  - Classes
+  - ECMAScript 2015
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Classes/constructor
+---
+<div>{{jsSidebar("Classes")}}</div>
+
+<p><strong> <code>constructor </code></strong>是一种用于创建和初始化<code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/class">class</a></code>创建的对象的特殊方法。</p>
+
+<p>{{EmbedInteractiveExample("pages/js/classes-constructor.html")}}</p>
+
+<h2 id="语法">语法</h2>
+
+<pre class="syntaxbox">constructor([arguments]) { ... }</pre>
+
+<h2 id="描述">描述</h2>
+
+<p>在一个类中只能有一个名为 “constructor” 的特殊方法。 一个类中出现多次构造函数 (<code>constructor)</code>方法将会抛出一个 {{jsxref("SyntaxError")}} 错误。</p>
+
+<p>在一个构造方法中可以使用<code>super</code>关键字来调用一个父类的构造方法。</p>
+
+<p>如果没有显式指定构造方法，则会添加默认的 constructor 方法。</p>
+
+<p>如果不指定一个构造函数(constructor)方法, 则使用一个默认的构造函数(constructor)。</p>
+
+<h2 id="示例">示例</h2>
+
+<h3 id="使用constructor方法">使用<code>constructor</code>方法</h3>
+
+<p>以下代码片段来自 <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">类的实例</a>（<a href="https://googlechrome.github.io/samples/classes-es6/index.html">在线 demo</a>）。</p>
+
+<pre class="brush: js">class Square extends Polygon {
+    constructor(length) {
+        // 在这里, 它调用了父类的构造函数, 并将 lengths 提供给 Polygon 的"width"和"height"
+        super(length, length);
+        // 注意: 在派生类中, 必须先调用 super() 才能使用 "this"。
+        // 忽略这个，将会导致一个引用错误。
+        this.name = 'Square';
+    }
+    get area() {
+        return this.height * this.width;
+    }
+    set area(value) {
+        // 注意：不可使用 this.area = value
+        // 否则会导致循环call setter方法导致爆栈
+        this._area = value;
+    }
+}
+
+</pre>
+
+<h3 id="另一个例子">另一个例子</h3>
+
+<p>看看这个代码片段</p>
+
+<pre class="brush: js">class Polygon {
+    constructor() {
+        this.name = "Polygon";
+    }
+}
+
+class Square extends Polygon {
+    constructor() {
+        super();
+    }
+}
+
+class Rectangle {}
+
+Object.setPrototypeOf(Square.prototype, Rectangle.prototype);
+
+console.log(Object.getPrototypeOf(Square.prototype) === Polygon.prototype); //false
+console.log(Object.getPrototypeOf(Square.prototype) === Rectangle.prototype); //true
+
+let newInstance = new Square();
+console.log(newInstance.name); //Polygon
+</pre>
+
+<p>这里，<strong>Square</strong>类的原型被改变，但是在正在创建一个新的正方形实例时，仍然调用前一个基类<strong>Polygon</strong>的构造函数。</p>
+
+<h3 id="默认构造方法">默认构造方法</h3>
+
+<p>如前所述，如果不指定构造方法，则使用默认构造函数。对于基类，默认构造函数是：</p>
+
+<pre class="brush: js">constructor() {}</pre>
+
+<p>对于派生类，默认构造函数是：</p>
+
+<pre class="brush: js">constructor(...args) {
+  super(...args);
+}</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('ES2015', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="浏览器兼容">浏览器兼容</h2>
+
+<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("javascript.classes.constructor")}}</p>
+
+<h2 id="参阅">参阅</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super()</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/class"><code>class</code> expression</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/class"><code>class</code> declaration</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Classes</a></li>
+</ul>