<前端技术>JavaScript作用域

时间:Aug. 8, 2017 分类:

目录:

JavaScript无块级作用域

因为在Java语言中,每一个{}都是一个作用域。

而在JavaScript中是没有块级作用域

function Main(){
    if(1==1){
        var name = 'why';
    }
    console.log(name);
}

执行结果

why

JavaScript函数作用域

在JavaScript中每个函数为一个作用域,在外部无法访问内部作用域中的变量

function Main(){
    var innerValue = 'seven';
}

Main();

console.log(innerValue);

执行结果

Uncaught ReferenceError: innerValue is not defined

JavaScript作用域链

JavaScript的函数中出现嵌套函数,就会出现作用域链,查找顺序为从内到外,知道没有抛出异常。

示例一

num = '3';

function Func(){
    var num = "2";
    function inner(){
        var num = '1';
        console.log(num);
    }
    inner();
}
Func();

执行结果

1

这是由于在执行的时候,inner内部有num变量。

示例二

num = '3';

function Func(){
    var num = "2";
    function inner(){
        console.log(num);
    }
    inner();
}
Func();

执行结果

2

这是由于在执行的时候,inner内部没有num变量,向上级作用域Func中寻找num变量。

示例三

num = '3';

function Func(){
    function inner(){
        console.log(num);
    }
    inner();
}
Func();

执行结果

3

这是由于在执行的时候,inner内部和上级作用域Func都没有num变量,使用了全局变量num。

JavaScript作用域链执行前就创建完成

JavaScript作用域链执行前就创建完成

示例一

num = '3';

function Func(){
    var num = "2";
    function inner(){

        console.log(num);
    }
    num = '1';
    return inner;
}

var ret = Func();
ret();

执行结果

1

在Func()作用域链生成时,从上num变量值为2,到下的时候num变量的值已经由2被重置为1

示例二

num = '2';
function Bar(){
    console.log(num);
}

function Func(){
    var num = "1";

    return Bar;
}

var ret = Func();
ret();

执行结果

2

作用域链为全局到Bar(),所以Bar()中没有num变量直接去全局找num。

示例三

function func() {
    for(var i=0;i<10;i++){
    console.log(i)
    }
}

function func() {
    for(var i=0;i<10;i++){

    }
    console.log(i)
}

0~9 10

JavaScrpit变量需要提前声明

在JavaScript中如果不创建变量,直接使用会报错。

不创建变量

console.log(why);

执行结果

Uncaught ReferenceError: why is not defined

创建变量1

var why;
console.log(why);

执行结果

undefined

创建变量2

console.log(why);
var why='wanghongyu';

执行结果

undefined

这是因为从上到下,先在内部生成了var why,而并没取值,然后才执行的console.log