javascript关于立即函数

以前的知识总是忘，遇到代码又看不懂。要再复习一下，顺便记录一下。

 

关于立即执行函数： 

函数声明：function fnName () {…};使用function关键字声明一个函数，再指定一个函数名，叫函数声明。

函数表达式 ：var fnName = function () {…};使用function关键字声明一个函数，但未给函数命名，最后将匿名函数赋予一个变量，叫函数表达式，这是最常见的函数表达式语法形式。

匿名函数：function () {}; 使用function关键字声明一个函数，但未给函数命名，所以叫匿名函数，匿名函数属于函数表达式，匿名函数有很多作用，赋予一个变量则创建函数，赋予一个事件则成为事件处理程序或创建闭包等等。

fnName();
var fnName=function(){
    ...
}//报错，变量fnName还未保存对函数的引用，函数调用必须在函数表达式之后

var fnName=function(){
    alert('Hello World');
}();//函数表达式后面加括号，当javascript引擎解析到此处时能立即调用函数

function fnName(){
    alert('Hello World');
}();//报错，SyntaxError: expected expression, got ')'

function(){
    console.log('Hello World');    
}();//语法错误，虽然匿名函数属于函数表达式，但是未进行赋值操作，
//所以javascript引擎将开头的function关键字当做函数声明，报错：要求需要一个函数名

 

 在函数体后面加括号要是能能立即调用，则这个函数必须是函数表达式，不能是函数声明。

 这样的函数，是函数表达式：

  (function foo() {...})();
  等同于：
  var foo = function () {...};    
  foo();
  等价于：
  (function foo() {...}());

 

 

没有括号括起来，报错，不能立即执行。用括号括起来，就好像要把函数体包成一个整体准备赋值给某个变量，只是没有这个变量。直接把这个整体立即执行。

对于JavaScript 来说，括弧()里面不能包含语句，所以在这一点上，解析器在解析function关键字的时候，会将相应的代码解析成function表达式，而不是function声明所以，只要将大括号将代码(包括函数部分和在后面加上一对大括号)全部括起来就可以了。 

 函数声明和函数表达式变量名同名，而且是两个不同函数，谁优先级高？

  var hello=function (  ){
 alert("hello");
  }
  hello(  );
  function hello(  ){
    alert("hello world");
  }
  hello(  );

 

答案是有变量名的函数表达式的优先级高。这里都输出： hello。

变成简单点的：

function  hello(  ){
 alert("hello");  // hello world
  }
  hello(  );
  function hello(  ){
    alert("hello world");
  }
  hello(  ); //hello world      （完全一样的函数声明，后面的覆盖前面的）

  var hello=function (  ){
     alert("hello");
  }
  hello(  ); //hello
  var hello=function hello(  ){
    alert("hello world");
  }
  hello(  ); //hello world     （var hello是函数声明，按顺序给他们赋上函数，函数声明里的名字优先级没有变量名高）

 

 

 

作用域：

var scope="global";  
function t(){  
    console.log(scope);   //ubdefined
    var scope="local"  
    console.log(scope);   //local
}  
t();  

 

var scope="global";  是全局作用域，在函数里面，又定义了一个局部变量，变量提升。赋值未提升，所以是undefined，后面赋值了就是local

在C++等语言中，凡是有{}括起来的，都有块级作用域，但js没有，有函数作用域

当要调用一个对象时，它会从局部到全局，一个一个找，找到了就不继续找。

var name="global";  
if(true){  
    var name="local";  
    console.log(name)    //local
}  
console.log(name);    //local

 

if不是函数，没有块级作用域，它的上下文就是全局的。

相当于：

  var name="global";  
  var name="local";  
  if(true){  
        console.log(name)  
  }  
  console.log(name);  

 

再看这个，从局部到全局，一个一个找，找到了就不继续找。

name="lwy";  
function t(){  
    var name="tlwy";  
    function s(){  
        var name="slwy";  
        console.log(name);  
    }  
    function ss(){  
        console.log(name);  
    }  
    s();  //slwy
    ss();  //tlwy
}  
t();  

 

s()先在局部找，找到了var name='slwy'就输出了。

ss()在自己内部没有，就往上找，在t()函数内找，找到了var name='tlwy'，也就输出了。

若没找到，就会继续在全局中找。这样就形成了一个作用域链，在最内部就是链头，没找到就沿着链找，链尾就是全局作用域了。

 

一个常见的问题，按钮，每次都是弹出最后一个：

var aLi = document.getElementsByTagName('li');
for(var i = 0; i < aLi.length; i++){
  aLi[i].onclick = function(){
    alert(i); // 每次都弹出最后一个的值
  }
}

 

在页面加载完时，这个js函数就运行了，当我们点击时，它会去找i的值，最内部的匿名函数没有，就往上走，在外层找到了i，是4，就输出了4.

解决这方法：

for (var i = 0; i < aLi.length; i++) {
    aLi[i].onclick = function (msg) {
      show:function(){
        alert(msg)
}
Return show;
})(i)
}

for (var i = 0; i < aLi.length; i++) {
 (function(i){
   aLi[i].onclick = function () {
      alert(i);
     };
 })(i)
}

 

都是将他们保存起来

 

 文章用于学习记录，若有错误，望指正。