設(shè)計(jì)模式并非是難以理解, 或是難以應(yīng)用到實(shí)踐中的, 相反的, 設(shè)計(jì)模式恰恰代表了某些場(chǎng)景下的最佳實(shí)踐! 這些設(shè)計(jì)模式通常被有經(jīng)驗(yàn)的開發(fā)者們所采用栗精。
設(shè)計(jì)模式是開發(fā)者們?cè)陂_發(fā)過程中面臨的一般問題的解決方案匕争。 這些解決方案是眾多開發(fā)者們經(jīng)過長(zhǎng)時(shí)間的實(shí)驗(yàn)和錯(cuò)誤所總結(jié)出來的
本文將講解前端 (javascript) 的設(shè)計(jì)模式概念!
構(gòu)造函數(shù)用于特定類型的對(duì)象, 不僅聲明了使用的對(duì)象, 構(gòu)造函數(shù)還可以接收參數(shù)以便第一次創(chuàng)建對(duì)象的時(shí)候設(shè)置對(duì)象的成員值, 要注意的是構(gòu)造函數(shù)模式所生成實(shí)例的屬性和方法都是獨(dú)立存在的
一個(gè)簡(jiǎn)單的構(gòu)造函數(shù)示例:
function Blog(name) {
this.name = name;
this.toName = function() {
return this.name;
}
}
或是將方法提出:
function Blog(name) {
this.name = name;
this.toName = toName;
}
function toName() {
return this.name;
}
構(gòu)造函數(shù)的函數(shù)名首字母大寫, 并且構(gòu)造函數(shù)內(nèi)部要是完整的, 不要依賴外部屬性
以下是一個(gè)錯(cuò)誤的示例
var name = 'hello world!';
function Blog() {
this.name = name;
this.toName = toName;
}
function toName() {
return this.name;
}
多數(shù)構(gòu)造函數(shù)都需要使用new來創(chuàng)建實(shí)例, 但有一種方式可以避免使用new來創(chuàng)建, 但是并不建議如此使用, 這樣寫代碼中可能引起歧義
function Blog(name) {
if (!(this instanceof Blog)) {
return new Blog(name);
}
this.name = name;
this.toName = toName;
}
function toName() {
return this.name;
}
加入代碼instanceof判斷之后, 當(dāng)直接使用Blog('hello world');時(shí), 也始終返回一個(gè)實(shí)例
原理是通過判斷this的instanceof是不是Blog來決定返回new Blog還是繼續(xù)執(zhí)行代碼狸吞，如果使用的是new關(guān)鍵字象颖，則(this instanceof Blog)為true讯榕，會(huì)繼續(xù)執(zhí)行下面的參數(shù)賦值冈绊，如果沒有用new镇饺，(this instanceof Blog)就為false乎莉，就會(huì)重新new一個(gè)實(shí)例返回。
使用場(chǎng)景
構(gòu)造函數(shù)模式的應(yīng)用比較廣泛, 但不經(jīng)常單獨(dú)使用, 一般是與原型模式結(jié)合使用, 如包裝一個(gè)常用的按鈕, 這種會(huì)重復(fù)使用的模塊, 只要是需要復(fù)用的模塊, 就可以應(yīng)用到構(gòu)造函數(shù)模式
其他設(shè)計(jì)模式
單例模式: http://www.reibang.com/p/4c0604f116ba
建造者模式: http://www.reibang.com/p/70cf4bb80549
簡(jiǎn)單工廠模式: http://www.reibang.com/p/4293450926c2
抽象工廠模式: http://www.reibang.com/p/d6138f36e6e2
裝飾者模式: http://www.reibang.com/p/16cf284ab810
外觀模式: http://www.reibang.com/p/179ae2a13c59
