JS之with语句

在Javascript中，有一个特别的语句——with语句

1. 作用

将代码的作用域设置到一个特定的对象中。

2. 语法

with(expression) statements

3. 目的

为了简化多次编写同一个对象的工作

        <div id = "Div">
            jaiocoibewiobvie
        </div>
        <div id = "secondDiv">
           anvoalnvalsnv
        </div>
        <script>
            with(document)
            {
                var Div = getElementById("Div");
                var secondDiv = getElementById("secondDiv");
            }
            alert(Div.innerHTML);
            alert(secondDiv.innerHTML);
          
        </script>

对于常用的document.getElement类的方法，我们可以写成以上方式。因此，适当的使用with语句可以提高我们的编程速度，但是使用with语句也是会造成一些问题。
当我们大量使用with语句时，会导致浏览器性能下降。

原因

以上面的代码为例子，我们使用with语句关联了document对象。这就意味着在with代码块内部，每个变量首先会被看作一个局部变量，如果局部作用域中找不到该变量那么就会查询与with关联的对象中是否有该变量。

在这个截图中，我们可以发现，当我在with语句块中也声明并初始化了一个name变量后，我们得到的Name的结果为我在with语句块中设置的name的值，而不是Obj对象中的值，所以，这就证明了会首先在局部环境中查找变量。后面我们发现，Obj中的name发生了改变，也就是说，我本来想另外声明一个变量name,并初始化他为 “Celia"的，但是却导致了Obj中的name属性发生了变化，且在with语句之后打印name的值，会发现是undefined.。 经过多次试验，我发现每次都会发生变化，也就是说，每次声明一个与关联对象的属性名相同的变量时，对其进行初始化，都会改变with关联对象中的相应的属性的值。

因此，由于使用with语句，会首先在局部环境中查找变量，然后才是与with语句关联的对象中查找，因此当大量使用时，会影响浏览器性能。