JavaScript的with语句

Question

这个with语句的作用域是obj,所以var x = 20也就是将obj.x设置为20,但是我下面的var y = 30,不是给obj.y设置值吗？为什么外面反应的却是undefined？

Answer 1

1)foo函数通过obj.foo方式调用时，with(this)中的this指向obj
2)声明过的变量，多次声明是无效的，也就是说

with(this){
    var x=20;
    var y=30;
    console.log(y);
}

等价于

//因为obj.x属性已经存在声明过了，其实就是一个赋值语句 obj.x=20;
//因为obj.y属性不存在，并且在with语句块中，不会主动obj中添加属性y，那么y变量只在with作用域中有效
with(this){
    x=20;
    var y=30;
    console.log(y);//输出 30
}

3) 如果代码这样写

with(this){
    x=20;
    y=30;
    console.log(y);
}

那么我们将发现y是一个全局变量

var obj={
    x:10,
    foo:function(){
        with(this){
            var x=20;
            y=30;
            console.log(y);
        }
    }
}

obj.foo();//30
console.log(obj.x);//20
console.log(obj.y);//undefined
console.log(y);//30

Answer 2

obj没有定义y属性

Answer 3

with语句中把对象obj里面的属性的优先级高于该with所在作用域中其他同名变量。
obj.foo() //调用的时候 你obj里的with(this)指针引用是obj.

也就是说with(this){...}的作用域链的最前面其实是this也就是obj.

这时候with(this){...}中对x,y赋值的操作它都会去作用域链最前端开始找

var声明的变量只在当前作用域有效。但是变量在生命前会在作用域中找变量

是否已经存在。如果存在就直接使用不用再声明

因为obj的作用域在最前面 所以找到了x,没有找到y.

y就变成了with(this){}这个作用域中的变量。

Answer 4

原对象没有y属性，你那个with函数里的y只是个普通变量而已。

而且不也不建议使用这个方法吗？

Using with is not recommended, and is forbidden in ECMAScript 5 strict mode. The recommended alternative is to assign the object whose properties you want to access to a temporary variable.

详细参考这里：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/with。