javascript - js anonymous function related issues

Question

{Code...} A small problem I encountered myself, I don’t know if you have it. I like to write anonymous functions recently. When I first saw this, I habitually looked at it backwards, thinking that it just exposed obj. , why can sayHi be executed when sayHello is executed? Thinking of seeing the operation of js before...

怪我咯 · Answer

This is a scope issue.
Just remember that the function has saved the scope when it is created. No matter where you call it later, the result will be the same. Just like your code, if you change it to this, the result will still be the same (for the sake of easy analysis below, give this immediately Call the function and give it a name, call it 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?

Analysis, when the obj.sayHello function is created, it will save all current scopes:

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

At this time it is obvious that the sayHi function is in the scope of test, so this reference is directly saved in sayHello. Even if it is run in the global scope, the redefined sayHi in the global scope still cannot affect it, because it is from test Search in the function, you will understand if you look at the following example:

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

The scope of the foo function is foo itself + the global scope, so even if it is executed in the immediate execution function, the output value will not be 20, but only 10

怪我咯 · Answer

This is not a good understanding, this should be a closure concept. http://www.ruanyifeng.com/blo...

When accessing a variable in a function, first check whether the function declares the variable. If not, go to the outer scope to find it. This is the case here, in the function (function(){})() I found sayHi, so I called it directly. If sayHi was not declared at this time, then continue to look for it in the outer layer of the function. If I find the overall situation directly, it still doesn't exist. Then there will be no more