JavaScript中的作用域问题

拼搏现实的明天。 2022-09-24 12:26 165阅读 0赞

# c\#中的作用域 #

c\#中是块级作用域，变量的作用域是由花括号限定的。

static void Main(string[] args)
        {
            if(true)
            {
                int num = 10;
            }
            System.Console.WriteLine(num);
        }

这段代码会报错，因为WriteLine无法访问到num。  
变量num定义在花括号里边，从定义开始到或括号结束这个范围可以使用，出了这个范围就无法访问。

if(true)
        {
            int num = 10;
            System.Console.WriteLine(num);
        }

这段代码可以运行，因为变量的定义和使用在同一个花括号内。

# JavaScript中的作用域 #

在JavaScript中没有块级作用域

if(true) {
            var num = 10;
        }
    alert(num);

结果是弹窗10

--------------------

在JavaScript只有函数可以限定一个变量的作用范围。也就是说，在JavaScript中，在函数里面定义的变量，可以在函数里面被访问，但在函数外无法访问。

>  在函数中使用了var定义变量，则为局部变量，它只存在这个函数的上下文中，反之，如果没有使用var，那个变量就将被视为一个全局变量。  
> 在函数外定义变量即使使用var，也为全局变量。  
> 建议全用var声明。

var func = function() { 
            var num = 10;
    };
    
    alert(num);

这句话会报错，因为num未定义

## 嵌套函数中变量的作用域 ##

在JavaScript中是可以在函数中定义函数的

var func = function() { 
            var num = 10;
            var sub_func = function() { 
                var num = 20;
                alert(num);
            };
            sub_func();
        };
    func();//20

显示结果为20，alert（num）的时候，会先在他所在函数里寻找是否有声明的var，有的话就用。

var func = function() { 
            var num = 10;
            var sub_func = function() { 
                alert(num);
            };
            sub_func();
        };
    func();//10

显示结果为10，alert在当前sub\_fun函数中没有找到num，于是就到上一级函数寻找。

var num=20;
    var func = function() { 
            alert(num);
            var num = 10;
            alert(num);
    };
    func();

这段函数会显示什么？  
会弹出两个框，一个是undefined，一个是10  
第一个alert执行的时候会在当前函数中寻找是否有num定义，结果是有，但对num的赋值是在下一行代码才执行，所以num的值为undefined（即未定义）。  
第二个alert执行的时候也是会先在当前函数中寻找是否有num定义，结果是有，并且已经赋值，所以num的值为10。  
上面这段代码就相当于

var num=20;
    var func = function() { 
            var num;
            alert(num);
            var num = 10;
            alert(num);
    };
    func();

如果在函数中没有声明num的话，就会往上找。

var num=20;
    var func = function() { 
            alert(num);
    };
    func();

打印结果为20

因此在实际开发的时候，推荐将变量都写在开始的的地方。  
jQuery库中就是这么完成的。

jQuery.extend = jQuery.fn.extend = function() { 
        var src, copyIsArray, copy, name, options, clone,
            target = arguments[0] || {},
            i = 1,
            length = arguments.length,
            deep = false;
    
        // Handle a deep copy situation
        if ( typeof target === "boolean" ) {
            deep = target;
            target = arguments[1] || {};
            // skip the boolean and the target
            i = 2;
        }
        ....

这是在jQuery中截取的一段代码，在这个函数的开头就都把变量定义好了。