动态执行JS-把字符串当做代码去执行

使用 eval 将字符串当做代码来执行

function zhiXing(strCode){
    eval(strCode)
}
zhiXing("console.log('hello')")

在控制台会输出: hello

eval 的简单介绍

1,eval是同步代码
2,eval()执行代码时，读取变量是当前作用域；
 他会先去找当前作用域中有没有这个值；如果有就获取，如果没有往上一级作用域中去找

使用 eval 将字符串当做代码来执行-当前作用域

let a =3
function zhiXing(strCode){
    eval(strCode)
}
zhiXing("console.log('hello',a)")
// 输出的是3
解释： 他会先去找当前作用域中有没有这个值； 如果有就获取，如果没有往上一级作用域中去找

setTimeout 的简单介绍

1, setTimeout(a, number) 如果第一个参数接受的是字符串，会把字符串当做代码来执行；异步的
2，setTimeout(a, number)执行代码时，读取变量是全局作用域；

使用 setTimeout 将字符串当做代码来执行

let a =10
function zhiXing(strCode){
    let a = 4
    setTimeout(strCode,0)
}
zhiXing("console.log('hello',a)")
// 输出的是10；因为读取变量时，是全局作用域

使用 setTimeout 将字符串当做代码来执行-全局作用域

 function zhiXing(strCode){
    let a = 10
    setTimeout(strCode,0)
}
zhiXing("console.log('hello',a)")
// 报错，a is not defined 因为：setTimeout执行代码是全局作用域，而不是当前作用域

创建script来执行代码-同步的-读取变量时是全局作用域

let a =10
function zhiXing(strCode){
    let script = document.createElement('script')
    script.innerHTML = strCode
    document.body.appendChild(script)
}
zhiXing("console.log('hello',a)")

创建script来执行代码,同步执行，读取变量时是全局作用域

通过new Function 来执行代码 - 同步的 - 读取变量时是全局作用域

let a = 100
function zhiXing(strCode){
    let fn =new Function(strCode)
    fn()
}
zhiXing("console.log('hello',a)")
// 输出100

通过new Function 来执行代码,同步执行，读取变量时是全局作用域

创建 script 来执行代码与 new Function 的区别

script 会创建一个标签， new Function不会；
他们两个推荐使用  new Function；