JavaScript函数表达式-阿里云开发者社区

开发者社区> 技术小牛人> 正文

JavaScript函数表达式

简介:
+关注继续查看

一、序

      定义函数的方式有两种:一种是函数声明,另一种就是函数表达式;

      1.1 函数声明

function functionName(arg){     //函数体}

      关于函数声明,它有一个重要特征就是函数声明提升,意思就是在执行代码之前会先读取函数声明。这就意味着可以把函数放在调用它的语句后面。如下所示:

helloworld(); //在代码执行之前会先读取函数声明function helloworld(){
   console.log("hello world");
}

     1.2 函数表达式

var functionName=function(arg){      //函数体}

      这种形式看起来好像是常规的变量赋值语句,即创建一个函数并将它赋值给变量functionName。这种情况下创建的函数叫做匿名函数。因为function关键字后面没有标识符。

函数表达式与其他表达式一样,在使用之前必须先赋值;如下面代码就会导致错误;

helloworld(); //错误,还未赋值,函数不存在var helloworld=function(){
    console.log("hello world");
}

       有了函数表达式,我们就可以动态给函数表达式赋值了;如下面代码:

复制代码

var helloworld; //声明if(condition){ //条件
   helloworld=function(){ //赋值
       console.log("hello world"); 
   }
}else{
    helloworld=function(){ //赋值
       console.log("你好,世界");
    }
}

复制代码

二、递归函数

     递归函数是在一个函数通过名字调用自身的情况下构成的(和C#等语言一样,所以程序的核心思想是差不多,只是在语法上有些差异,学好一门语言的基础,学习其他就会轻松很多),举个经典的递归面试题,一列数的规则如下 : 1 、 1 、 2 、 3 、 5 、 8 、 13 、 21 、 34…… 求第 30 位数是多少,  用递归算法实现,代码如下所示:

复制代码

        function foo(n) {            if (n <= 0)                return 0;            else if (n > 0 && n <= 2)                return 1;            else
                return foo(n - 1) + foo(n - 2);
        }

复制代码

虽然这个函数表明看来没有什么问题,但下面的代码却可能导致它出错:

        var foo1 = foo;
        foo = null;
        console.log(foo1(34));

以上代码先把foo()函数保存在变量foo1中,然后将foo变量设为null,结果指向原始函数的引用只剩下一个。但在接下来调用foo1()时,由于必须执行foo(),而foo已经为null了,所以就会导致错误;在这种情况下,使用arguments.callee可以解决这个问题。arguments.callee是一个指向正在执行的函数的指针,因此可以用它来实现对函数的递归调用

复制代码

     function foo(n) {            if (n <= 0)                return 0;            else if (n > 0 && n <= 2)                return 1;            else
                return arguments.callee(n - 1) + arguments.callee(n - 2);
        }

复制代码

也可以使用命名函数表达式来达成相同的结果。例如:

复制代码

        var foo = (function f(n) {            if (n <= 0)                return 0;            else if (n > 0 && n <= 2)                return 1;            else
                return f(n - 1) + f(n - 2);
        });

复制代码

 三、闭包

      3.1 闭包是指有权访问另一个函数作用域中的变量的函数,创建闭包的常见方式,就是在一个函数内部创建另一个函数。要理解闭包,首先必须理解JavaScript特殊变量的作用域。变量的作用域无非就是两种,全局变量和局部变量;接下来写几个demo来直观表达;

函数内部直接读取全局变量:

复制代码

        var n = 100; //定义一个全局变量
        function fn() {
            console.log(n); //函数内部直接读取全局变量        }

        fn();

复制代码

函数外部不能直接读取局部变量:

        function fn() {            var n = 100;
        }

        console.log(n); //n is not defined

在这里有个地方需要注意的是,在函数内部声明变量的时候,一定要用var ,如果没用,则会变成全局变量:

        function fn() {
             n = 100;
        }
        fn();
        console.log(n); //100

有时候我们需要得到函数内部声明的变量,所以可以使用上面提到创建闭包的常用方式,在函数内部创建另一个函数:

复制代码

        function fn() {
            n = 100;            function fn1() {
                console.log(n);
            }

            fn1();
        }
        fn(); //100

复制代码

在上面的代码中,函数fn1就被包括在函数fn内部,这时fm内部的所有局部变量,对fn1都是可见的。但是反过来就不行,fn1内部的局部变量,对fn就是不可见的。这就是Javascript语言特有的"链式作用域"结构,子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。

竟然fn1可以读取fn内部变量,那么只要把fn1作为返回值,这要我们就可以在外部读取fn的变量了

复制代码

        function fn() {
            n = 100;            function fn1() {
                console.log(n);
            }            return fn1;
        }        
       var result=fn();
       result(); //100

复制代码

 

在这里fn1就是闭包,闭包就是能够读取其他函数内部变量的函数。由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成"定义在一个函数内部的函数"。所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。

       3.2  闭包的用途

       它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。如下面代码所示:

复制代码

        function fn() {
            n = 100;

            nadd = function () {
                n += 1;
            }            function fn1() {
                console.log(n);
            }            return fn1;
        }        var result = fn();
        result(); //100        nadd();
        result(); //101

复制代码

注意:由于闭包函数会携带包含它的函数的作用域,因此会比其他函数占用更多的内存,过度使用闭包可能会导致内存占用过多,所以在退出函数之前,将不使用的局部变量全部删除。

 四、块级作用域

       块级作用域(又称为私有作用域)的匿名函数的语法如下所示:

(function(){     //块级作用域})();

无论在什么地方,只要临时需要一些变量,就可以使用私有作用域,比如:

复制代码

        (function () {            var now = new Date();            if (now.getMonth() == 0 && now.getDate() == 1) {
                alert("新年快乐");
            }
        })();

复制代码

把上面这段代码放到全局作用域中,如果到了1月1日就会弹出“新年快乐”的祝福;这种技术经常在全局作用域中被用在函数外部,从而限制向全局作用域中添加过多的变量和函数。一般来说,我们都应该尽量少向全局作用域中添加变量和函数。在一个由很多开发人员共同参与的大型应用程序中,过多的全局变量和函数很容易导致命名冲突。而通过创建私用作用域,每个开发人员既可以使用自己的变量,又不必担心搞乱全局作用域。


本文转自  zddnd  51CTO博客,原文链接:http://blog.51cto.com/13013666/1940147

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
匿名方法,Lambda表达式,高阶函数
原文:匿名方法,Lambda表达式,高阶函数 匿名方法 c#2.0引入匿名方法,不必创建单独的方法,因此减少了所需的编码系统开销。 常用于将委托和匿名方法关联,例如1. 使用委托和方法关联: this.
900 0
Flask入门flask-script 蓝本 钩子函数(3)
flask入门(三) 1 flask-script扩展库 概念: 是一个flask终端运行的解析器 ,因为项目完成以后,代码改动会有风险,所以借助终端完成不同启动项的配置 安装 pip3 install fl...
1151 0
JAVASCRIPT学习笔记之正则表达式
关于正则表达式的总结一直在草稿箱里躺了很久了,与本文原作者水墨寒湘( 呵呵,不是我水墨寒)类似,之前对于正则表达式也是一知半解,用到就谷娘的那种。直到哪天看了慕课网的《JavaScript正则表达式》的视频,豁然开朗啊,正好在掘金上看到这篇文章,顺手手动编辑转载了,用作复习。
2876 0
JSP第四篇【EL表达式介绍、获取各类数据、11个内置对象、执行运算、回显数据、自定义函数、fn方法库】
什么是EL表达式? 表达式语言(Expression Language,EL),EL表达式是用"${}"括起来的脚本,用来更方便的读取对象! EL表达式主要用来读取数据,进行内容的显示! 为什么要使用EL表达式? 为什么要使用EL表达式,我们先来看一下没有EL表达式是怎么样读取对象数据的吧! 在1.
1146 0
JavaScript立即调用的函数表达式
主要参考知乎上这个问题:javascript 匿名函数有哪几种执行方式  长天之云的回答。 ~(function() {//todo})();!(function() {//todo})(); 对于不太熟悉JavaScript的同学来讲,可能会有两个疑问: 1、!(function() {})();前面为什么要加~、!这些符号? 后面的()是执行一个函数,而(function() {})是一个执行表达式,返回一个匿名函数的引用。
607 0
5723
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载