JavaScript创建对象4种方法详解

   <h2>1、工厂模式</h2>    <p>弊端：没有解决对象的识别问题，即怎么知道一个对象的类型。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/3b1f4d51b01e59f8b8628f717a95a4ef.png"></p>    <h2>2、构造函数模式</h2>    <p style="text-align:center"><img src="https://simg.open-open.com/show/b19dc7be03e4427ab10a761e4e2b445a.png"></p>    <p>与工厂模式相比：</p>    <p>1、没有显式的创建对象</p>    <p>2、直接将属性和方法赋给了this对象</p>    <p>3、没有return语句</p>    <p>要创建person的实例，必须使用new操作符，以这种方式调用构造函数实际上会经历4个步骤：</p>    <p>1、创建一个新对象</p>    <p>2、将构造函数的作用域赋给新对象</p>    <p>3、执行构造函数中的代码</p>    <p>4、返回新对象</p>    <p>创建自定义的构造函数可以将它的实例标识为一种特定的类型。</p>    <p>构造函数的缺点：</p>    <p>每个方法都有在每个实例上重新创建一遍。person1和person2都有一个sayName()的方法，但两个方法不是同一个Function实例。不同实例上的同名函数是不相等的。</p>    <p>创建两个完成同样任务的Function实例没有必要，而且还有this对象在，不需要在执行代码前就把函数绑定在特定对象上，可以像下面这样。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/e1c38e5f201059b3296e42138f4b1f70.png"></p>    <p>把sayName属性设置成全局的sayName函数，这样，由于sayName包含的是一个指向函数的指针，因此person1和person2对象就共享了同一个函数。</p>    <p>但是，如果对象需要定义很多方法，那么就要定义很多全局函数，自定义的引用类型也没有封装可言了。为了解决上述问题，引入原型模式。</p>    <h2>3、原型模式</h2>    <p>理解原型对象</p>    <p>我们创建的每个函数都有一个prototype属性，这个属性是一个指针，指向一个对象，而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。prototype是通过调用构造函数而创建的那个对象实例的对象原型，使用原型对象的好处是可以让所有对象实例共享它所包含的属性和方法。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/bcb1948f7b44a7ef4b05d5e298ec0e17.png"></p>    <p>首先，解析器会问实例person1是否有name属性，如果有，就返回。</p>    <p>如果没有，就继续去person1的原型中搜索name属性，如果有就返回。</p>    <p>如果没有，再继续向person1的原型的原型中搜索。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/db8100c0e83ebe468a6f8ae634015265.jpg"></p>    <p>isPrototypeOf()确定实例和原型对象之间的关联</p>    <pre>  <code class="language-javascript">console.log(Person.prototype.isPrototypeOf(person1)); //true</code></pre>    <p>Object.getPrototypeOf()返回的是[[prototype]]的值</p>    <pre>  <code class="language-javascript">console.log(Object.getPrototypeOf(person1));   //Person {name: “Yvette”, age: 26, job: “engineer”} 返回的是Person的原型对象。   console.log(Object.getPrototypeOf(person1) === Person.prototype)//true   console.log(Object.getPrototypeOf(person1).name);//”Yvette”</code></pre>    <p>hasOwnProperty()方法可以检测一个属性是存在于实例中，还是存在于原型中，只有给定属性存在于实例中，才会返回true。</p>    <pre>  <code class="language-javascript">console.log(person1.hasOwnProperty(“name”));//false</code></pre>    <p>原型与in操作符</p>    <p>有两种方式使用in操作符：单独使用和在for-in循环中使用。单独使用时，in操作符会在通过对象能够访问给定属性时返回true，无论该属性在于实例中还是原型中。</p>    <p>使用for in循环，返回的是所有能够通过对象访问的、可枚举的属性，其中既包括实例中的属性，也包括存在于原型中的属性。如果实例中的属性屏蔽了原型中不可枚举的属性，那么也会返回。IE9之前的版本实现上有一个Bug,屏蔽不可枚举属性的实例属性不会在for-in中返回。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/d0912a799eac547061b28b2098ac4de0.png"></p>    <p>在IE9之前的吧按本中没有log信息。尽管person实例中的toString()方法屏蔽了原型中的不可 枚举的toString();</p>    <p>原型简写</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/41cce766cbae5229d73fbc230c1f4ddc.png"></p>    <p>这导致了person1.constructor不再指向Person，而是指向了Object。如果constructor很重要，则需要特意将其设为适当的值，如：</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/10eb4b2138165dc605c32fb4ec7d48d3.png"></p>    <p>但是这种方式会导致constructor属性变成可枚举。</p>    <p>如果想设置为不可枚举的（默认不可枚举），可以使用</p>    <pre>  <code class="language-javascript">Object.defineProperty(Person.prototype, “constructor”, {   enumerable: false,   value: Person   });</code></pre>    <p>原型的动态性</p>    <p>由于在原型中查找值的过程是一次搜索，因此我们对原型对象所做的任何修改都能够立即从实例上反映出来。</p>    <p>如果重写整个原型对象，情况就不一样了。调用构造函数时会为实例添加一个指向最初原型的[[prototype]]指针，而把原型修改为另外一个对象就等于切断了构造函数与最初原型之间的联系。实例中的指针仅指向原型，而不指向构造函数。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/537308b04d4e17846011549e1bbb70ec.png"></p>    <p>person.prototype指向的是原本的原型对象，而不会指向新的原型对象。</p>    <p>原型对象的问题</p>    <p>原型模式最大问题是由其共享的本性所导致的。</p>    <p>对于包含引用类型值的属性来说，问题较为突出</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/6d026ffcf33ca5f3add98dfc77a8dfae.png"></p>    <p>本意只想修改person1的friends，但是却导致person2的friends属性值也改变了。因此我们很少单独使用原型模式。</p>    <h2>4、组合使用构造模式和原型模式</h2>    <p>创建自定义类型的最常用的方式，就是组合使用构造函数模式与原型模式。构造函数模式用于定义实例属性，原型模式用于定义方法和共享的属性，这样每个实例都有自己的一份实例属性的副本，又同时共享着对方法的引用，最大限度的节省了内存。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/b1c8d20e726a00b0e0e2fd45294add1d.png"></p>    <p>除了以上几种方式以外，另外还有动态原型模式，寄生构造模式和稳妥构造模式，但是鉴于使用频率较低，不再赘述。</p>    <p> </p>    <p>来自：http://原网站已经失效/article/javascript-create-array.html</p>    <p> </p>