解析js中( ( ) { } ( ) )的含义

前端开发作者： 2024-08-25 20:05:01

//实例var tensquared=(function(x) { return x*x; }(10)); 首先我们来拆解这一行语句；一、 var tensquared = xx; 这是赋值语句；二、

//实例
var tensquared=(function(x) {
    return x*x;
}(10));

首先我们来拆解这一行语句；

一、 var tensquared = xx; 这是赋值语句；

二、function (x){ return x*x; }  这是一个匿名函数；所谓的匿名函数是指它没有自己的名字，既不是这样：
function name(){};
拥有一个函数名，也不像这样：
var name = function(){};
将函数赋给一个变量地址用于日后的调用；

为什么会有这样的函数呢，因为我们有时候有用到一些情况，我个只是临时地一次性地使用一个函数，用过了这个函数也就再没用了，那么这个时候就用到了匿名函数（当然，并不一定说只有一次性的才会用到匿名函数，还有其它的情况，不一一举例了。）

三、函数()  这样的语句我们都知道是让一个函数运行，而括号中的值表示传值，比如：
function name(arg){ alert(arg); };
name('yes');
那么，程序执行到name();这个语句的时候，会将'yes'这个字符串传递到函数name中去，并执行name函数；

四、那么，这个函数我们再来理解一下：
function(x){return x*x;}是一个函数，然后我们直接在它后面加上个括号，是不是表示直接运行这个匿名函数呢：

function(x) {return x*x;}(10)

这一步与下面的方法是一样的：

function name(x){return x*x;}
name(10);

那么再加上赋值：

var tensquared = function(x) {return x*x;}(10);

是不是与下面这一系列的代码起到的效果一样呢：

function name(x){return x*x}
var tensquared = name(x);

是不过两行的这种实现方式之后，那个函数我们以后还可以通过name(值);这样的方式再一次或者多次地去调用它，因为它有名，我们能用这个方法调用到它；

而var tensquared=function(x) {return x*x;}(10)这样的方式，是当时就执行了，然后将执行的结果赋值给了它前面的变量tensquared，我们以后想再调用那个return x*x所在的函数，却没办法了，因为它没名字，运行后就找不到了；

五、最后说说外面的括号，这个括号其实是可有可无的，而且这个括号的用法与人们常用的另一种用法有所偏差，因为括号括在最外围，已经失去了它的意义，其实应该是这样的：

var tensquared=(function(x) {return x*x;})(10);
只将匿名函数本体给括了起来，因为我们有时候这个function很长，而且说不定有多少行，那么加一个括号告诉程序，这是一个完整的整体，其实这一步就算这样用，也是可有可无的。

六、再说说这种用法的意义：

像这种用法，大多数时候就是用来获取到一个值，而这个值却是需要一系列的计算后才能得到的，而这个计算的过程，我们只需用到一次，不需要再用第二次了，这时候，这种语句结构就有用了：

例如我们获取用户在使用的是什么品牌的浏览器：

var browser = function(){
    if(是IE浏览器) return 'IE';
    else if(是chrome浏览器) return 'CH';
    else if(是Firefox浏览器) return 'FF';
}();

后面我们再想知道用户的浏览器品牌，只要调用变量browser这个变量，看看它里面的字符串是什么，就知道了。

是不是很有意思和很有实用价值的一种语句结构呢？