zoukankan      html  css  js  c++  java
  • Function构造函数

      使用Function构造函数, 也能够创建函数, 和使用关键字function定义函数有几点区别:

      使用function关键字这样定义函数:

    var f = function(x,y) {return x+y};

      使用Function构造函数定义函数要这样写:

    var f = new Function("x", "y", "return x+y");

      使用new Function构造函数创建函数有3个注意点:

      1:在JS运行的时候可以动态创建Function;

      JQ作者写的模板引擎就是通过new Function形式创建出来的:http://ejohn.org/blog/javascript-micro-templating/

    // Simple JavaScript Templating
    // John Resig - http://ejohn.org/ - MIT Licensed
    (function(){
      var cache = {};
      
      this.tmpl = function tmpl(str, data){
        // Figure out if we're getting a template, or if we need to
        // load the template - and be sure to cache the result.
        var fn = !/W/.test(str) ?
          cache[str] = cache[str] ||
            tmpl(document.getElementById(str).innerHTML) :
          
          // Generate a reusable function that will serve as a template
          // generator (and which will be cached).
          new Function("obj",
            "var p=[],print=function(){p.push.apply(p,arguments);};" +
            
            // Introduce the data as local variables using with(){}
            "with(obj){p.push('" +
            
            // Convert the template into pure JavaScript
            str
              .replace(/[
    	
    ]/g, " ")
              .split("<%").join("	")
              .replace(/((^|%>)[^	]*)'/g, "$1
    ")
              .replace(/	=(.*?)%>/g, "',$1,'")
              .split("	").join("');")
              .split("%>").join("p.push('")
              .split("
    ").join("\'")
          + "');}return p.join('');");
        
        // Provide some basic currying to the user
        return data ? fn( data ) : fn;
      };
    })();

      2:Function()构造函数创建的函数的执行效率比较低;

            var a = new Date();
            var x = a.getTime();
            for(var i=0;i<100000;i++){
                function EE(){   //使用function语句定义的空函数
                    
                }
            }
            var b = new Date();
            var y = b.getTime();
            alert(y-x);    //62,不同环境和浏览器会存在差异
            // 测试Function构造函数定义的空函数执行效率
            var a = new Date();
            var x = a.getTime();
            for(var i=0;i<100000;i++){
                new Function();  //使用Function构造函数定义的空函数
            }
            var b = new Date();
            var y = b.getTime();
            alert(y-x);    //2390

      3:Function()构造函数创建的函数执行作用域是全局的;

            var fn = new Function("x", "return x*x+y");
            var y = 3;
            alert(fn(3));
            (function(){
                var y = 2;
                alert(fn(3));
            }());

    作者: NONO
    出处:http://www.cnblogs.com/diligenceday/
    QQ:287101329
    微信:18101055830 

  • 相关阅读:
    我所知道的JS调试
    css加载会造成阻塞吗?
    移动端图片上传旋转、压缩的解决方案
    JS组件系列——自己动手扩展BootstrapTable的 冻结列 功能:彻底解决高度问题
    什么是BFC
    CSS中margin边界叠加问题及解决方案
    JavaScript 中回调地狱的今生前世
    用css实现自定义虚线边框
    仿淘宝,京东红包雨
    css3实现可以计算的自适应布局——calc()
  • 原文地址:https://www.cnblogs.com/diligenceday/p/5529182.html
Copyright © 2011-2022 走看看