zoukankan      html  css  js  c++  java
  • JS中创建函数的三种方式及区别

    1.函数声明

    function sum1(n1,n2){
            return n1+n2;
        };

    2.函数表达式,又叫函数字面量

    var sum2=function(n1,n2){
            return n1+n2;
    };

    两者的区别:解析器会先读取函数声明,并使其在执行任何代码之前可以访问;而函数表达式则必须等到解析器执行到它所在的代码行才会真正被解释执行。

    自执行函数严格来说也叫函数表达式,它主要用于创建一个新的作用域,在此作用域内声明的变量,不会和其它作用域内的变量冲突或混淆,大多是以匿名函数方式存在,且立即自动执行。

    (function(n1,n2){
            console.log (n1+n2)
    })(1,3);//4

    另外几种自执行函数:

       //可用来传参
        (function(x,y){
            console.log(x+y);
        })(2,3);
    
        //带返回值
        var sum=(function(x,y){
            return x+y;
        })(2,3);
        console.log(sum);
    
        ~function(){
            var name='~'
            console.log(name);
        }();
    
        !function(){
            var name='!'
            console.log(name);
        }();
    
        ;(function(){
            var name=';'
            console.log(name);
        })();
    
        -function(){
            var name='-'
            console.log(name);
        }();
    
        //逗号运算符
        1,function(){
            var name=',';
            console.log(name);
        }();
    
        //异或
        1^function(){
            var name='^';
            console.log(name);
        }();
    
        //比较运算符
        1>function(){
            var name='>';
            console.log(name);
        }();
    
        ~+-!(function(){
            var name='~+-!';
            console.log(name);
        })();
    
        ~!(function(){
            var name='~!';
            console.log(name);
        })();
    
        (function(){
            var name='call';
            console.log(name);
        }).call();
    
        (function(){
            var name='apply';
            console.log(name);
        }).apply();

    3.函数构造法,参数必须加引号

    var sum3=new Function('n1','n2','return n1+n2');
    console.log(sum3(2,3));//5

    从技术角度讲,这是一个函数表达式。一般不推荐用这种方法定义函数,因为这种语法会导致解析两次代码(第一次是解析常规ECMAScript代码,第二次是解析传入构造函数中的字符串),从而影响性能。

    var name='haoxl';
        function fun(){
            var name='lili';
            return new Function('return name');//不能获取局部变量
        }
     console.log(fun()());//haoxl

     Function()构造函数每次执行时都会解析函数主体,并创建一个新的函数对象,所以当在一个循环或频繁执行的函数中调用Function()构造函数效率是非常低的。而函数字面量却不是每次遇到都会重新编译的,用Function()构造函数创建一个函数时并不遵循典型的作用域,它一直把它当作是顶级函数来执行。

    作者:haoxl
    出版:http://www.cnblogs.com/haoxl/
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文链接,否则保留追究法律责任的权利。

  • 相关阅读:
    CSS 中 Font-Family 中英文对照表
    0号首页,移动应用快捷门户
    身边的大数据和我们的着手点
    php单例模式
    原生JS实现ajax与ajax的跨域请求
    two.js之实现动画效果
    H5中的拖放
    简说chart2.4的应用,以及Uncaught ReferenceError : require is not defined的解决
    JS中的作用域以及全局变量的问题
    JavaScript 框架------------AngularJS(下)
  • 原文地址:https://www.cnblogs.com/haoxl/p/5267724.html
Copyright © 2011-2022 走看看