JavaScript中with不推荐使用,为什么总是出现在面试题中?

  • with的基本使用
  • 尴尬的with关键字

一、with的基本使用

with是用来扩展语句作用域的,什么意思呢?先来看看语法和示例:

语法:

with(expression){
    statement
}

expression:将给定的表达式添加到评估语句时使用的作用域上。

statement:任何语句。

示例:

 1 var obj = {
 2     name:"他乡踏雪",
 3     age:3,
 4     stature:666
 5 }
 6 with(obj){
 7     console.log(name);//他乡踏雪
 8     console.log(age);//3
 9     console.log(stature);//666
10 }

描述:

with语句可以形成作用域,并且将传入的对象上的属性解析为该作用域下的变量,且取对象属性的值为变量的初始值。并且在作用域内使用变量如果被修改,expression的属性值会跟着被修改。

应用小示例:

1 var a, x, y;
2 var r = 10;
3 
4 with (Math) {
5   a = PI * r * r;
6   x = r * cos(PI);
7   y = r * sin(PI / 2);
8 }

二、尴尬的with

关于with这个关键字,它的出现本身的出现是为了给代码除了方法以外,可以创建一个独立里作用域,并且可以结构对象属性成为作用域下的变量,减少代码量。而且在一定程度上还能够提升代码的执行效率。但其优势也是其劣势,而且ES5的严格模式下是不能使用的。而ES6的相关语法的出现继承了它的优势,还弥补了一些它的劣势,是不是非常尴尬。接下来具体看看with的优势与劣势:

优势:

with语句可以在不造成性能损失的情况下,减少变量的长度。其造成的附加计算量很少。使用with可以减少读取对象属性的值时,可减少对象命名空间的指针定位。

弊端:

with语句使得程序在查找变量值时,都是先在指定的对象中查找。所以那些本来不是这个对象中的属性的变量查找起来会很慢。如果对性能要求较高的场合,with下面的statement语句中的变量,只应该包含这个指定对象的属性。

上面是从性能方面考虑,接着从代码读写(语义)角度来考虑,with语句打散了对象与属性的关联性(书写和阅读),不利于代码的阅读。

接着从兼容性角度来考虑,with不能在严格模式下使用;而且还无法向前兼容,而ES6更是有一些语法可以替代with一些功能,比如let可以绑定作用域来替代with生成的作用域等。

1 function f(foo, values) {
2     with (foo) {
3         console.log(values)
4     }
5 }
6 f([1,2,3], obj)

上面这个示例代码在ES5中没什么问题,但是ES6Array.prototype添加了一个新属性values,所以数组实例将继承这个属性。with语句中的values就变成了[1,2,3].values。

最后为什么with作为一个开发中不被推荐使用的关键字为什么会频繁的出现在面试题中?

如果需要解析with的内部机制和特性就必然会涉及到作用域、变量查找、this指向(如果传入对象上有方法,这个方法内部指向肯定指向这个传入的对象)、ES6、原型链、严格模式、甚至性能问题这些都可以被提及和延申出来,不推荐使用就很大程度上不受关注,也可以考察到面试者对语言底层特性的熟悉程度,这对面试官来说显然是一个不错的问题引入点。