javascript - js 匿名函数的相关问题
怪我咯
怪我咯 2017-07-05 10:50:25
0
2
963
(function(){
    var obj, sayHi;

    obj = {};
    
    sayHi = function(str){
        console.log(str);
    }
    
    obj.sayHello = function(str1){
        sayHi(str1);
    }
    
    obj.sayYo = function(str2){
        console.log(str2);
    }
    
    window.obj = obj;
    
})()
    
    obj.sayHello("hello world!");     // hello world!
    obj.sayYo("yo, what's up?");      // yo, what's up?

我自己碰到的一个小问题,不知道你们有没有,最近比较喜欢写匿名函数,刚看到这个的时候,习惯性倒过来看,心想仅仅是把obj暴露出来了,为什么在执行sayHello的时候可以执行sayHi?
想到之前看过js的运行机制。
不知道是不是这样子:
js在运行的时候应该是先预解析
所以在执行sayHello之前,匿名函数里面的sayHello应该已经变成了

    obj.sayHello = function(str1){
        function(str1){
            console.log(str1);
            };
        };

本人非专业的,不知道这样理解对不对?

怪我咯
怪我咯

走同样的路,发现不同的人生

全部回复(2)
刘奇

这个是作用域的问题。
只要记住函数在创建的时候就已经保存了作用域,不管你后面在哪里调用,结果都是一样,就像你这个代码,改成这样,结果还是一样(为了下面好分析,给这个立即调用函数加个名字,叫test):

(function test(){
    var obj, sayHi;

    obj = {};
    
    sayHi = function(str){
        console.log(str);
    }
    
    obj.sayHello = function(str1){
        sayHi(str1);
    }
    
    obj.sayYo = function(str2){
        console.log(str2);
    }
    
    window.obj = obj;
    
})()
    var sayHi = function(str) { // 就算在全局作用域里面加个sayHi函数,也不会对sayHello有任何影响
        console.log("Hi");
    }
    obj.sayHello("hello world!");     // hello world!
    obj.sayYo("yo, what's up?");      // yo, what's up?

分析一下,当obj.sayHello这个函数创建的时候,他会保存着当前所有的作用域:

sayHello.[[scope]] = [
    sayHelloContext.AO,
    testContext.VO,
    globalContext.VO
]

这个时候很明显sayHi函数在test的作用域里面,所以sayHello里面直接保存着这个引用,就算在全局作用域里面运行了,全局作用域里面重新定义的sayHi依然无法影响它,因为他是从test函数里面查找的,看看下面这个例子你就懂了:

var x = 10;
 
function foo() {
  alert(x);
}
 
(function () {
  var x = 20;
  foo(); // 10
})();

foo函数的作用域就是foo本身+全局作用域,所以就算在立即执行函数里面执行,输出值也不会是20,只会是10

刘奇

这么理解不好吧,这应该是闭包概念。http://www.ruanyifeng.com/blo...

在一个function里面访问一个变量,首先先看这个function有没有声明这个变量,没有,就到外层作用域去找,这里就是这种情形,在(function(){})()这个function里找到了sayHi,所以就直接调用了,如果这个时候是没有声明sayHi的话,那就继续往function外层去找,直接找到全局还是木有。那就没有然后了

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板