|
目录
1、通过条件判断给变量赋值布尔值
2、判断数组长度不为零
3、使用 includes 简化条件判断
4、使用 some 判断是否有满足条件的元素
5、使用 forEach 遍历数组，不形成新数组
6、使用 filter 过滤原数组，形成新数组
7、使用 map 对数组中所有元素批量处理，形成新数组
8、解构数组交换变量
9、解构对象
10、字符串拼接使用 ${}
1、通过条件判断给变量赋值布尔值
// bad
if (a === 'a') {
b = true;
} else {
b = false;
}
// good
b = a === 'a';
2、判断数组长度不为零
// bad
if (arr.length > 0) {
// ...
}
// good
if (arr.length) {
// ...
}
// 同理，判断数组长度为0
// bad
if (arr.length === 0) {
// ...
}
// good
if (!arr.length) {
// ...
}
3、使用 includes 简化条件判断
// bad
if (a === 1 || a === 2 || a === 3 || a === 4) {
// ...
}
// good
let arr = [1, 2, 3, 4];
if (arr.includes(a)) {
// ...
}
4、使用 some 判断是否有满足条件的元素
// bad
let arr = [1, 3, 5, 7];
function isHasNum (num) {
for (let i = 0; i < arr.length; i ++) {
if (arr[i] === num) {
return true;
}
}
return false;
}
// good
let arr = [1, 3, 5, 7];
let isHasNum = num => arr.some(item => item === num);
// best
let arr = [1, 3, 5, 7];
let isHasNum = (num, arr) => arr.some(item => item === num);
5、使用 forEach 遍历数组，不形成新数组
// bad
for (let i = 0; i < arr.length; i ++) {
// ...
arr[i].name = 'leo';
}
// good
arr.forEach(item => {
// ...
item.name = 'leo';
});
6、使用 filter 过滤原数组，形成新数组
// bad
let arr = [1, 3, 5, 7],
newArr = [];
for (let i = 0; i < arr.length; i ++) {
if (arr[i] > 3) {
newArr.push(arr[i]);
}
}
// good
let arr = [1, 3, 5, 7];
let newArr = arr.filter(num => num > 3); // [5, 7]
7、使用 map 对数组中所有元素批量处理，形成新数组
// bad
let arr = [1, 3, 5, 7],
newArr = [];
for (let i = 0; i < arr.length; i ++) {
newArr.push(arr[i] * 2);
}
// good
let arr = [1, 3, 5, 7];
let newArr = arr.map(num => num * 2); // [2, 6, 10, 14]
8、解构数组交换变量
// bad
let a = 1,
b = 2;
let temp = a;
a = b;
b = temp;
// good
let a = 1,
b = 2;
[b, a] = [a, b];
9、解构对象
// bad
setMsg (person) {
this.name = person.name;
this.age = person.age;
}
// good
setMsg ({name, age}) {
this.name = name;
this.age = age;
}
// 支持解构时重命名
setMsg ({name: newName, age: newAge}) {
this.name = newName;
this.age = newAge;
}
// 支持解构时设置默认值
setMsg ({name, age = 16}) {
this.name = name;
this.age = age;
}
10、字符串拼接使用 ${}
let person = {
name: 'leo',
age: 18
}
// bad
function sayHi (obj) {
console.log('大家好，我叫' + obj.name + '，我今年' + obj.age);
}
// good
function sayHi (obj) {
console.log(`大家好，我叫${obj.name}，我今年${obj.age}`);
}
// best
function sayHi ({name, age}) {
console.log(`大家好，我叫${name}，我今年${age}`);
}
|