js小陷阱汇总

1、数组排序

console.log([1, 2, 5, 10].sort()) //[1, 10, 2,5]console.log([1, 2, 5, 10].sort((a, b) => a-b)) // [1, 2, 5, 10]console.log([1, 2, 5, 10].sort((a, b) => b-a)) // [10, 5, 2, 1]

2、替换函数

var s = 'bob'console.log(s.replace('b', 'l')) // lobconsole.log(s.replace(/b/g, 'l')) // lolconsole.log(s) // bob

3、比较运算

console.log('abc' === 'abc') // trueconsole.log(1 === 1) // trueconsole.log([1, 2, 3] === [1, 2, 3]) //falseconsole.log({a: 1} === {a: 1}) // falseconsole.log({} === {}) // false

4、数组不是基础类型

var arr = []console.log(typeof arr) // objectconsole.log(Array.isArray(arr)) // true

5、document.querySelector，document.querySelectorAll
以前的原生DOM操作方法很繁琐，有了这两个可以使用单一的方法进行多种类型的DOM选择
但名字依旧繁琐，可以使用熟悉的 $ 来设置别名

var $ = document.querySelectorAll// 测试console.log($('body)) // 报错原因是 querySelectorAll 所需的执行上下文必须是 document，而赋值到 $ 调用后上下文变成了全局window正确用法：var $ = document.querySelectorAll.bind(document)querySelector 同理

常用的DOM选择方法

var query = document.querySelector.bind(document)var queryAll = document.querySelectorAll.bind(document)var fromId = document.getElementById.bind(document)var fromClass = document.getElementsByClassName.bind(document)var fromTag = document.getElementsByTagName.bind(document)