JS with语句及其替代方案

JavaScript 中有一个特殊的 with 语句，可以指定一个对象，在 with 语句块中，可以直接访问对象中的属性，无须反复使用对象名加.号访问。

不过 with 语句已经被标记为过时了，并且无法在严格模式下使用，这里将介绍一下它的基本用法和替代语法。

with语句的结构如下：

with(obj){
    //语句
}

在 with 后边的小括号中接收一个对象作为参数，在{}中的代码可以直接访问它的属性，假如有一个员工对象，里边包含员工姓名和部门子对象，部门子对象中有部门名称和部门经理，代码如下：

let emp={
    name:＂张三＂,
    dept:{
        name:＂信息技术部＂,
        manager:＂李四＂,
    },
};

如果要访问 emp 中的 name 属性和 dept 中的 name 属性，使用普通方式编写的代码如下：

emp.name;
emp.dept.name;

使用 with 语句编写的代码如下：

with(emp){
    console.log(name);       //张三
    console.log(dept.name);  //信息技术部
}

这里把 emp 传递给 with 之后，在后边的代码中可以省略emp.，进而可以直接访问 emp 中的属性和嵌套的属性。

如果只想访问 dept 中的属性，则可以把 emp.dep t这个对象传递给 with 作为参数，代码如下：

with(emp.dept){
    console.log(name);     //信息技术部
    console.log(manager);  //李四
}

可以看到代码可以省略重复编写 emp.dept.，即可以直接访问 dept 中的 name 和 manager 属性。

使用 with 语句会造成代码不易阅读，例如当语句块中访问的属性不存于 with 的参数对象中时，会到上一层作用域寻找，这时就不容易分清是不是访问了对象中的属性，另外这种寻找也会影响性能。

对于 with 的替代语法，可以把中间对象保存到一个临时变量中再访问，以减少重复，代码如下：

const dept=emp.dept;
console.log(dept.name);     //信息技术部
console.log(dept.manager);  //李四

或者使用解构赋值，可以进一步省略对象的重复引用，代码如下：

const{name:empName}=emp;
const{name:deptName,manager}=emp.dept;
console.log(empName);   //张三
console.log(deptName);  //信息技术部
console.log(manager);   //李四