关于eval 与new Function 到底该选哪个?


Posted in Javascript onApril 17, 2013

废话不多说,直接上测试代码

var aa = "{name:'cola',item:[{age:11},{age:22},{age:23},{age:23}]}"; 
    var now = new Date().getTime(); 
    for (var i = 0; i < 100000; i++) { 
        var a = eval("(" + aa + ")");     } 
    var now1 = new Date().getTime(); 
    document.write("eval 时间为:" + (now1 - now) + "<br/>"); 
 
    var now2 = new Date().getTime(); 
    for (var i = 0; i < 100000; i++) { 
        var fn = new Function("return" + aa); 
        fn(); 
    } 
    var now3 = new Date().getTime(); 
    document.write("new Function时间为:" + (now3 - now2) + "<br/>");

        //经过测试结果 FF效果如下
        //eval 时间为:979
        //new Function时间为:1372

        //经过测试结果 IE8效果如下
        //eval 时间为:913
        //new Function时间为:1037

        //经过测试结果 Chrome效果如下
        //eval 时间为:211
        //new Function时间为:251

        //经过测试结果 Opera
        //eval 时间为:384
        //new Function时间为:1024

测试结果为不同浏览器测试的参考数据,觉得奇怪的是为什么每个浏览器测试的时候都是eval要快点,我们是不是要采用他呢?

亲,先不要急, 接下往下看,带着这些疑问,好奇心的我终于展开了另外一个测试,这时候我做一个动态涵数来分别让eval 和 new Function 来执行再看看效果

var testEval = function (obj) { 
         <SPAN style="COLOR: #ff0000"> return eval('0, ' + obj + '');</SPAN> 
        //return eval('( ' + obj + ')'); 
      };       var testFun = function (obj) { 
          var fn = new Function("return " + obj); 
          fn(); 
      }; 
      var now = new Date().getTime(); 
      for (var i = 0; i < 1000; i++) { 
          var fn = testEval("function test(){ document.write('我有一头小毛驴,从来也不骑.........'); }"); 
          fn(); 
      } 
      var now1 = new Date().getTime(); 
      document.write("<br/>"); 
      document.write("eval 时间为:" + (now1 - now) + "<br/>"); 
      var now2 = new Date().getTime(); 
      for (var i = 0; i < 1000; i++) { 
          testFun("document.write('我有一头小毛驴,从来也不骑.........');"); 
      } 
      var now3 = new Date().getTime(); 
      document.write("new Function时间为:" + (now3 - now2) + "<br/>");

  //经过测试结果 FF效果如下
        //eval 时间为:495
        //new Function时间为:50

        //经过测试结果 IE8效果如下
        //eval 时间为:34
        //new Function时间为:20

        //经过测试结果 Chrome效果如下
        //eval 时间为:7
        //new Function时间为:4

        //经过测试结果 Opera
        //eval 时间为:7
        //new Function时间为:18

        如上结果测试 如果构建一个动态执行让eval去执行 在FF上是超级的慢, 其它浏览器差别不大, 我们这里不必过于太多追究
        return eval('0, ' + obj + ''); 可能大家觉得这里这个 0 是什么意思,加0主要是兼容所有的浏览器,不加的话,IE9以下版本就会报错
        但是真正的0的意思 怎么去剖析 我还真不知道,只是知道加 了这个就可以解决恶心的IE不能兼容的问题
        经过上面二个栗子说明 如果是为了JSON串的转换eval 明显要快, 如果是动态涵数解析 那么 new Function要快, 这里说出了二个优劣势, 还有的就是eval兼容性不很好,如果解析出错,可能会导致其它的JS脚本不会执行,
        而 后者则不会,他只会针对于 这个Function  我这人不喜欢太麻烦的事情, 果断放弃eval 用 new Function 来代替。 如果有理解的不太对的地方,请大家指正,欢迎拍砖。

Javascript 相关文章推荐
从javascript语言本身谈项目实战
Dec 27 Javascript
iis6+javascript Add an Extension File
Jun 13 Javascript
用js模拟JQuery的show与hide动画函数代码
Sep 20 Javascript
js实例属性和原型属性示例详解
Nov 23 Javascript
全面解析Bootstrap表单使用方法(表单控件)
Nov 24 Javascript
JavaScript判断图片是否已经加载完毕的方法汇总
Feb 05 Javascript
JavaScript数据结构与算法之队列原理与用法实例详解
Nov 22 Javascript
基于Bootstrap实现城市三级联动
Nov 23 Javascript
React 源码中的依赖注入方法
Nov 07 Javascript
微信小程序3种位置API的使用方法详解
Aug 05 Javascript
vue cli4.0项目引入typescript的方法
Jul 17 Javascript
js面向对象编程OOP及函数式编程FP区别
Jul 07 Javascript
js实现在页面上弹出蒙板技巧简单实用
Apr 16 #Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
Apr 16 #Javascript
拖动table标题实现改变td的大小(css+js代码)
Apr 16 #Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
Apr 16 #Javascript
jquery表格内容筛选实现思路及代码
Apr 16 #Javascript
js实现图片轮换效果代码
Apr 16 #Javascript
js相册效果代码(点击创建即可)
Apr 16 #Javascript
You might like
PHP:风雨欲来 路在何方?
2006/10/09 PHP
PHP动态分页函数,PHP开发分页必备啦
2011/11/07 PHP
php中session使用示例
2014/03/29 PHP
ThinkPHP3.2.2的插件控制器功能
2015/03/05 PHP
给WordPress中的留言加上楼层号的PHP代码实例
2015/12/14 PHP
如何用PHP做到页面注册审核
2017/03/02 PHP
javascript编程起步(第四课)
2007/02/27 Javascript
大家未必知道的Js技巧收藏
2008/04/07 Javascript
JavaScript 开发规范要求(图文并茂)
2010/06/11 Javascript
基于jQuery的Tab选项框效果代码(插件)
2011/03/01 Javascript
JS排序方法(sort,bubble,select,insert)代码汇总
2016/01/30 Javascript
JS/jQuery判断DOM节点是否存在的简单方法
2016/11/24 Javascript
基于Vue.js实现简单搜索框
2020/03/26 Javascript
js中setTimeout的妙用--防止循环超时
2017/03/06 Javascript
微信小程序 setData的使用方法详解
2017/04/20 Javascript
vue下拉菜单组件(含搜索)的实现代码
2018/11/25 Javascript
微信小程序页面上下滚动效果
2020/11/18 Javascript
js回调函数原理与用法案例分析
2020/03/04 Javascript
利用Python开发实现简单的记事本
2016/11/15 Python
Apache如何部署django项目
2017/05/21 Python
老生常谈Python序列化和反序列化
2017/06/28 Python
对pandas的dataframe绘图并保存的实现方法
2017/08/05 Python
Python提取支付宝和微信支付二维码的示例代码
2019/02/15 Python
python发送多人邮件没有展示收件人问题的解决方法
2019/06/21 Python
python如果快速判断数字奇数偶数
2019/11/13 Python
适合Python初学者的一些编程技巧
2020/02/12 Python
Python3.7 读取音频根据文件名生成脚本的代码
2020/04/07 Python
特步官方商城:Xtep
2017/03/21 全球购物
HelloFresh奥地利:立即订购烹饪盒
2019/02/22 全球购物
企业管理专业个人求职信范文
2013/09/24 职场文书
化学相关工作求职信
2013/10/02 职场文书
音乐系毕业生自荐信
2013/10/27 职场文书
儿子婚宴答谢词
2014/01/09 职场文书
宣传策划类求职信范文
2014/01/31 职场文书
关爱残疾人标语
2014/06/25 职场文书
2014年销售助理工作总结
2014/12/01 职场文书