javascript设计模式 ? 解释器模式原理与用法实例分析


Posted in Javascript onApril 17, 2020

本文实例讲述了javascript设计模式 ? 解释器模式原理与用法。分享给大家供大家参考,具体如下:

介绍:之前在做java开发时,数据库的增删改查特别频繁,并且场景不同需要用到的SQL语句页都不同,如何用调用方法的形式来使用sql语句,拼接sql?这就是这一节我们要讲的解释器模式。

定义:定义一个语言的文法,并且建立一个解释器来解释该语言中的句子,这里的语言是指使用规定格式和语法的代码。解释器模式是一种类行为型模式。

场景:我们实现一个解释器,用来判断传递的数字是奇数还是偶数,是正数还是负数,是正奇数还是负奇数。

示例:

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是偶数吗? ' + isEven.interpret(2));//2是偶数吗? true
console.log('3是偶数吗? ' + isEven.interpret(3));//3是偶数吗? false
console.log('3是奇数吗? ' + isOdd.interpret(3));//3是奇数吗? true
console.log('3是负数吗? ' + isNegative.interpret(3));//3是负数吗? false
console.log('-3是负数吗? ' + isNegative.interpret(-3));//-3是负数吗? true
console.log('-3是负奇数吗? ' + isNegativeAndOdd.interpret(-3));//-3是负奇数吗? true
console.log('-4是负奇数吗? ' + isNegativeAndOdd.interpret(-4));//-4是负奇数吗? false
console.log('3是负奇数吗? ' + isNegativeAndOdd.interpret(3));//3是负奇数吗? false

上面的例子中TerminalExpression被称为终结符表达式类,封装底层的判断条件,一般解释器模式中只会存在少数几个终结符表达式类。
OrExpression,AndExpression称为非终结符表达式类,是基于多个终结符表达式组合而成相对复杂的逻辑。
解释器模式最核心的就是这两个类,基于他们可以扩展组合出丰富多样的条件。
虽然解释器模式的使用频率不是特别高,但是它在正则表达式,xml文档解释等领域还是得到了广泛的应用。

解释器模式总结:

优点:
* 易于扩展和修改文法规则。增加时只需要增加新的终结符表达式,符合开关原则。

缺点:
* 对于复杂文法难以维护,会充满非终结表达式。
* 执行效率低,由于使用了大量循环和递归调用,在解释复杂句子时速度很慢。

适用场景:
* 可以将一个需要解释执行的语言中的句子表示为一个抽象语法树
* 一些重复出现的问题可以用一种简单的语言来进行表达
* 一个语言文法较为简单
* 执行效率不是关键问题

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Extjs TimeField 显示正常时间格式的代码
Jun 28 Javascript
JS等比例缩小图片尺寸的实例
Feb 27 Javascript
jQuery中trigger()与bind()用法分析
Dec 18 Javascript
BootstrapValidator不触发校验的实现代码
Sep 28 Javascript
jQuery旋转插件jqueryrotate用法详解
Oct 13 Javascript
js querySelector() 使用方法
Dec 21 Javascript
jQuery中DOM节点删除之empty与remove
Jan 20 Javascript
React复制到剪贴板的示例代码
Aug 22 Javascript
javascript  删除select中的所有option的实例
Sep 17 Javascript
vue组件之Alert的实现代码
Oct 17 Javascript
JS实现的邮箱提示补全效果示例
Jan 30 Javascript
vuex刷新后数据丢失的解决方法
Oct 18 Javascript
javascript设计模式 ? 迭代器模式原理与用法实例分析
Apr 17 #Javascript
vue制作抓娃娃机的示例代码
Apr 17 #Javascript
Vue+tracking.js 实现前端人脸检测功能
Apr 16 #Javascript
tracking.js实现前端人脸识别功能
Apr 16 #Javascript
electron 如何将任意资源打包的方法步骤
Apr 16 #Javascript
vue中keep-alive内置组件缓存的实例代码
Apr 16 #Javascript
详解Nuxt内导航栏的两种实现方式
Apr 16 #Javascript
You might like
使用Huagepage和PGO来提升PHP7的执行性能
2015/11/30 PHP
基于laravel belongsTo使用详解
2019/10/18 PHP
jquery取消选择select下拉框示例代码
2014/02/22 Javascript
jQuery源码解读之hasClass()方法分析
2015/02/20 Javascript
jquery使用Cookie和JSON记录用户最近浏览历史
2016/04/19 Javascript
基于jquery实现的鼠标悬停提示案例
2016/12/11 Javascript
使用Bootstrap和Vue实现用户信息的编辑删除功能
2017/10/25 Javascript
Vue单页面应用保证F5强刷不清空数据的解决方案
2018/01/31 Javascript
jQuery实现参数自定义的文字跑马灯效果
2018/08/15 jQuery
Vue框架下引入ActiveX控件的问题解决
2019/03/25 Javascript
layui内置模块layim发送图片添加加载动画的方法
2019/09/23 Javascript
vue与iframe之间的信息交互的实现
2020/04/08 Javascript
python 使用 requests 模块发送http请求 的方法
2018/12/09 Python
python利用小波分析进行特征提取的实例
2019/01/09 Python
简单了解python中对象的取反运算符
2019/07/01 Python
django 通过URL访问上传的文件方法
2019/07/28 Python
使用python 对验证码图片进行降噪处理
2019/12/18 Python
Tech21美国/加拿大:英国NO.1防摔保护壳品牌
2018/01/20 全球购物
加拿大时尚床上用品零售商:QE Home | Quilts Etc
2018/01/22 全球购物
蔻驰法国官网:COACH法国
2018/11/14 全球购物
Arti-shopping中文官网:大型海外商品一站式直邮平台
2020/03/23 全球购物
为什么要用EJB
2014/04/17 面试题
酒吧副总经理岗位职责
2013/12/10 职场文书
课程设计心得体会
2013/12/28 职场文书
教师岗位职责范本
2013/12/29 职场文书
孝老爱亲模范事迹
2014/01/24 职场文书
党的群众路线教育实践活动批评与自我批评
2014/02/16 职场文书
房地产促销活动方案
2014/03/01 职场文书
《数星星的孩子》教学反思
2014/04/11 职场文书
促销活动计划书
2014/05/02 职场文书
廉洁校园实施方案
2014/05/25 职场文书
销售顾问工作计划书
2014/08/15 职场文书
个人授权委托书模板
2014/09/14 职场文书
满月酒邀请函
2015/01/30 职场文书
2015年小学语文工作总结
2015/05/25 职场文书