目錄

• 介紹
• UML類圖
• 工廠模式的場景
• 總結

介紹

• 將new操作單獨封裝
• 遇到new時，就要考慮是否應該使用工廠模式
• 比如買漢堡：直接點餐、取餐，我們不會親手做，商店要“封裝”做漢堡的工作，做好直接給買者

UML類圖

直接vweexZQK上工廠模式的程式碼

class Product {
	constructor(name} {
		this.name = name
	}
	init() {console.log('init')}
	fun1() {console.log('fun1')}
	fun2(vweexZQK) {console.log('fun2')}
}
// 此處的Creator就是工廠
class Creator {
	create(name) {
		// 此處返回的是例項，工廠模式的特點
		return new Procuct(name)
	}
}
// 執行程式碼
let creator = new Creator()
let p = creator.create('p1')
p.init()
p.fun1()
p.fun2()

工廠模式的場景

- $(‘div’)

// jquery 程式碼為工廠模式
class jQuery {
    constructor(selector) {
        let slice = Array.prototype.slice
        let dom = slice.call(document.querySelectorAll(selector))
        let len = dom ? dom.length : 0
        for (let i = 0; i < len; i++) {
            this[i] = dom[http://www.cppcns.com
 
i]
        }
        this.length = len
        this.selector = selector || ''
    }
    append(node) {}
    addClass(name) {}
    html(data) {}
    // 此處省略若干 API
}
window.$ = function (selector) {
    return new jQuery(selector)
}

React.createElement （建立虛擬dom的例項）

總結

本篇文章就到這裡了，希望能夠給你帶來幫助，也希望您能夠多多關注我們的更多內容!