博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript--函数参数与闭包--详解
阅读量:5732 次
发布时间:2019-06-18

本文共 6723 字,大约阅读时间需要 22 分钟。

在看此课程的读者,希望先阅读关于函数基础内容  的章节,因为此课程或多或少会涉及函数基础的内容,而基础内容,本人放在 章节。

本文直接赘述函数参数与闭包,若涉及相关知识,为了节省篇章,会以相关字眼带过。

 

最近在学习javascript的函数,函数是javascript的一等对象,想要学好javascript,就必须深刻理解函数。本人把学习的过程整理成文章,一是为了加深自己函数的理解,二是给读者提供学习的途径,避免走弯路。内容有些多,但都是笔者对于函数的总结。

 

1.函数参数

  1.1:参数是什么

  1.2:参数的省略

  1.3:参数默认值

  1.4:参数传递方式

  1.5:同名参数

  1.6:arguments对象

2.闭包

  2.1:闭包定义

  2.2:立即调用的函数表达式(IIFE, Immediately invoked function expression)

 

 

 

1.函数参数

  1.1:参数是什么

  在定义一个函数时,有时候需要为函数传递额外的数据,不同的外部数据会得到不同的结果,这种外部数据就叫做参数。

1     function keith(a){2         return a+a;3     }4     console.log(keith(3));  //6

  上面代码中,给keith函数传递了参数a,并且返回了a+a表达式。

  

  1.2:参数的省略

  函数参数不是必须的,javascript规范允许省略调用时传递的实际参数。

1     function keith(a, b, c) {2         return a;3     }4     console.log(keith(1, 2, 3)); //15     console.log(keith(1)); //16     console.log(keith()); // 'undefined'

  上面代码中,keith函数定义了三个参数,但是在调用时无论传递了多少个参数,javascript都不会报错。被省略的参数的默认值就变为undefined。在  的博文中提到,函数的length属性会返回参数个数。需要注意的是,length属性与实际参数的个数无关,只是返回形式参数的个数。

  (实际参数:调用时传递的参数。     形式参数:定义时传递的参数。)

  但是没有办法省略只靠前的元素,而保留靠后的元素。如果一定要省略靠前的元素,只有显示传入undefined。

1     function keith(a, b) {2         return a;3     }4     console.log(keith(, 1)); //SyntaxError: expected expression, got ','5     console.log(keith(undefined, 2)); //'undefined'

  上面代码中,如果省略了第一个参数,浏览器就会报错。如果给第一个参数传递undefined,则不会报错。

 

  1.3:默认值

  在JavaScript中,函数参数的默认值是undefined。然而,在某些情况下设置不同的默认值是有用的。一般策略是在函数的主体测试参数值是否为undefined,如果是则赋予一个值,如果不是,则返回实际参数传递的值。

1     function keith(a, b) {2         (typeof b !== 'undefined') ? b = b: b = 1;3         return a * b;4     }5     console.log(keith(15)); //156     console.log(keith(15, 2)) //30

  上面代码中,做了个判断。当在调用时没有传入b参数,则默认为1。

  从ECMAScript 6开始,定义了默认参数(default parameters)。使用默认参数,在函数体的检查就不再需要了。

1     function keith(a, b = 1) {2         return a * b;3     }4     console.log(keith(15)); //155     console.log(keith(15, 2)) //30

  

  1.4:参数传递方式

  函数参数的传递方式有两种,一个是传值传递,一个是传址传递。

  当函数参数是原始数据类型时(字符串,数值,布尔值),参数的传递方式为传值传递。也就是说,在函数体内修改参数值,不会影响到函数外部。

1     var a = 1;2 3     function keith(num) {4         num = 5;5     }6     keith(a);7     console.log(a); //1

  上面代码中,全局变量a是一个原始类型的值,传入函数keith的方式是传值传递。因此,在函数内部,a的值是原始值的拷贝,无论怎么修改,都不会影响到原始值。

  但是,如果函数参数是复合类型的值(数组、对象、其他函数),传递方式是传址传递(pass by reference)。也就是说,传入函数的是原始值的地址,因此在函数内部修改参数,将会影响到原始值。

1     var arr = [2, 5];2 3     function keith(Arr) {4         Arr[0] = 3;5     }6     keith(arr);7     console.log(arr[0]); //3

  上面代码中,传入函数keith的是参数对象arr的地址。因此,在函数内部修改arr第一个值,会影响到原始值。

  注意,如果函数内部修改的,不是参数对象的某个属性,而是替换掉整个参数,这时不会影响到原始值。

1     var arr = [2, 3, 5];2 3     function keith(Arr) {4         Arr = [1, 2, 3];5     }6     keith(arr);7     console.log(arr); // [2,3,5]

  上面代码中,在函数keith内部,参数对象arr被整个替换成另一个值。这时不会影响到原始值。这是因为,形式参数(Arr)与实际参数arr存在一个赋值关系。

  参数的传递方式在  也有谈及。

 

  1.5:同名参数

  如果有同名参数,则去最后面出现的那个值,如果未提供最后一个参数的值,则取值变成undefined。

1     function keith(a, a) {2         return a;3     }4 5     console.log(keith(1, 3)); //36     console.log(keith(1)); //undefined

  如果想访问同名参数中的第一个参数,则使用arguments对象。

1     function keith(a, a) {2         return arguments[0];3     }4 5     console.log(keith(2));  //2

 

  1.6 arguments对象

  JavaScript 中每个函数内都能访问一个特别变量 arguments。这个变量维护着所有传递到这个函数中的参数列表。

  arguments 对象包含了函数运行时的所有参数,arguments[0]就是第一个参数,arguments[1]就是第二个参数,以此类推。这个对象只有在函数体内部,才可以使用。

  可以访问arguments对象的length属性,判断函数调用时到底带几个参数。

1     function keith(a, b, c) {2         console.log(arguments[0]); //13         console.log(arguments[2]); //34         console.log(arguments.length); //45     }6 7     keith(1, 2, 3, 4);

 

  arguments对象与数组的关系

  arguments 对象不是一个数组(Array)。 尽管在语法上它有数组相关的属性 length,但它不从 Array.prototype 继承,实际上它是一个类数组对象。因此,无法对 arguments 变量使用标准的数组方法,比如 push, pop 或者 slice。但是可以使用数组中的length属性。

  通常使用如下方法把arguments对象转换为数组。

1     var arr = Array.prototype.slice.call(arguments);

 

2.闭包

  2.1:闭包定义

  要理解闭包,需要先理解  的区别。函数内部可以访问全局作用域下定义的全局变量,而函数外部却无法访问到函数内部定义(局部作用域)的局部变量。

1     var a = 1;2 3     function keith() {4         return a;5         var b = 2;6     }7     console.log(keith()); //18     console.log(b); //ReferenceError: b is not defined

  上面代码中,全局变量a可以在函数keith内部访问。可是局部变量b却无法在函数外部访问。

  如果需要得到函数内部的局部变量,只有通过在函数的内部,再定义一个函数。

1     function keith(){ 2         var a=1; 3         function rascal(){ 4             return a; 5         } 6         return rascal; 7     } 8     var result=keith(); 9     console.log(result());    //110 11     function keith(){12         var a=1;13         return function(){14             return a;15         };16     }17     var result=keith();18     console.log(result())    //1

  上面代码中,两种写法相同,唯一的区别是内部函数是否是匿名函数。函数rascal就在函数keith内部,这时keith内部的所有局部变量,对rascal都是可见的。但是反过来就不行,rascal内部的局部变量,对keith就是不可见的。这就是JavaScript语言特有的”链式作用域”结构(chain scope),子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。函数keith的返回值就是函数rascal,由于rascal可以读取keith的内部变量,所以就可以在外部获得keith的内部变量了。

  闭包就是函数rascal,即能够读取其他函数内部变量的函数。由于在JavaScript语言中,只有函数内部的子函数才能读取内部变量,因此可以把闭包简单理解成“定义在一个函数内部的函数”。闭包最大的特点,就是它可以“记住”诞生的环境,比如rascal记住了它诞生的环境keith,所以从rascal可以得到keith的内部变量。

  闭包可以使得它诞生环境一直存在。看下面一个例子,闭包使得内部变量记住上一次调用时的运算结果。

1     function keith(num) {2         return function() {3             return num++;4         };5     }6     var result = keith(2);7     console.log(result()) //28     console.log(result()) //39     console.log(result()) //4

  上面代码中,参数num其实就相当于函数keith内部定义的局部变量。通过闭包,num的状态被保留了,每一次调用都是在上一次调用的基础上进行计算。从中可以看到,闭包result使得函数keith的内部环境,一直存在。

  通过以上的例子,总结一下闭包的特点:

  1:在一个函数内部定义另外一个函数,并且返回这个内部函数。

  2:内部函数可以读取外部函数定义的局部变量

  3:让局部变量始终保存在内存中。也就是说,闭包可以使得它诞生环境一直存在。

  闭包的另一个用处,是封装对象的私有属性和私有方法。

1     function Keith(name) { 2         var age; 3         function setAge(n) { 4             age = n; 5         } 6         function getAge() { 7             return age; 8         } 9         return {10             name: name,11             setAge: setAge,12             getAge: getAge13         };14     }15     var person = Keith('keith');16     person.setAge(21);17     console.log(person.name); // 'keith'18     console.log(person.getAge()); //21

  

  2.2:立即调用的函数表达式(IIFE)

  通常情况下,只对匿名函数使用这种“立即执行的函数表达式”。它的目的有两个:一是不必为函数命名,避免了污染全局变量;二是IIFE内部形成了一个单独的作用域,可以封装一些外部无法读取的私有变量。

  循环中的闭包

  一个常见的错误出现在循环中使用闭包,假设我们需要在每次循环中调用循环序号

1     for(var i=0;i<10;i++){2         setTimeout(function(){3             console.log(i);    //104         }, 1000)5     }

  上面代码中,不会符合我们的预期,输出数字0-9。而是会输出数字10十次。

  当匿名函数被调用的时候,匿名函数保持着对全局变量 i 的引用,也就是说会记住i循环时执行的结果。此时for循环结束,i 的值被修改成了10。

  为了得到想要的效果,避免引用错误,我们应该使用IIFE来在每次循环中创建全局变量 i 的拷贝。

1     for(var i=0;i<10;i++){2         (function(e){3             for(var i=0;i<10;i++){4                 setTimeout(function(){5                     console.log(e);    //1,2,3,4...,106                 }, 1000)7             }8         })(i)9     }

  外部的匿名函数会立即执行,并把 i 作为它的参数,此时函数内 e 变量就拥有了 i 的一个拷贝。当传递给setTimeout 的匿名函数执行时,它就拥有了对 e 的引用,而这个值是不会被循环改变的。

转载于:https://www.cnblogs.com/Jasonellen/p/5793524.html

你可能感兴趣的文章
考题纠错2
查看>>
ps6-工具的基础使用
查看>>
关于CefSharp.WinForms的学习
查看>>
灵活运用 SQL SERVER FOR XML PATH
查看>>
es 加磁盘扩容
查看>>
linux 参数内核
查看>>
使用Azcopy在Azure上进行HBase的冷热备份还原
查看>>
计组_定点数一位乘_布斯公式
查看>>
linux下使用过的命令总结(未整理完)
查看>>
ES6的一些文章
查看>>
LeetCode 198, 213 House Robber
查看>>
New Year Permutation(Floyd+并查集)
查看>>
Qt编写输入法V2018超级终结版
查看>>
<context:component-scan>详解
查看>>
DS博客作业07--查找
查看>>
[JOI2017] サッカー (Soccer)
查看>>
Git 方法
查看>>
[Python] numpy.nonzero
查看>>
2016-11-29
查看>>
C#反射的坑
查看>>