1. 不要反向声明
我们应该变量声明是什么，而不是声明不是什么
// 这样是不好的
let isNotEmail = false;
if(isNotEmail ){
// ....
}
// 这样是比较好的
let isEmail = true;
if(isEmail ){
sendEmail()
}
2. 当有多个选择条件
当有多个选项，应该把选项维护成数组，对象之类
// 这样是不好的
let fruit;
if(fruit === 'apple' ||fruit === 'orange' || fruit === 'banana' ){
// ....
}
// 这样是比较好的
let fruit;
let FRUITS = [ 'apple','orange', 'banana'];
if(FRUITS.includes(fruit)){
// ...
}
3. 从数组中找出某项
当我们从数组中找出某项，尝试使用Array的find方法
// 这样是不好的
const FRUITS = [
{
name: "apple",
price: 9.9
},
{
name: "orange",
price: 4.9
},
{
name: "banana",
price: 3.9
},
]
let fruit;
for(let a = 0; a< FRUITS.length; a++){
if(FRUITS[a].price === 3.9){
fruit = FRUITS[a];
}
}
// 这样是比较好的
let fruit = FRUITS.find(fruit => fruit.price === 3.9)
4. 如果判断条件多，早点return
我们应该减少函数内的if else 嵌套
// 这样是不好的
function getPos(position) {
if(position){
if(position.province){
if(position.city){
return `position: ${
position.province} ${
position.city}`
}else {
return `position: ${
position.province}`
}
}else {
return "position: no province"
}
}else {
return "NO position"
}
}
// 这样比较好
function getPos({
province, city} = position) {
if (!province && !city) return "NO position";
if (!province) return "position: no province";
if (!city) return `position: ${
province}}`
return `position: ${
province} ${
city}`
}
5. 使用对象，而不是switch case
// 这样是不好的
function getAction(t) {
switch(t){
case 0:
return function () {
console.log(0)}
case 1:
return function () {
console.log(1)}
case 2:
return function () {
console.log(1)}
}
}
// 这样是好的
function getAction(t) {
const actions = [
function () {
console.log(0)},
function () {
console.log(1)},
function () {
console.log(2)}
]
return actions[t]
}
6. Use Optional Chaining
// 这样是不好的
let a = res && res.data && res.data.model && res.data.model.code === 200 || 'default'
let a = res ? .data ? .model ? .code ?? 'default'
// 开启这种语法需要babel插件
// @babel/plugin-proposal-optional-chaining
tip - 0 清空数组
const arr = [1,2,3,4]
arr.length = 0; // []
tip - 1 动态生成object
const getUser = (emailIncluded = false) => {
return {
name: 'John',
surname: 'Doe',
...emailIncluded && {
email : '[email protected]' }
}
}
tip - 2 循环n次的简单方法
// Array(3) 是长度为3的数组，但是里边没值，这样无效
Array(3).forEach(e => console.log(111))
// 这样有效
for (let t of Array(3)) {
console.log(111)}