一些js技巧

170 阅读1分钟

解构

let obj = {
    outer: {
        name: 'aa',
        age: 11
    }
}
// 解构
const { outer: { name, age } } = obj;
console.log(name, age) // aa 11
// 这种情况下是把name age从outer解构出来以后,就无法使用outer了
console.log(outer) // Uncaught ReferenceError: outer is not defined

// 我们可以多次解构来达到这样的目的
const { outer: { name, age }, outer } = obj;
console.log(outer) // { name: 'aa', age: 11 }

数字分隔符

const num = 10000000;
// 这么多0搞晕了都,我们可以用分隔符_来分割
const num = 1_000_000_000

try...catch...finally谁厉害

function demo() {
    try {
        return 1;
    } catch (err) {
        console.log(err);
        return 2;
    } finally {
        return 3;
    }
}
console.log(demo()) // 3

// 还是finally厉害

随机生成指定位数的字符串

// 随机生成含有带有字母和数字的10位字符串
const str = Math.random().toString(36).substr(2, 10);

// Math.random() => 生成一个[0, 1)的数
// toString(36) => 转换成36进制的,根据mdn的说法,36进制的转换应该是包含了字母a-z和数字0-9的,所以到这一步就得到了一个类似于0.78adf8fg78az这样的字符串
// substr(from, length) => 即可

最快获取DOM的方法

// html中带有id属性的元素,都会被全局的id同名变量所引用,也就是
<div id="demo"></div>

console.log(demo) // <div id="demo"></div>