背景
冗杂的代码是一场灾难,对于后期的维护非常不友好,甚至可能会增加包的体积,影响页面初次下载的时间,所以为了在前端开发越来越精进,望大家对于代码质量上自己做好把控;由于公司每次代码上线都会有小伙伴之间相互代码评审的强制要求,所以下方的优化其实都是工作中高频遇到的问题,总想着哪天有时间能有个文档记录一下,
PS: 如有问题希指出
Javascript篇
switch语句 && 索引代码的优化
需求是年级回显,根据数字匹配搜索对应的明文字符;类似的需求还有回显星期和月份
1.简单的switch 实现,if else 实现以及三元实现代码不够简洁 (不推荐)
2.使用对象形式建立key-value映射关系&&map优化代码, 简单明了、
function grade(i){
let _Map = new Map([
[1, '一'],
[2, '二'],
[3, '三'],
[4, '四'],
[5, '五'],
[6, '六'],
]);
return _Map.get(i)?_Map.get(i)+'年级':'年级匹配不存在'
}
3.数组+索引优化代码
function grade(i){
return i>0 && i<8 ?['一','二','三','四','五','六','日'][i-1] + '年级':'年级匹配不存在'
}
默认值优化
用||代替三元写法
三元写法
function name(str) {
return str? str : "erin"
}
优化||写法
function name(str) {
return str || "erin"
}
单个if else带return,使用三元写法
/*传统写法*/
function test (bool) {
if(bool) {
return 1
} else {
return 0
}
}
/*简洁三元写法*/
function test (bool) {
return bool ? 1 : 0
}
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。