一、简单说明

简单说几点吧：

1. eval() 函数在 JavaScript 中是一个非常强大的函数，它可以将传入的字符串当作 JavaScript 代码进行执行。然而，需要明确的是，eval() 并不直接支持“内置浏览器函数”的概念，因为它执行的是任何有效的 JavaScript 代码，包括那些可以调用浏览器内置对象和方法的代码。
2. 浏览器提供的很多全局对象和方法（比如 document、window、console 等）都是 JavaScript 的一部分，可以在 eval() 中被调用，只要这些对象和方法在当前的执行上下文中是可访问的。
3. 这里有一些示例，说明如何在 eval() 中使用浏览器内置的全局对象和方法：
1. 使用 console 对象；
2. 使用 alert 函数；
3. 使用 function 函数处理；
4. 使用 window 对象；
5. 还有更多意想不到的惊喜哦；
4. 总而言简之，eval() 函数可以将 一串字符当作 JavaScript 代码去执行。

二、学习用法

（1）优点

使用 eval() 函数给你带来的方便和优势

【1】计算简单公式

很多时候如果需要动态的提供计算的公式，需要写一大段的公式计算逻辑去兼容，可能耗费大量的开发成本。为了快速了解 eval 的用法，直接 ① 打开浏览器；② F12 键控制台输入即可验证；

// 1. 基础运算：加减乘除、取余数
eval('12+12') // 24
eval('12-100') // -88
eval('12*12') // 144
eval(12/12) // 1
eval(10/3) // 3.3333333333333335
eval('12%4') // 0
eval('12%5') // 2

// 2.逻辑运算
console.log( eval(false) , eval(true) , eval(true) , eval(null) , eval(undefined) )// false true  null  undefined
// 2.1 小于 、小于等于
console.log(  eval( 10 == 11), eval(0 < -1)  ) //  false false
// 2.2 等于
console.log(eval( 11 == 11), eval('11 == 11') , eval(1 <= 1), eval('1<=1') ) //  true true true true
// 2.3 大于、大于等于
console.log(eval( 11 > 1), eval('11 >= 1') , eval(1 > -1), eval('1 >= 10') ) // true true true false

【2】计算混合简单运算

这里的混合简单运算指的是 加减乘除取模运算 增加对应的混合优先级括号（）、中括号[] 进行运算，注意此处常规计算的大括号" { }" 不被计算在内。

业务使用场景：例如薪酬计算系统，可以用得上。

eval( '{1+(2*3)+[34*(-2)-2]}' ); // ‘7-70’
eval( '(1+(2*3)+(34*(-2)-2))' ); // -63
// 综上，如果需要控制计算优先级，最好都是用 括号 来处理！

console.log( '简单混合运算：' + eval( ' (30*60)+1800/23-300+(500*22.5) ' ) );

【3】调用自定义函数执行

这里是一个很妙，很危险，很谨慎的一种做法，可以算得上是一个弊端了。一起来看看吧（完整演示代码如下）：

案例1：直接调用函数字符串执行

// 打开浏览器 - F12 - 控制台 直接输入：
> function evalAdd() {
     console.log('hello world!');
 }
>
> evalAdd()
 hello world!

eval(evalAdd()) // 输出函数的执行结果："hello world!"
// 直接相当于
eval('function evalAdd(){ console.log("hello world!");} evalAdd();');  // hello world!

案例2：一些意想不到的用法

// 直接控制台输出
> eval('console.log("Hello World!")') // 输出：Hello World!

// 直接替换页面内容
> eval('document.body.innerHTML = "<h1>Changed by eval</h1>";'); // 当前页面HTML直接变成标题

// 变量直接映射传递赋值
var str = '<a target="_blank" href="https://www.baidu.com">百度一下</a>'
eval('document.body.innerHTML = str')

// 直接页面跳转
eval('window.location.href = "https://www.baidu.com";');

效果演示如下：

更多的用法见【附录】地址。

（2）缺点

从上述用法中，我们也可以看出来，必然会存在一些弊端：

1. 安全问题：eval() 执行的代码具有与包含它的代码相同的权限。如果 eval() 执行的字符串来自不可信的源（如用户输入），恶意代码可能会被执行，导致跨站脚本攻击（XSS）等安全问题。
2. 性能问题：eval() 通常会比普通的 JavaScript 代码执行更慢，因为 JavaScript 引擎在执行之前需要先将字符串编译成可执行代码。
3. 调试困难：eval() 执行的代码在调试时可能会更加困难，因为调试器可能无法正确显示或高亮 eval() 中执行的代码。

三、总结

文章内容上述讲述了 eval() 的一些基本的用法和实例来明确如何去使用，但是很重要的一点就是 eval() 函数的弊端也是存在的，由于他可以直接讲字符串当作代码执行，所以，部门会出现安全问题、性能问题 以及 调试的难度。为了避免 eval() 带来的这些问题，在可能的情况下，应该寻找替代 eval() 的方法，比如使用 JSON.parse() 来解析 JSON 字符串，或者使用函数和闭包来动态地执行代码。

如果必须使用 eval()，请确保传入的字符串是安全的，且来自可信的源。

附录

• MDB 学习指南：eval() - JavaScript | MDNMDN Web DocsMDN logoMozilla logo
• MDN 闭包用法：闭包 - JavaScript | MDNMDN Web DocsMDN logoMozilla logo