JS查漏补缺——with语句、eval函数

124 阅读2分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第4天,点击查看活动详情

with语句

with 语句: 可以形成自己的作用域,为逐级的对象访问提供命名空间式的速写方式. 也就是在指定的代码区域, 直接通过节点名称调用对象。

with 通常被当做重复引用同一个对象中的多个属性的快捷方式,可以不需要重复引用对象本身。

原先:

var obj = {name:'巴咔巴咔',age:1,message:'hello world'}
var message = 'bye world'
function foo(){
	function bar(){
    console.log(message)
  }
  bar()
}
foo()
// 输出: bye world 
// 沿着作用域链一层一层往上查找,直到找到

with语句后:

var obj = {name:'巴咔巴咔',age:1,message:'hello world'}
var message = 'bye world'
function foo(){
	function bar(){
    with(obj){
      console.log(message)
    }
  }
  bar()
}
foo()
// 输出: hello world
// 先在with括号内指定的对象进行查找,找不到就再往上层作用域找

注意1: 单独一个对象不会形成一个作用域

注意2:在严格模式下with语句 所以with语句在严格模式下是行不通的。
在MDN的开头就写了:不建议使用with语句,因为它可能是混淆错误和兼容性问题的根源。 所以主要是了解一下有with语句这么一个东西就行,在现实开发中不推荐使用

eval函数

eval()函数会将传入的字符串当做 JavaScript 代码进行执行。

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

有时候在webpack生成的临时代码会看到,但在打包生成的文件中是不会有eval函数代码的

在MDN上也有写到:永远不要使用eval!
原因有这么几个:

  • eval代码的可读性非常的差(代码的可读性是高质量代码的重要原则); (可读性差)
  • eval是一个字符串,那么有可能在执行的过程中被刻意篡改,那么可能会造成被攻击的风险; (安全性低)
  • eval的执行必须经过JS解释器,不能被JS引擎优化 (效率低)

总结:虽然说在实践上不推荐使用with语句和eval函数,但也许在某些地方就出现了这两个让你分析它们的用法和不使用原因,多了解一下还是好的🤔