面向委托的设计

73 阅读2分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第7天,点击查看活动详情

大家好!我是前端爬楼工程师🚹,一个野生程序员。好奇新技术,仰慕牛大佬。如果喜欢我的文章,可以关注➕点赞,为我注入能量,与我一同成长吧~

JavaScript里的对象之间靠的是[[Prototype]]关联起来的,并不是复制属性来达到类似"继承"的效果的。

所以对于JavsScript来说,我们要抛弃类、继承的设计模式转换到委托行为的设计模式。

类理论:

定义一个通用父类,然后在类里定义需要的行为。 接着定义子类,他们都会继承父类并且会添加一些特殊的行为。

// 伪代码
class Task{
    Task(Id){id = Id}
    outputTask(){output(id);}
}

class XYZ inherits Task{
    label;
    XYZ(Id,Label) {
        super(Id)
    }
    outputTask(){
        super()
        output(label)
    }
}

委托理论:

定义一个对象,它会包含一些具体行为,然后定义一些对象来存储对应的数据和行为,把这些对象关联到最初定义的那个对象上。

Task = {
    setID(Id){
        this.id = Id;
    }
    outputId(){
        console.log(this.id)
    }
}
XYZ = Object.create(Task)
XYZ.prepareTask = function(Id, Label){
    this.setId(Id) 
    this.label = Label
}
XYZ.outputTaskDetails = function(){
    this.outputID()
    console.log(this.label)
}
  • 这段代码中,TaskXYZ不是类,它们是对象,XYZ通过Object.create()创建的,它的[[Prototype]]委托了Task对象;
  • 还有就是idlabel直接存储在XYZ上,这就是说,最好把状态保存在委托者(XYZ)上,而不是委托目标(Task);
  • 在类中,父类和子类都有outputTask方法,这样可以利用多态优势。而委托想法,避免使用相同的命名;
  • this.setId(id):首先,寻找自身是否有setId,如果没有,会通过[[Prototype]]委托关联到Task继续寻找,这里同时触发了隐式绑定规则,this绑定到了XYZ上;

委托行为意味着某些对象找不到属性或者方法会把这个请求委托给另外一个对象。

!!不允许互相委托

关于委托就到这里了。