JavaScript 变量屏蔽

Posted 2020-10-16 KeepLearningEverday

不同作用域中相同名称的变量就会触发变量屏蔽：

{
    let x = {color:"blue"};
    let y = x;
    let z = 3;
    {
        //重复定义x，所以对全局变量x进行了变量屏蔽
        let x = 5;
        console.log(x);
        //未重定义y，所以变量y.color不变
        console.log(y.color);
        //x已经被重定义，所以x.color不存在，undefined
        console.log(x.color);
        //直接是对对象y的修改，
        //let y = {color:"red"} 前面对y的引用会报错undefined
        y.color = "red";
        console.log(z);
    }
    console.log(x.color);//red
    console.log(y.color);//red
    console.log(z)//3
}

作用域链。如果该作用域中未找到变量的定义，则会到上一级查询，如果在该作用于中已经定义同名变量，则会屏蔽上一级。且必须遵循先声明再使用的原则。