JavaScript中的DSL元编程介绍


Posted in Javascript onMarch 15, 2015

在看JavaScript Template源码的时候,发现有一个很有意思的用法用来生成函数,想到这不就是元编程么?

JavaScript 元编程

 元编程(Metaprogramming)是指某类计算机程序的编写,这类计算机程序编写或者操纵其他程序(或者自身)作为它们的数据,或者在运行时完成部分本应在编译时完成的工作。

JavaScript eval

 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码。

可以有下面的用法:
eval("x=10;y=20;document.write(x*y)")

当然这只是用来执行某个函数,只是这货性价比可低了,而且还容易出错。
 eval 函数应该尽可能地避免使用。

于是更好地方法是使用New Function()

使用New Function()和eval()的很大一个区别是,eval不仅仅是一个函数 ,

 eval() 计算一个字符串作为当前执行范围内JavaScript表达式,可以访问本地变量。 New Function() 解析存储在一个字符串转换成一个函数对象,然后可以调用的JavaScript代码。因为代码在一个单独的范围内运行,不能访问本地变量。

也就是说eval()会干扰到当前函数的作用域。。

JavaScript new Function()

 Function 构造器创建一个新的Function 对象. 在JavaScript中每个函数(function)实际是一个Function对象. 使用Function构造器生成的Function对象是在函数创建时被解析的。这比你使用函数声明(function)并在你的代码中调用低效,因为使用函数语句声明的function是跟其他语句一起解析的。

New Function() 相比之下会比较低效,而这也是当前情况下我们所能预知的。

一个简单的示例如下所示:

var add = new Function(['x', 'y'], 'return x + y');

new Function()会将字符串解析为函数。。然后我们可以通过apply来执行
Function.apply(null, args)

而这也是我在JavaScript Template中所看到的:
   new Function(

        tmpl.arg + ',tmpl',

        "var _e=tmpl.encode" + tmpl.helper + ",_s='" +

        str.replace(tmpl.regexp, tmpl.func) +

        "';return _s;"

    );

当然我们还有其他方法。
Javascript 相关文章推荐
js对象之JS入门之Array对象操作小结
Jan 09 Javascript
jQuery层次选择器选择元素使用介绍
Apr 18 Javascript
非jQuery实现照片散落桌子上,单击放大的LightBox效果
Nov 28 Javascript
javascript函数的四种调用模式
Jan 08 Javascript
vue.js单页面应用实例的简单实现
Apr 10 Javascript
解决iView中时间控件选择的时间总是少一天的问题
Mar 15 Javascript
JS实现json对象数组按对象属性排序操作示例
May 18 Javascript
javascript设计模式 ? 代理模式原理与用法实例分析
Apr 16 Javascript
vue基础知识--axios合并请求和slot
Jun 04 Javascript
vue@cli3项目模板怎么使用public目录下的静态文件
Jul 07 Javascript
Vue 解决父组件跳转子路由后当前导航active样式消失问题
Jul 21 Javascript
JSON stringify方法原理及实例解析
Oct 23 Javascript
JavaScript中的立即执行函数表达式介绍
Mar 15 #Javascript
Javascript中的arguments与重载介绍
Mar 15 #Javascript
JavaScript中的闭包介绍
Mar 15 #Javascript
Javascript中的匿名函数与封装介绍
Mar 15 #Javascript
Javascript中的方法链(Method Chaining)介绍
Mar 15 #Javascript
Javascript中的apply()方法浅析
Mar 15 #Javascript
Javascript中的Callback方法浅析
Mar 15 #Javascript
You might like
业余方法DIY电子管FM收音机
2021/03/02 无线电
PHP之数组学习
2011/05/29 PHP
php学习笔记 [预定义数组(超全局数组)]
2011/06/09 PHP
PHP容易忘记的知识点分享
2013/04/30 PHP
WAMP环境中扩展oracle函数库(oci)
2015/06/26 PHP
PHP编程快速实现数组去重的方法详解
2017/07/22 PHP
tp5修改(实现即点即改)
2019/10/18 PHP
JavaScript 获取当前时间戳的代码
2010/08/05 Javascript
jquery不会自动回收xmlHttpRequest对象 导致了内存溢出
2012/06/18 Javascript
caller和callee的区别介绍及演示结果
2013/03/10 Javascript
JS去除iframe滚动条的方法
2015/04/01 Javascript
jquery.form.js实现将form提交转为ajax方式提交的方法
2015/04/07 Javascript
javascript动态创建链接的方法
2015/05/13 Javascript
jquery实现Li滚动时滚动条自动添加样式的方法
2015/08/10 Javascript
jQuery按需加载轮播图(web前端性能优化)
2017/02/17 Javascript
Nodejs--post的公式详解
2017/04/29 NodeJs
总结js中的一些兼容性易错的问题
2017/12/18 Javascript
浅谈vue加载优化策略
2019/03/19 Javascript
解决前后端分离 vue+springboot 跨域 session+cookie失效问题
2019/05/13 Javascript
JavaScript中如何对多维数组(矩阵)去重的实现
2019/12/04 Javascript
[01:34:42]NAVI vs EG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
tensorflow构建BP神经网络的方法
2018/03/12 Python
python同步windows和linux文件
2019/08/29 Python
执行Django数据迁移时报 1091错误及解决方法
2019/10/14 Python
详解pyinstaller selenium python3 chrome打包问题
2019/10/18 Python
Python执行时间的几种计算方法
2020/07/31 Python
PyTorch中Tensor的数据类型和运算的使用
2020/09/03 Python
Python 利用flask搭建一个共享服务器的步骤
2020/12/05 Python
python 数据类型强制转换的总结
2021/01/25 Python
python 求两个向量的顺时针夹角操作
2021/03/04 Python
介绍CSS3使用技巧5个
2009/04/02 HTML / CSS
css3教程之倾斜页面
2014/01/27 HTML / CSS
HTML5在canvas中绘制复杂形状附效果截图
2014/06/23 HTML / CSS
给水排水工程专业毕业生推荐信
2013/10/28 职场文书
给全校老师的建议书
2014/03/13 职场文书
企业演讲比赛主持词
2014/03/18 职场文书