1.提炼函数
好处：
- 避免出现超大函数
- 独立出来的函数有助于代码复用
- 独立出来的函数更容易被覆写
- 独立出来的函数如果拥有一个良好的命名，它本身就起到了注释的作用
// 提炼前
var getUserInfo = () => {
ajax('http://xxx.com', (data) => {
console.log(data.name)
console.log(data.pwd)
console.log(data.address)
})
}
// 提炼后
var getUserInfo = () => {
ajax('http://xxx.com', (data) => {
printDetail(data)
})
}
var printDetail = (data) => {
console.log(data.name)
console.log(data.pwd)
console.log(data.address)
}
2.合并重复的条件片段
// 合并前
var paging = (curPage) => {
if(curPage <= 0) {
curPage = 0
jump(curPage) // 跳转
} else if(curPage >= totalPage) {
curPage = totalPage
jump(curPage) // 跳转
} else {
jump(curPage) // 跳转
}
}
// 合并后
var paging = (curPage) => {
if(curPage <= 0) {
curPage = 0
} else if(curPage >= totalPage) {
curPage = totalPage
}
jump(curPage) // 跳转函数独立出来
}
3.把条件分支语句提炼成函数
// 提炼前
var getPrice = (price) => {
var date = new Date()
if(date.getMonth() >= 6 && date.getMonth <= 9) {
return price * 0.8
}
return price
}
// 提炼后（起到了注释作用）
var isSummer = () => {
var date = new Date()
return date.getMonth() >= 6 && date.getMonth <= 9
}
var getPrice = (price) => {
var date = new Date()
if(isSummer()) {
return price * 0.8
}
return price
}
4.合理使用循环
// 未使用循环
var createXHR = () => {
var xhr
try {
xhr = new ActiveXObject('MSXML2.XMLHttp.6.0')
} catch(e) {
try {
xhr = new ActiveXObject('MSXML2.XMLHttp.3.0')
} catch(e) {
xhr = new ActiveXObject('MSXML2.XMLHttp')
}
}
}
// 使用循环
var createXHR = () => {
var versions = ['MSXML2.XMLHttp.6.0', 'MSXML2.XMLHttp.3.0', 'MSXML2.XMLHttp']
for(var i = 0, version; version = versions[i++]) {
try {
return new ActiveXObject(version)
}catch(e) {
}
}
}
5.提前让函数退出代替嵌套条件分支
// 未提前退出函数导致嵌套严重
var del = (obj) => {
var ret
if(!obj.isReadOnly) { // 不为只读的才能被删除
if(obj.isFolder) { // 如果是文件夹
ret = delFolder(obj)
} else if(obj.isFile) {
ret = delFile(obj)
}
}
return ret
}
// 提前退出使代码逻辑清晰
var del = (obj) => {
var ret
if(obj.isReadOnly) {
return
}
if(obj.isFolder) {
ret = delFolder(obj)
} else if(obj.isFile) {
ret = delFile(obj)
}
return ret
}
6.传递对象参数代替过长的参数列表
// 过长的参数列表导致维护困难
var setUserInfo = function( id, name, address, sex, mobile, qq ){
// do something
}
// 使用对象代替
var setUserInfo = function( userInfo ){
// do something
}
7.尽量减少参数数量
8.少用三目运算符
如果条件分支逻辑简单且清晰，这无碍我们使用三目运算符：
var global = typeof window !== "undefined" ? window : this;
但如果条件分支逻辑非常复杂，那我们最好的选择还是按部就班地编写if-else。
if-else 语句的好处很多，一是阅读相对容易，二是修改的时候比修改三目运算符周围的代码更加方便。
9.合理使用链式调用
链式调用带来的坏处就是在调试的时候非常不方便，如果我们知道一条链中有错误出现，必须得先把这条链拆开才能加上一些调试log或者增加断点，这样才能定位错误出现的地方。
10.分解大型类
如果某个类实现实在是太庞大，那么它就完全有必要作用一个单独的类存在。
11.用return退出多重循环
// 假设在函数体内有一个两重循环语句，我们需要在内层循环中判断，当达到某个临界条件时 退出外层的循环。我们大多数时候会引入一个控制标记变量
var func = () => {
var flag = false
for(var i = 0; i < 10; i++) {
for(var j = 0; j < 10; j++) {
if(i * j > 30) {
flag = true
break
}
}
if(flag == true) {
break
}
}
}
// 更简单的做法是在需要中止循环的时候直接退出整个方法
var func = () => {
for(var i = 0; i < 10; i++) {
for(var j = 0; j < 10; j++) {
if(i * j > 30) {
return
}
}
}
}
// 但是提前return可能会导致后面的代码没有被执行到，因此可以把循环后面的代码放到return后面
var print = (i) => {
console.log(i)
}
var func = () => {
for(var i = 0; i < 10; i++) {
for(var j = 0; j < 10; j++) {
if(i * j > 30) {
return print(i)
}
}
}
}
func()
