亚洲精品久久久中文字幕-亚洲精品久久片久久-亚洲精品久久青草-亚洲精品久久婷婷爱久久婷婷-亚洲精品久久午夜香蕉

您的位置:首頁技術文章
文章詳情頁

js 創建對象的多種方式與優缺點小結

瀏覽:112日期:2024-04-03 17:25:16
早期創建方式

var obj = new Object()obj.name =’xxx’obj.age = 18或使用對象字面量var o1 = { name: ’xxx’, say: () => {}}var o2 = { name: ’xxx’, say: () => {}}

缺點:使用同一個接口創建很多對象,會產生大量重復代碼

工廠模式

function factory(name,age) { var obj = new Object() obj.name = name obj.age = age return obj}var o1 = factory(1, 11)var o2 = factory(2, 22)

優點:解決了創建多個相似對象代碼重復問題缺點:無法識別對象是什么類型

構造函數模式

ECMAScript中可以使用構造函數創建特定類型的對象,如Object,Array這種原生構造函數。此外,也可以創建自定義構造函數,從而定義自定義對象的屬性和方法。

function Person(name, age) { this.name = name this.age = age this.sayName = function() { console.log(this.name) }}var o1 = new Person(1,11)var o2 = new Person(2,22)o1.sayName() // 1o2.sayName() // 2

優點:構造函數模式創建的實例可以區分類型標識(instanceof 判斷)缺點:每個方法都需要在實例上重新創建,如 兩個實例的sayName方法任務相同,但是實際創建了兩個Function實例

構造函數模式優化

function Person(name, age) { this.name = name this.age = age}function sayName () { console.log(this.name)}var o1 = new Person(1,11)var o2 = new Person(2,22)o1.sayName() // 1o2.sayName() // 2

優點:多個實例共享在全局作用域中定義的函數,解決了兩個函數做同一件事的問題缺點:全局作用域定義的函數實際上只能被某個對象調用,全局作用域名不副實,而且如果對象需要定義很多方法,需要創建很多個全局函數,這讓自定義的對象類型沒有封裝特性。

原型模式

我們創建的每個函數都有一個protoype屬性,這個屬性是一個指針,指向一個對象。這個對象的用途是包含了可以由特定類型的所有實例共享的屬性和方法。即prototype就是由構造函數創建的那個對象實例的原型對象。

function Person(){}Person.prototype.name = ’123’Person.prototype.age = 18Person.prototype.sayName = function() { console.log(this.name)}var o1 = new Person(1,11)var o2 = new Person(2,22)o1.sayName() // 123o2.sayName() // 123

優點:解決了實例共享屬性或事件的問題缺點:因為實例共享屬性的原因,對于值為引用類型的屬性來說,一個實例的修改會導致其他實例訪問值更改。如:

function Person(){}Person.prototype.name = ’123’Person.prototype.age = 18Person.prototype.friends = [’a’, ’b’]Person.prototype.sayName = function() { console.log(this.name)}var o1 = new Person(1,11)var o2 = new Person(2,22)o1.friends.push(’c’)console.log(o2.friends) // [’a’, ’b’, ’c’]構造函數和原型模式組合

function Person(name, age) { this.name = name this.age = age this.friends = [’a’]}Person.prototype = { constructor: Person, sayName: function() { console.log(this.name) }}var o1 = new Person(1,11)var o2 = new Person(2,22)o1.sayName() // 1o2.sayName() // 2

優點:每個實例有自己的屬性,同時又共享著方法的引用,還支持傳參數

動態原型模式

function Person(name, age) { this.name = name this.age = age this.friends = [’a’] if(typeof this.sayName != ’function’) { Person.prototype.sayName = function() { console.log(this.name) } }}var o1 = new Person(1,11)var o2 = new Person(2,22)o1.sayName() // 1o2.sayName() // 2

優點:僅在方法不存在的時候創建一次,避免重復創建

寄生構造函數模式

function SpecialArray() { var o = new Array() // 添加值 o.push.apply(o, arguments) // 添加方法 o.toPipedString = function(){ return this.join(’|’) } return o}var o1 = new SpecialArray(1,11)o1.toPipedString() // 1|11

優點:在不更改原始構造函數的情況下為對象添加特殊方法缺點:返回的對象與構造函數以及構造函數的原型沒有任何關系,該方法與在構造函數外部創建的對象沒有什么不同

穩妥構造函數模式

function Person(name) { var o = new Object() // 添加方法 o.getName = function(){ return name } return o}var o1 = new Person(1)o1.getName() // 1

與寄生構造函數不同在于,不使用this,不使用new調用優點:除了使用getName外沒有任何方法能夠訪問name,在一些安全的環境使用缺點:與工廠模式相似,無法識別對象所屬類型

以上就是js 創建對象的多種方式與優缺點小結的詳細內容,更多關于js 創建對象的資料請關注好吧啦網其它相關文章!

標簽: JavaScript
相關文章:
主站蜘蛛池模板: 偷拍久久网 | 国产在线一二三区 | 婷婷香蕉 | 97色伦色在线综合视频 | 亚洲欧美精品一中文字幕 | 蕾丝视频在线看片国产 | 日韩在线不卡 | 国内精品福利爱丝视频_速发 | 久久精品丝袜 | 精品久久久日韩精品成人 | 久久夜色精品国产尤物 | 国产亚洲一区二区手机在线观看 | 成人久久18免费软件 | 国产伦精品一区二区三区免 | 国产成人精品日本亚洲18图 | 婷婷亚洲五月色综合 | 亚洲国产欧美日韩一区二区 | 日本黄色一级毛片 | 免费国产一区二区三区 | 亚洲国产最新 | 亚洲国产视频网站 | 国产在线精品二区韩国演艺界 | 三级理论中文字幕在线播放 | 国产精品女人在线观看 | 成人欧美一区二区三区白人 | 高清不卡毛片 | 99色在线视频 | 99精品国产一区二区青青牛奶 | 青草国产| 日本一级特黄毛片高清视频 | 国产亚洲美女精品久久久 | 深夜爽爽爽gif福利免费 | aaa在线| 成人啪啪网 | 亚洲综合图色40p | 99久久久久国产精品免费 | 色播亚洲精品网站 亚洲第一 | 妇女自拍偷自拍亚洲精品 | 黄色影院免费 | 国产精品99久久久久久宅男 | 国产1024观看免费视频 |