1. 定义
使用一组“算法”,把他们封装起来,并能够互相调用。
(注意算法可以是简单的键值关系,一般以方法调用+参数方式优化代码)
2. 解决问题:
2.1 常见的条件判断
//优化前
let operateName = ''
if(operateKey === "add"){
operateName = '新增'
}else if(operateKey === "edit"){
operateName = '修改'
}else if(operateKey === "view"){
operateName = '查看'
}
//优化后
function getOperateName(key){
const array = [['add','新增'],['edit','修改'],['view','查看']]
const strategyMap = new Map(array)
return strategyMap.get(key) //通过键值关系获取对应 value
}
let operateName = getOperateName("add") ////输出 新增
//优化前
let operateName = ''
if(operateKey === "add" || operateKey === "update" ){
operateName = '编辑'
}else if(operateKey === "view" || operateKey === "info"){
operateName = '查看'
}
//优化后
const array = [['add','编辑'],['update','编辑'],['view','查看'],['info','查看']]
let map = new Map(array)
let operateName = map.get("add") //输出 编辑
2.2 表单校验
let loginFrom = document.getElementId("loginFrom")
loginFrom.onsubmit = function (e) {
const username = document.getElementId("username")
const pwd = document.getElementId("pwd")
const mobile = document.getElementId("mobile")
if (username === null || username === '') {
alert("用户信息为空哦")
return false
}
if (pwd === null || pwd === '') {
alert("密码不能为空")
return false
}
if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(mobile)) {
alert("电话信息不对")
return false
}
}
//代码优化
let strategy = {
isEmpty: function(value,msg){
if (value === null || value === '') {
return errorMsg
}
},
isMobile: function (value, errorMsg) { // 手机号码格式
if (!/(^1[3|4|5|7|8][0-9]{9}$)/.test(value)) {
return errorMsg
}
}
}
let usernameMsg = strategy.isEmpty(username,"用户信息为空哦")
let pwdMsg = strategy.isEmpty(pwd,"用户信息为空")
let pwdMsg = strategy.isEmpty(pwd,"用户信息为空")
let mobileMsg = strategy.isEmpty(pwd,"手机号格式有误")
const errorMsg = usernameMsg || pwdMsg || mobileMsg
if(errorMsg) {
alert(errorMsg)
return false
}