MVC 三个对象分别做什么
M是model(数据模型),负责增删改查数据层
const model = { //这个模块负责操作所有数据
get(){
//获取数据
},
update(){
//修改数据
},
delete(){
//删除数据
}
}
V是view(视图),负责用户视图界面
const view = {
el: null,
template: ` //html模板
<div>
</div>
`,
init() {
//初始化视图
},
render() {
//将模板渲染到视图
}
}
C是controller(控制器),负责其他
const controller = {
init(){
//初始化调用绑定事件等
},
events(){
//所有事件绑定
}
}
EventHub 有哪些 API,是做什么用的
on(绑定),emit(触发),off(解绑)
//用vue的eventHub举例,假设引入vue的前提下
const app = new Vue()
//此时app对象的原型链上就有vue封装过的eventHub($on,$off,$emit)
app.$on('eventName',fn(data)=>{}) //绑定监听事件
app.$off('eventName') //解绑监听事件
app.$emit('eventName',data) //触发事件
表驱动编程是做什么的
假设现在有一个需求,有七天的工作行程安排,要求返回每天的工作内容
//可以使用if...else...或者switch语法来实现
function dayWork(day){
let workContent
if(day === 1){
workContent = '第1天做这个'
}else if(day === 2){
workContent = '第2天做这个'
}else if(day === 3){
workContent = '第3天做这个'
}else if(day === 4){
workContent = '第4天做这个'
}else if(day === 5){
workContent = '第5天做这个'
}else if(day === 6){
workContent = '第6天做这个'
}if(day === 7){
workContent = '第7天做这个'
}
return workContent
}
但如果有100天的工作安排,则需要写100次判断语句,现在试试使用表驱动编程来实现需求
//表驱动法编程的使用与访问方式:直接访问通过索引/key值来直接访问数组/集合
const workDay = {
1:{
workContent : '第1天做这个'
},
2:{
workContent : '第2天做这个'
},
3:{
workContent : '第3天做这个'
},
4:{
workContent : '第4天做这个'
},
5:{
workContent : '第5天做这个'
},
6:{
workContent : '第6天做这个'
},
7:{
workContent : '第7天做这个'
},
}
function getWork(day){
return workDay[day].workContent
}
//对比条件判断冗长的写法,显得更加清晰,我们不需要关心数据的数量,例子中不管是7天或者1000天的工作,只需要写好表数据即可