更改编写 JavaScript 代码的旧方法 - JavaScript 代码的速记

1. 如果有多个OR(||)条件的简写

1
2
3
if (car === 'audi' || car === 'BMW' || car === 'Tesla') {
//code
}

在传统的方式中,我们曾经以上述模式编写代码。 但是我们可以简单地使用数组并包含而不是使用多个 OR 条件。 看看下面的例子。

1
2
3
if (['audi', 'BMW', 'Tesla', 'grapes'].includes(car)) {
//code
}

2. 如果有多个 And(&&) 条件的简写

1
2
3
if(obj && obj.tele && obj.tele.stdcode) {
console.log(obj.tele .stdcode)
}

使用可选的链接 (?.) 替换此代码段。

1
console.log(obj?.tele?.stdcode);

3. 用于检查变量的空值、未定义值和空值的简写

1
2
3
if (name !== null || name !== undefined || name !== '') {
let second = name;
}

做到这一点的简单方法是…

1
const second = name || '';

4.开关盒的简写,可从多个选项中进行选择

1
2
3
4
5
6
7
8
switch (number) {
case 1:
return 'Case one';
case 2:
return 'Case two';
default:
return;
}

使用地图/对象

1
2
3
4
5
6
const data = {
1: 'Case one',
2: 'Case two'
};
//Access it using
data[num]

5. 单行函数的简写

1
2
3
function example(value) {
return 2 * value;
}

使用箭头功能

1
const example = (value) => 2 * value

6. 有条件调用函数的简写

1
2
3
4
5
6
7
8
9
10
11
function height() {
console.log('height');
}
function width() {
console.log('width');
}
if(type === 'heigth') {
height();
} else {
width();
}

简单的方法

1
(type === 'heigth' ? height : width)()

7. 使用 if 将默认值设置为变量的简写

1
2
3
4
5
6
7
8
if(amount === null) {
amount = 0;
}
if(value === undefined) {
value = 0;
}
console.log(amount); //0
console.log(value); //0

只需写入

1
2
console.log(amount || 0); //0
console.log(value || 0); //0

🔰本文标题: 更改编写 JavaScript 代码的旧方法 - JavaScript 代码的速记

🔞本文链接: https://1han.wiki/change-your-old-methods-for-writing-a-javascript-code-shorthands-for-javascript-code-3poa/index.html

🌡️本文总热度