Dynamic Execution

动态执行的几种方式

1. eval


let code = "console.log(x)";
var x = 1;
function fun() {
  var x = 2;
  eval(code); // 2
}
fun();

2. setTimeout / setInterval （字符串参数，已废弃）


let code = "console.log(x)";
var x = 1;
function fun() {
  var x = 2;
  setTimeout(code); // 1
  setInterval(code); // 1
  // setTimeout 和 setInterval 的作用域是 window
}
fun();

3. new Function


let code = "console.log(x)";
var x = 1;
function fun() {
  var x = 2;
  new Function(code)(); // 1
}
fun();

4. 动态插入 <script> 标签


let code = "console.log(x)";
var x = 1;
function fun() {
  var x = 2;
  let script = document.createElement("script");
  script.textContent = code; // 1
  document.body.appendChild(script);
}
fun();

5. import()


import("./module.js")
  .then((module) => module.doSomething())
  .catch((err) => console.error(err));

6. Web Worker


const code = "self.onmessage = (e) => { console.log(e.data) }";
const blob = new Blob([code], { type: "text/javascript" });
const worker = new Worker(URL.createObjectURL(blob));
worker.postMessage("Hello, Worker!");