JavaScript和自我执行功能

Question

I'm trying to understand (probably simple concepts) about JS, and I've put together the below piece of code to explain what I don't get. What I do not understand is where the name variable is stored. Is that variable now global?

(function($) {

  var name = '';

  $.helloWorld = function(yourName) {
    name = yourName;
    console.log("Hello " + yourName);
  }

}(jQuery));

Answer 1

The name variable is local to the outer function, because it's declared with the var keyword. The inner function is a closure that contains a reference to that variable. Here's a better example that shows this off:

(function($) {

  var name = '';

  $.setName = function(newName) {
    name = newName;
  }

  $.showName = function() {
    console.log("Name is: " + name);

}(jQuery));

After defining this, you can do:

$.setName("Larry");
$.showName();
$.setName("Fred");
$.showName();

See How do JavaScript closures work?

Answer 2

This should help you understand:

(function(){

    var name;
    var scope1;

    // Here you can use scope1 and name

    (function(){

        var name;  //  <------------------------
        var scope2;                         // |
                                            // |
        // Here you can use scope1,scope2, and name

        (function(){

            var name;   //  <------------------------------
            var scope3;                                 // |
                                                        // |
            // Here you can use scope1,scope2,scope3, and name

        })();

     })();

})();

// Any\variable declared outside of any function scope is in the global scope.
// A variable declared here can be accessed by window.name from any scope
var name = 5;

So in this snippet, 3 scopes are created by the three functions and in the innermost you can access the variables that have unique names (scope1,scope2, and scope3) as well as the local variable name , which is a separate name from the one it the middle scope. Reusing variable names like that to prevent access to the variable in an outer scope is called shadowing.

Note that a variable that is not declared with the var keyword is auotmatically assumed to be in the global scope. It is a bad practice to declare many variables in the global scope as they can easily conflict with other scripts.