1凸郑、工廠模式
1.png
Creator就像一個(gè)工廠一樣 ， 生成一個(gè)個(gè)Product實(shí)例
/*
* 將new操作單獨(dú)封裝
* 遇到new時(shí)矛市、就要考慮是否使用工廠模式
*/
class Product {
constructor (name) {
this.name = name
}
fn1 () {
}
}
class Creator {
create (name) {
return new Product(name)
}
}
const creater = new Creator()
const p = creater.create('terry')
console.log(p)
應(yīng)用場(chǎng)景：
1芙沥、 JQuery --- $('div')
class JQuery {
constructor(selector) {
const ele = Array.prototype.slice.call(document.querySelectorAll(selector))
const len = ele.length
for (let i = 0; i < len; i++) {
this[i] = ele[i]
}
this.selector = selector
this.length = len
}
html() {
}
css(data) {
}
// ...
}
window.$ = function (selector) {
return new JQuery(selector)
}
2、React.createElement()
// React.createElement("div", null)
class Vnode {
...
}
React.createElement = function(tag, attrs, children) {
return new Vnode(tag, attrs, children)
}
3浊吏、 Vue異步組件
單例模式
系統(tǒng)中被唯一使用的而昨； 一個(gè)類只有一個(gè)實(shí)例；
// 模擬
class SingleObject {
login() {
console.log('login')
}
}
// 靜態(tài)方法
SingleObject.getInstance = (function() {
let instance
return function() {
if (!instance) {
instance = new SingleObject()
}
return instance
}
})()
/**
* 什么叫單例模式找田， 每次獲取的都是同一個(gè)東西
*/
let obj1 = SingleObject.getInstance()
obj1.login()
let obj2 = SingleObject.getInstance()
obj2.login()
console.log('obj1 === obj2', obj1 === obj2) // obj1 === obj2 true 【什么叫單例模式歌憨， 每次獲取的都是同一個(gè)東西】
裝飾器模式
觀察者模式/發(fā)布訂閱模式
代理模式
