javascript設(shè)計(jì)模式 – 解釋器模式原理與用法實(shí)例分析
本文實(shí)例講述了javascript設(shè)計(jì)模式 – 解釋器模式原理與用法。分享給大家供大家參考,具體如下:
介紹:之前在做java開發(fā)時(shí),數(shù)據(jù)庫(kù)的增刪改查特別頻繁,并且場(chǎng)景不同需要用到的SQL語(yǔ)句頁(yè)都不同,如何用調(diào)用方法的形式來(lái)使用sql語(yǔ)句,拼接sql?這就是這一節(jié)我們要講的解釋器模式。
定義:定義一個(gè)語(yǔ)言的文法,并且建立一個(gè)解釋器來(lái)解釋該語(yǔ)言中的句子,這里的語(yǔ)言是指使用規(guī)定格式和語(yǔ)法的代碼。解釋器模式是一種類行為型模式。
場(chǎng)景:我們實(shí)現(xiàn)一個(gè)解釋器,用來(lái)判斷傳遞的數(shù)字是奇數(shù)還是偶數(shù),是正數(shù)還是負(fù)數(shù),是正奇數(shù)還是負(fù)奇數(shù)。
示例:
var TerminalExpression = function(data){
this.data = data;
this.interpret = function(context){
if(context === this.data){
return true;
}
return false;
}
}
var OrExpression = function(exprArr){
this.exprArr = exprArr;
this.interpret = function(context){
var isMatch = false;
this.exprArr.map(function(item){
if(item.interpret(context)){
isMatch = true;
}
})
return isMatch;
}
}
var AndExpression = function(exprArr){
this.exprArr = exprArr;
this.interpret = function(context){
var isMatch = true;
this.exprArr.map(function(item){
if(!item.interpret(context)){
isMatch = false;
}
})
return isMatch;
}
}
function getEvenExpression(){
var ExpressionList = [];
for(var i = -10; i<100; i++){
if(i % 2 == 0){
ExpressionList.push(new TerminalExpression(i));
}
}
return new OrExpression(ExpressionList);
}
function getOddExpression(){
var ExpressionList = [];
for(var i = -10; i<100; i++){
if(i % 2 != 0){
ExpressionList.push(new TerminalExpression(i));
}
}
return new OrExpression(ExpressionList);
}
function getNegativeOddExpression(){
var ExpressionList = [];
for(var i = -10; i<100; i++){
if(i < 0){
ExpressionList.push(new TerminalExpression(i));
}
}
return new OrExpression(ExpressionList);
}
var isEven = getEvenExpression();
var isOdd = getOddExpression();
var isNegative = getNegativeOddExpression();
var isNegativeAndOdd = new AndExpression([isNegative,isOdd]);
console.log('2是偶數(shù)嗎? ' + isEven.interpret(2));//2是偶數(shù)嗎? true
console.log('3是偶數(shù)嗎? ' + isEven.interpret(3));//3是偶數(shù)嗎? false
console.log('3是奇數(shù)嗎? ' + isOdd.interpret(3));//3是奇數(shù)嗎? true
console.log('3是負(fù)數(shù)嗎? ' + isNegative.interpret(3));//3是負(fù)數(shù)嗎? false
console.log('-3是負(fù)數(shù)嗎? ' + isNegative.interpret(-3));//-3是負(fù)數(shù)嗎? true
console.log('-3是負(fù)奇數(shù)嗎? ' + isNegativeAndOdd.interpret(-3));//-3是負(fù)奇數(shù)嗎? true
console.log('-4是負(fù)奇數(shù)嗎? ' + isNegativeAndOdd.interpret(-4));//-4是負(fù)奇數(shù)嗎? false
console.log('3是負(fù)奇數(shù)嗎? ' + isNegativeAndOdd.interpret(3));//3是負(fù)奇數(shù)嗎? false
上面的例子中TerminalExpression被稱為終結(jié)符表達(dá)式類,封裝底層的判斷條件,一般解釋器模式中只會(huì)存在少數(shù)幾個(gè)終結(jié)符表達(dá)式類。
OrExpression,AndExpression稱為非終結(jié)符表達(dá)式類,是基于多個(gè)終結(jié)符表達(dá)式組合而成相對(duì)復(fù)雜的邏輯。
解釋器模式最核心的就是這兩個(gè)類,基于他們可以擴(kuò)展組合出豐富多樣的條件。
雖然解釋器模式的使用頻率不是特別高,但是它在正則表達(dá)式,xml文檔解釋等領(lǐng)域還是得到了廣泛的應(yīng)用。
解釋器模式總結(jié):
優(yōu)點(diǎn):
* 易于擴(kuò)展和修改文法規(guī)則。增加時(shí)只需要增加新的終結(jié)符表達(dá)式,符合開關(guān)原則。
缺點(diǎn):
* 對(duì)于復(fù)雜文法難以維護(hù),會(huì)充滿非終結(jié)表達(dá)式。
* 執(zhí)行效率低,由于使用了大量循環(huán)和遞歸調(diào)用,在解釋復(fù)雜句子時(shí)速度很慢。
適用場(chǎng)景:
* 可以將一個(gè)需要解釋執(zhí)行的語(yǔ)言中的句子表示為一個(gè)抽象語(yǔ)法樹
* 一些重復(fù)出現(xiàn)的問題可以用一種簡(jiǎn)單的語(yǔ)言來(lái)進(jìn)行表達(dá)
* 一個(gè)語(yǔ)言文法較為簡(jiǎn)單
* 執(zhí)行效率不是關(guān)鍵問題
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具:http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
- JavaScript設(shè)計(jì)模式之模板方法模式原理與用法示例
- 學(xué)習(xí)JavaScript設(shè)計(jì)模式之模板方法模式
- javascript設(shè)計(jì)模式 – 觀察者模式原理與用法實(shí)例分析
- javascript設(shè)計(jì)模式 – 狀態(tài)模式原理與用法實(shí)例分析
- javascript設(shè)計(jì)模式 – 策略模式原理與用法實(shí)例分析
- javascript設(shè)計(jì)模式 – 備忘錄模式原理與用法實(shí)例分析
- javascript設(shè)計(jì)模式 – 中介者模式原理與用法實(shí)例分析
- javascript設(shè)計(jì)模式 – 命令模式原理與用法實(shí)例分析
- javascript設(shè)計(jì)模式 – 迭代器模式原理與用法實(shí)例分析
- javascript設(shè)計(jì)模式 – 裝飾模式原理與應(yīng)用實(shí)例分析
- javascript設(shè)計(jì)模式 – 組合模式原理與應(yīng)用實(shí)例分析
- javascript設(shè)計(jì)模式 – 模板方法模式原理與用法實(shí)例分析
相關(guān)文章
JavaScript繼承的實(shí)現(xiàn)方式詳解
JavaScript 是一門基于原型的語(yǔ)言,它的繼承機(jī)制與傳統(tǒng)的基于類的面向?qū)ο缶幊逃兴煌?盡管 ES6 引入了 class 語(yǔ)法,但本質(zhì)上仍然是基于原型鏈的繼承,本文將詳細(xì)介紹 JavaScript 繼承的幾種實(shí)現(xiàn)方式,需要的朋友可以參考下2025-03-03
js在Firefox與IE中對(duì)DOM對(duì)像的引用的比較
直接用ID屬性進(jìn)行引用 直接用NAME屬性進(jìn)行引用 使用getElementById(),getElementsByName(),getElementsByTagName()進(jìn)行引用2009-06-06
關(guān)于javascript中偽數(shù)組和真數(shù)組的一些小秘密
在javascript中,偽數(shù)組又稱類數(shù)組,是一個(gè)類似數(shù)組的對(duì)象,是一種按照索引存儲(chǔ)數(shù)據(jù)且具有l(wèi)ength屬性的對(duì)象,下面這篇文章主要給大家介紹了關(guān)于javascript中偽數(shù)組和真數(shù)組的一些小秘密,需要的朋友可以參考下2022-08-08
JS PHP字符串截取函數(shù)實(shí)現(xiàn)原理解析
這篇文章主要介紹了JS PHP字符串截取函數(shù)實(shí)現(xiàn)原理解析,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-08-08
JS實(shí)現(xiàn)iframe自適應(yīng)高度的方法示例
這篇文章主要介紹了JS實(shí)現(xiàn)iframe自適應(yīng)高度的方法,結(jié)合實(shí)例形式分析了JS實(shí)現(xiàn)iframe高度自適應(yīng)的實(shí)現(xiàn)技巧,并給出了項(xiàng)目示例供大家參考,需要的朋友可以參考下2017-01-01
前端彈出對(duì)話框 js實(shí)現(xiàn)ajax交互
這篇文章主要為大家詳細(xì)介紹了前端彈出對(duì)話框,js實(shí)現(xiàn)ajax交互,感興趣的小伙伴們可以參考一下2016-09-09

