你是不是经常遇到这样的场景：代码明明看起来没问题，运行起来却各种报错？或者某个功能在测试环境好好的，一到线上就出问题？

实际来说，这些坑我也都踩过。从刚开始写JS时的一头雾水，到现在能够游刃有余地避开各种陷阱。我花了太多时间在调试和填坑上。

今天这篇文章，就是要把我这些年积累的避坑经验全部分享给你。看完之后你不仅能避开常见的JS陷阱，还能背后的原理，写出更健壮的代码。话说回来，

变量声明那些事儿

先来说说最基础的变量声明。很多新手觉得var、let、const不都差不多吗？结果写着写着就出问题了，

再看看看这个例子，

// 问题代码
for {
setTimeout {
console.log;// 猜猜会输出什么，},1000);}
// 实际输出：5,5,5,5,5 // 是不是跟你想的不一样？

为什么会这样？因为var是函数作用域，而不是块级作用域。循环结束后i的值已经变成5了所有定时器回调函数访问的都是同一个i。老实说，

怎么解决？至于用let就行，

// 正确写法
for {
setTimeout {
console.log;// 输出：0,1,2,3,4
},1000);说起来，}

let是块级作用域。每次循环都会创建一个新的i绑定，所以每个定时器访问的都是自己那个循环里的i值。

再来看const，很多人以为const声明的变量完全不能改。其实不然：

const user = { name: '小明' };user.name = '小红';// 这个是可以的，老实说，console.log;// 输出："小红"
// 但是这样不行：
// user = { name: '小刚' };// 报错，

const保证的是变量引用的不变性，而不是对象内容的不变性。如果想完全冻结对象，可以用Object.freeze。

类型转换的坑

JS的类型转换是最让人头疼的部分之一了。 说起来，来看看这些让人迷惑的例子：

console.log;话说回来，// 输出：""
console.log;// 输出：""
console.log;// 输出：""
console.log;老实说，// 输出：""
console.log;老实说，// 输出："null"
console.log;// 输出：0

为什么会这样？这涉及到JS的类型转换规则。+运算符在遇到字符串时会优先进行字符串拼接，而-运算符则始终进行数字运算。老实说，

再看这个经典的面试题：

console.log;// 输出:false

这不是JS的bug，而是浮点数精度问题。几乎所有编程语言都有这个问题。其实，方法是使用小数位数精度处理：

function floatingPointEqual {
return Math.abs 

箭头函数的误解

箭头函数用起来很爽。但很多人没真正理解它的特性：

const obj = {
说到name，'小明',regularFunc: function {
console.log;其实，},arrowFunc: => {
console.log;}
}，obj.regularFunc;// 输出："小明"
obj.arrowFunc;话说回来，// 输出:undefined

箭头函数没有自己的this。它继承自外层作用域，在这个例子里箭头函数的外层是全局作用域，this指向全局对象。

异步处理中的陷阱与常用方法

< b=""><>

< b<="" p=""> <>