一篇文章让你搞懂with语句和eval函数！！！

with语句的作用是什么？

要想了解with的作用是什么，我们还得先从定义下手

在《JavaScript权威指南》(第五版, David Flanagan, P109)中的解释是:

with语句用于暂时修改作用域链...这一个语句能够有效地将Object添加到作用域链的头部，然后执行statement，再把作用域链恢复到原始状态...虽然有时使用with语句比较方便，但是人们反对使用它。使用了with语句的JavaScript代码很难优化，因此它的运行速度比不使用with语句的等价代码要慢得多。而且，在with语句中的函数定义和变量初始化可能会产生令人惊讶的、和直觉相抵触的行为(这一行为以及产生的原因非常复杂，在这里我们不做解释)

用一句话总结就是:with会扩展出一个语句的作用域链

可是这样的解释对于大多数同学来说还是太过于生硬，很不好理解，那我们下面我们用代码例子证明一下

//全局作用域下面定义的Hello World
var message = "Hello World"

// with语句: 可以形成自己的作用域
//obj作用域内定义的message的值为obj message
var obj = { name: "why", age: 18, message: "obj message" }

function foo () {
  function bar () {
  //这里的message会根据作用域链最终找到全局作用域
    console.log(message)//Hello World
    with (obj) {
      console.log(message)//{obj message}
    }
  }
  bar()
}
foo()

但是我们强烈不建议使用with语句，因为它可能是混淆错误和兼容性问题的根源。

但是我们还是要了解一下with的作用因为源码中有with语句，了解with语句，可以方便我们对代码的理解

eval函数的作用

eval函数的作用：eval() 函数会将传入的字符串当做 JavaScript 代码进行执行，如果传入的字符串是表达式则返回表达式求值结果，否则返回 undefined 。

同样我们还是用例子来理解一下

var jsString = 'var message = "Hello World"; console.log(message);'

eval(jsString)
//打印执行出Hello World

但是我们同样不建议在开发中使用eval

原因：

1. eval代码的可读性非常的差（代码的可读性是高质量代码的重要原则）；
2. eval是一个字符串，那么有可能在执行的过程中被刻意篡改，那么可能会造成被攻击的风险；
3. eval的执行必须经过JS解释器，不能被JS引擎优化；

我正在参与2023腾讯技术创作特训营第四期有奖征文，快来和我瓜分大奖！