javaScript 小知识

??  运算符只有前面的值是 undefined 才会执行
let status = undefined;
let text = status ?? "暂无"
console.log(text) // 暂无

?.运算符这在有时候处理对象时非常有用，看下面案例，
person.name返回undefined然后在调用toString
这时肯定会报错，这时使用?.运算符就不会产生错误，
?.运算符是只有在当值不是undefined时才会调用toString方法。

~~双非运算符可以用于向下取整。
console.log(~~4.3) // 4

合并对象
使用Es6新增方法Object.assign，合并对象如果对象里面有重复的值，则后面覆盖前面，可以接收无限参数。在工作中也是经常使用。
let person = {name: "蛙人", age: 24}
let obj = Object.assign({}, person)
console.log(obj) // {name: "蛙人", age: 24}

伪数组转换为真数组
伪数组不能调用真数组对象上的方法，所以得将伪数组转换为真数组，获取js元素是伪数组。
document.querySelectAll("div") // NodeList[div, div, div, div]
[...document.querySelectorAll('div')] // 转换为真数组
Array.from(document.querySelectorAll('div')) // 转换为真数组

检测值是否为数组
let arr = []
console.log(Array.isArray(arr)) // true
console.log(Object.prototype.toString.call(arr) == "[object Array]") // true

获取一个值的下标
在Es6之前，我们只知道使用indexOf方法去获取下标，Es6之后还有一个方法哦，如果找到该值返回当前值的下标，找不到返回 -1
let colors = ["red", "blue", "green"]
function getIndex(val) {
    return colors.findIndex(i => i == val)
}
getIndex("blue") // 1

检测当前页面是否被隐藏
监测当前页面是否被隐藏，当切换页面时显示true, false就是打开状态。一般在工作用主要用到用户在页面停留了多长时间。
document.addEventListener("visibilitychange", function() {
   console.log(document.hidden);
});