1.基础概念：定义函数的方式一般定义函数有两种方式：函数的声明,函数表达式
1.1函数的声明如下方法 add 就是函数声明的代码结构： function add(x,y){ alert(x+y)
}
add(1,2) //弹窗显示：3
关于函数声明，它最重要的一个特征就是函数声明提升，意思是执行代码之前先读取函数声明。这意味着可以把函数声明放在调用它的语句之后。如下代码可以正确执行： add(1,2); //弹窗显示：3 function add(x,y){ alert(x+y) }
1.2函数表达式函数表达式中有几种不同的语法。最常见和最具代表性的一种如下所示：
var add = function(x,y){ alert(x+y) } add(1,2) //弹窗显示：3
这种形式看起来好像是常规的变量赋值语句。但是函数表达式和函数声明的区别在于，函数表达式在使用前必须先赋值。所以这段代码执行的时候就会出错： add(1,2) //无弹窗，报错： add is not a function var add = function(x,y){ alert(x+y) }
造成这种现象是因为解析器在向执行环境中加载数据时，解析器会率先读取函数声明，并使其在执行任何代码前可用；至于函数表达式，则必须等到解析器执行到它的所在的的代码行，才会真正的被解析。函数表达式中，创建的函数叫做匿名函数，因为function关键字后面没有标识符。 2.匿名函数的调用方式匿名函数，顾名思义就是没有名字的函数。上面的函数表达式中的创建，实际上是创建一个匿名函数，并将匿名函数赋值给变量 add，用 add 来进行函数的调用，调用的方式就是在变量 add 后面加上一对括号()，如果有参数传入的话就是 add(1,2)，这就是匿名函数的一种调用方式。 还有一种匿名函数的调用方式是：使用()将匿名函数括起来，然后后面再加一对小括号（包含参数列表）。我们再看一下以下一个例子： alert((function(x,y){return x+y;})(2,3)) //弹窗提示5 alert((new Function("x","y","return x+y"))(2,3)) //弹窗显示5
在javascript中，是没有块级作用域这种说法的，以上代码的这种方式就是模仿了块级作用域(通常成为私有作用域)，语法如下所示： (function(){ //这里是块级作用域 })();
以上代码定义并立即调用了一个匿名函数。经函数声明包含在一对圆括号中，表示它实际上是一个函数表达式。而紧随其后的另一对圆括号会立即调用这个函数。然而要注意一点： function(){
}();
上面的代码是错误的，因为Javascript将function关键字当作一个函数声明的开始，而函数声明后面不能加圆括号，如果你不显示告诉编译器，它会默认生成一个缺少名字的function，并且抛出一个语法错误，因为function声明需要一个名字。有趣的是，即便你为上面那个错误的代码加上一个名字，他也会提示语法错误，只不过和上面的原因不一样。提示为：Uncaught SyntaxError: Unexpected token ( 。 在一个表达式后面加上括号()，该表达式会立即执行，但是在一个语句后面加上括号()，是完全不一样的意思，只是分组操作符。 function foo(){ alert('测试是否弹窗') }() // SyntaxError: Unexpected token ) // 报错因为分组操作符需要包含表达式 function foo(){ alert('测试是否弹窗') }(1) // (1) => 等价于 1 // 相当于foo方法后面个跟了一个无关系的表达式子:(1)
所以上面代码要是想要得到想要的弹窗提示，就必须要实现赋值，如 a = function(){ alert('测试是否弹窗') }() // 弹窗提示成功
"a=" 这个片段告诉了编译器这个是一个函数表达式，而不是函数的声明。因为函数表达式后面可以跟圆括号。
因此下面两段代码是等价的
var aa = function(x){ alert(x) }(5) //弹窗显示：5
(function(x){ alert(x) })(5) //弹窗显示：5
从上面对于函数和匿名函数的了解，我们引申出来了一个概念，即自执行函数。那为什么a =function(){}() 这种表示方法可以让编译器认为这个是一个函数表达式而不是一个函数的声明？ 3.自执行匿名函数自执行函数，即定义和调用合为一体。我们创建了一个匿名的函数，并立即执行它，由于外部无法引用它内部的变量，因此在执行完后很快就会被释放，关键是这种机制不会污染全局对象。
下面我们来看下一些比较有趣的自执行函数表达方式: // 下面2个括弧()都会立即执行 (function () { /* code */ } ()) // 推荐使用这个 (function () { /* code */ })() // 但是这个也是可以用的
// 由于括弧()和JS的&&，异或，逗号等操作符是在函数表达式和函数声明上消除歧义的 // 所以一旦解析器知道其中一个已经是表达式了，其它的也都默认为表达式了 var i = function () { return 10; } (); true && function () { /* code */ } (); 0, function () { /* code */ } (); // 如果你不在意返回值，或者不怕难以阅读 // 你甚至可以在function前面加一元操作符号 !function () { /* code */ } (); ~function () { /* code */ } (); -function () { /* code */ } (); +function () { /* code */ } ();
// 还有一个情况，使用new关键字,也可以用，但我不确定它的效率 // http://twitter.com/kuvos/status/18209252090847232 new function () { /* code */ } new function () { /* code */ } () // 如果需要传递参数，只需要加上括弧()
4.总结看到这里相信大家对函数有了全新的认识,希望能够帮助到大家。 文中若有写的不对或需要改进的或者有不同的简介欢迎回复一起探讨。
|
