前端小技巧

收录一些关于前端的小技巧，包括新特性，常用代码片段，算法伪码等

提示

由于浏览器未必能支持新特性，使用前请到 Caniuse 相关网站查询不同浏览器对该特性的适用性。

NaN

NaN 表示不是一个数字，是一个「警戒值」 sentinel value（有特殊用途的常规值），用于指出数字类型中的错误情况，一般是执行数学运算没有成功后返回的结果。

// 该数据类型为 number
typeof NaN; // "number"

注意

NaN 是一个特殊值，它和自身不相等，是唯一一个**非自反**的值，即 NaN !== NaN 为 true

所以不能直接用 !== 不等号来判断某个变量/值是否为 NaN

JS 提供了原生方法 isNaN(target) 用于判断传入的值 target 是否不为 number，所以传入 NaN 或非数值都会返回 true

如果只是想判断某个变量/值是否为 NaN，则需要判断它的类型是否为 typeof target === 'number' 再使用 isNaN(target) 方法判断

提示

也可以使用 Number.isNaN(target) 方法直接判断传入的值 target 是否为 NaN

该方法会检查入参的数据类型是否为 Number 以及是否为非数字，它是 JS 原来所提供的全局方法 isNaN() 的一个更稳妥的版本

使用 JS 所提供的全局方法 structuredClone(obj) 可以实现深拷贝 obj 对象

提示

针对「规模较小」的对象可以简单地使用 JSON.parse(JSON.stringify(obj)) 来进行拷贝

但是该方法并不能复制对象中的函数或 Symbol 等值，而 structuredClone() 方法则可以，而且对于「规模较大」的对象拷贝，相对而言性能会更好