首页 > 代码库 > javascript匿名方法

javascript匿名方法

2024-07-02 03:01:18   229人阅读

首先，看一段很有意思的代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>匿名</title>
    <script type="text/javascript">
        (function() {
            aa = 1;
        })();
        alert(aa);
    </script>
</head>
<body>
</body>
</html>

这个结果是什么？

很多时候在看第三方js插件时，会看的(function(){})(); 这种样子的代码。.net程序猿很费解。

这种写法是非常好的方式。

javascript是一种上手简单，往后学就会觉得比较难，再往后又会觉得简单的语言。(看的资料上很多这么说，不幸的是我一直觉得它很难。)写javascript千万不能把它当类似C语言的写法写。javascript可以说都是对象。(function(){})();这么个写法，不知道专业人员怎么说，我的理解是函数表达式和执行函数。因为没有var 所以可以节省变量，不会给window下添加新的对象。

不会给window下添加新的对象，这句话怎么理解呢？

首先应该说下javascript的变量作用域，javascript是没有块作用域，变量一旦声明，就会在整个方法体中。下面代码；alert出的结果是2。而不会报变量未定义的错误。但在A方法外，i 变量就出作用域了。

<script type="text/javascript">
function A()
{
    for(var i=0;i<2;i++)
    {}
    alert(i);
}
A();
</script>
 

下段代码会弹出undefined 和2。这时候A(); 也可以通过window.A()；来调用。 注意这里 为何是 undefined  而不是报的 a is not defined ?

function A()
{
    alert(a);
    var a = "2";
    alert(a);
}
A();//可以换成 window.A();

变量a，也会添加到window下。可以这么调用  window.a;   看下面代码：

<script type="text/javascript">
var a;
</script>

接下来再说函数表达式。var A=function(){alert(1);};

这种声明方法和function A(){} 大体相同，不同就是有执行先后顺序的区别。就像定义变量一样。看下面代码：这时可以弹出1。

A():
function A()
{
    alert(1);
}

换成下面这种则会报A is not a function。 var A =function(){alert(1);}必须要在 A(); 之前。

A();
var A = function () {
     alert(1);//必须在A();执行方法 前面。
};

有了这些知识。理解(function(){alert();})();这种方式的代码就简单了。 就是一个函数表达式 立即执行。

(function()
{
    alert(1);
})();

把function(){alert(1);} 换成上面的A.因为 A==function (){alert(1);}  所以就成上面的样子。

 

变量A存放方法的引用地址。

这样window下也没有新增对象。 有些地方会说不会污染全局变量。

在写js插件时，只暴露一个对象，供调用。可以这么写，看下面代码：

 

(function(){
    window.cjc={
        A:function(){
　　　　　　 alert(1);
　　　　 },
        Sum:function(a,b){
　　　　    alert(a+b);
　　　　 }
    };
})();

 

暴露出 cjc  一个变量。使用A方法时，cjc.A(); 使用Sum方法时，cjc.Sum(1,2);

还可以这么写。看面代码：

(function (nc) {
      nc.A = function () {
            alert(1);
       };
       nc.Sum = function (a, b) {
            alert(a + b);
       };
 })(cjc = {});
//调用Sum方法
cjc.Sum(1,2);

当暴露的变量有冲突时，可以换，只要把 cjc={} 换成别的就行如下面代码：

(function (nc) {
      nc.A = function () {
            alert(1);
       };
       nc.Sum = function (a, b) {
            alert(a + b);
       };
 })(test = {});
//调用Sum方法
test.Sum(1,2);


为何可以使用test={} 这种形式？js的语法，上面的代码可以等效成下面这种。

var test={};
(function (nc) {
      nc.A = function () {
            alert(1);
       };
       nc.Sum = function (a, b) {
            alert(a + b);
       };
 })(test);
//调用Sum方法
test.Sum(1,2);

 看下面这段代码。

if(a=1)
{
    alert(a);
}

结果是 alert出1。

 

javascript语法特性跟别的C、C#这类语言，区别还是不小的。此外javascript特性还有很多，function就有不少，像原型扩展等。感觉开始接触时实战好点。当能做出简单的东西时，要想提高还是得看基础。

 能力不足，有地方理解不到位。


联系
我们