javascript
javascript中创建对象的几种方式
雖然new Object( )和對象字面量的都可以用來創建單個對象,但有個缺點:如果使用同一接口創建許多對象,那么會產生冗余代碼。
一、工廠模式
function createPerson(name, age, job) {let person = new Object();person.name = name;person.age = age;person.job = job;person.sayName = () => {console.log(this.name);};return person; }; let person1 = createPerson('cc', 22, 'worker'); 復制代碼缺點:雖然解決了代碼冗余的問題,但無法識別每個對象的類型
二、構造函數模式
function Person(name, age, job) {this.name = name;this.age = age;this.job = job;this.sayName = () => {console.log(this.name);}; }; let person1 = new Person('cc', 22, 'worker'); console.log(person1.constructor === Person); //true console.log(person1 instanceof Person);//true 復制代碼以這種方式創建的對象實際上經歷了4個過程:
通過構造函數創建的對象有個constructor屬性(該屬性在對象的_proto_即原型中,指向構造函數)。 如果要檢測對象的類型,instanceof是操作符最為靠譜
缺點:每個方法都要在每個對象上重新創建一遍,對象之間不會共享方法,造成了內存空間的浪費,以下代碼證明了這一點
let person1 = new Person('cc', 22, 'worker'); let person2 = new Person('bb', 22, 'coder'); console.log(person1.sayName === person2.sayName); //false 復制代碼三、原型模式
我們創建的每個函數都會自動有一個prototype屬性,這個屬性是一個指針,指向一個對象,而這個對象的用途是包含可以由特定類型的所有實例共享的屬性和方法。(prototype就是通過調用構造函數而創建的那個對象實例的原型對象)。prototype中又會自動生成一個constructor屬性,該屬性指向我們創建的那個函數。我們通過該函數創建的實例中也會自動生成一個指向prototype的指針[[Prototype]](這個屬性一般不能訪問,但在瀏覽器的實現里,該屬性可以訪問,通常為__proto__)
使用原型對象的好處是。換句話說,不必在構造函數中定義對象實例的信息,而是可以將這些信息直接添加到原型對象中。
更常見的做法是用一個包含所有屬性和方法的對象字面量來重寫整個原型對象,并重設constructor屬性。
function Person(){ }Person.prototype={name:"cc",age:22,job:"worker",sayName:function(){console.log(this.name)} };Object.defineProperty(Person.prototype,"constructor",{enumerable:false,value:Person, }); 復制代碼單獨使用原型的弊端:
省略了為構造函數傳遞初始化參數這一環節,結果所有實例在默認情況下都將取得相同的屬性值,雖然這會在一定程度帶來一定的不便,但不是最大的問題,最大的問題是由其共享的本性所決定的。對于包含引用數據類型的值來說,會導致問題。(例如數組,如下修改person1的friends導致person2的friends也發生變化)
四、組合使用構造函數和原型模式
這是創建自定義類型的最常見的方式。構造函數模式用于定義實例屬性,而原型模式用于定義方法和共享的屬性。所以每個實例都會有自己的一份實例屬性的副本,但同時共享著對方法的引用,最大限度的節省了內存。同時支持向構造函數傳遞參數。
function Person(name,age,job){this.name=name;this.age=age;this.job=job;this.friends=["aa","bb"]; }Person.prototype={constructor:Person,sayName:function(){console.log(this.name);} };let person1=new Person('cc',22,'worker'); 復制代碼五、動態原型模式
function Person(name,age,job){this.name=name;this.age=age;this.job=job;if(typeof this.sayName!="function"){Person.prototype.sayName=function(){console.log(this.name);};} } 復制代碼這里只有sayName()不存在的情況下,才會將它添加到原型中,這段代碼只會在初次調用構造函數時才執行。這里對原型所做的修改,能夠立刻在所有實例中得到反映。
六、寄生構造函數模式和穩妥構造函數模式
寄生構造函數模式和不太常見,所以在這里不贅述
總結
以上是生活随笔為你收集整理的javascript中创建对象的几种方式的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 通过COS上传文件至腾讯云
- 下一篇: SpringCloud Ribbon源码