js基础-常用的Js优化小技巧

130 阅读1分钟

日常开发中js可以优化的小技巧,记录一下,温故而知新!

1. if多条件判断

// bad
let schoolCode = '';
if(schoolCode === '12345' || schoolCode === '12346'|| schoolCode === '12347'){}
// good
const arr = ['12345','12346','12347'];
if(arr.indexOf(schoolCode)>-1){}
// or
if(arr.includes(schoolCode)){}

2. if...else...

// bad
let test = false;
if (x > 100) {
    test = true;
} else {
    test = false;
}
// good
let test = x > 10;

3. Null, Undefined, 空值检查

let first = '123';
// bad
if (first !== null || first !== undefined || first !== '') {
    let second = first;
}
// good
let second = first || '';

4. forEach循环

let testData = []
// bad
for (let i = 0; i < testData.length; i++){}
// good
for (let i in testData){}
// or
for (let i of testData){}

5. 函数条件调用

// bad
function test1() {
    console.log('test1');
}
function test2() {
    console.log('test2');
}
let test3 = 1;
if (test3 === 1) {
    test1();
} else {
    test2();
}

// good
(test3 === 1? test1:test2)();

6. switch条件

let data = 1,anything = 1;
function test() {}
// bad
switch (data) {
    case 1:
        test1();
        break;

    case 2:
        test2();
        break;

    case 3:
        test();
        break;
    // so on...
}

// good
let data = {
    1: test1,
    2: test2,
    3: test
};

data[anything] && data[anything]( "anything] && data[anything");

7. 多行字符串

// bad
const data = 'abc abc abc abc abc abc\n\t'
    + 'test test,test test test test\n\t';

// good
const data = `abc abc abc abc abc abc
     test test,test test test test`;

8. 隐式返回

// bad
function getArea(diameter) {
    return Math.PI * diameter
}

// good
getArea = diameter => (
    Math.PI * diameter
)

9. 重复字符串多次

// bad
let test = '';
for(let i = 0; i < 5; i ++) {
    test += 'test ';
}

// good
'test '.repeat(5);

10. 幂乘

// bad
Math.pow(2,3);

// good
2**3 // 8