当前位置: 首页 > news >正文

JS设计模式 — 行为委托

回顾一下原型,发现[[Prototype]]机制就是指对象中的一个内部链接引用另一个对象,这个机制的本质就是对象之间的关联关系

1、面相委托的设计

Task = {setID: function(ID) { this.id = ID; },outputID: function() { console.log( this.id ); }
};
// 让 XYZ 委托 Task
XYZ = Object.create( Task );
XYZ.prepareTask = function(ID,Label) {this.setID( ID );this.label = Label;
};
XYZ.outputTaskDetails = function() {this.outputID();console.log( this.label );
};
// ABC = Object.create( Task );
// ABC ... = ...

我们把这种编码风格称为“对象关联”,在JS中[[Prototype]]机制会把对象关联到其他对象,对象关联的代码会有一些不同之处:

  1. 在上面的代码中,id 和 label 数据成员都是直接存储在 XYZ 上(而不是 Task)。通常来说,在 [[Prototype]] 委托中最好把状态保存在委托者(XYZ、ABC)而不是委托目标(Task)上。

  2. 在类设计模式中,我们故意让父类(Task)和子类(XYZ)中都有 outputTask 方法,这
    样就可以利用重写(多态)的优势。在委托行为中则恰好相反:我们会尽量避免在[[Prototype]] 链的不同级别中使用相同的命名,否则就需要使用笨拙并且脆弱的语法来消除引用歧义(参见第 4 章)。
    这个设计模式要求尽量少使用容易被重写的通用方法名,提倡使用更有描述性的方法名,尤其是要写清相应对象行为的类型。这样做实际上可以创建出更容易理解和维护的代码,因为方法名(不仅在定义的位置,而是贯穿整个代码)更加清晰(自文档)。

  3. this.setID(ID);XYZ 中的方法首先会寻找 XYZ 自身是否有 setID(…),但是 XYZ 中并没有这个方法名,因此会通过 [[Prototype]] 委托关联到 Task 继续寻找,这时就可以找到setID(…) 方法。此外,由于调用位置触发了 this 的隐式绑定规则(参见第 2 章),因此虽然 setID(…) 方法在 Task 中,运行时 this 仍然会绑定到 XYZ,这正是我们想要的。在之后的代码中我们还会看到 this.outputID(),原理相同。

    换句话说,我们和 XYZ 进行交互时可以使用 Task 中的通用方法,因为 XYZ 委托了 Task。

委托行为意味着某些对象(XYZ)在找不到属性或者方法引用时会把这个请求委托给另一个对象(Task)。这是一种极其强大的设计模式,和父类、子类、继承、多态等概念完全不同

2、总结

在软件架构中你可以选择是否使用类和继承设计模式。大多数开发者理所当然地认为类是唯一(合适)的代码组织方式,但是本章中我们看到了另一种更少见但是更强大的设计模式:行为委托。

行为委托认为对象之间是兄弟关系,互相委托,而不是父类和子类的关系。JavaScript 的[[Prototype]] 机制本质上就是行为委托机制。也就是说,我们可以选择在 JavaScript 中努力实现类机制,也可以拥抱更自然的 [[Prototype]] 委托机制。

当你只用对象来设计代码时,不仅可以让语法更加简洁,而且可以让代码结构更加清晰。

对象关联(对象之前互相关联)是一种编码风格,它倡导的是直接创建和关联对象,不把它们抽象成类。对象关联可以用基于 [[Prototype]] 的行为委托非常自然地实现。

http://www.lryc.cn/news/249736.html

相关文章:

  • Microsoft Expression Web - 网页布局
  • Java SpringBoot Controller常见写法
  • 【驱动】SPI驱动分析(五)-模拟SPI驱动
  • 人工智能_机器学习056_拉格朗日乘子法原理推导_公式由来详解_原理详解---人工智能工作笔记0096
  • 记RocketMQ本地开发环境搭建始末
  • 2023年全国职业院校技能大赛“ 信息安全管理与评估” 测试题2
  • flutter开发实战-readmore长文本展开和收缩控件
  • 如何使用简单的分支策略来保护您的 Git 项目
  • vue3的 nextTick()的使用
  • Redis Lua沙盒绕过 命令执行(CVE-2022-0543)漏洞复现
  • react中useState、useRef、变量之间的区别
  • 企业软件的分类|app小程序网站定制开发
  • Flink(八)【窗口】
  • 云轴科技ZStack信创云平台助力国泰君安期货实现信创改造
  • C语言猜数字小游戏
  • 自定义BeanPostProcessor之XssBeanPostProcessor
  • 如何使用Windows自带的IIS服务搭建本地站点并远程访问
  • 【微软技术栈】基于任务的异步编程
  • react hooks 学习之react router v6 路由表配置
  • Echarts 设置数据条颜色 宽度
  • 2023-11-30 通过中缀表达式转换后缀表达式, 用C语言完成一个简单的计算器
  • 设计模式总目录
  • 通俗理解词向量模型,预训练模型,Transfomer,Bert和GPT的发展脉络和如何实践
  • 键入网址到网页显示,期间发生了什么?(计算机网络)
  • python-GC机制、装饰器、生成器、迭代器、三元表达式、列表生成式、生成器表达式、函数递归、面向对象、
  • Linux命令--根据端口号查看进程号(PID)
  • LangChain 9 模型Model I/O 聊天提示词ChatPromptTemplate, 少量样本提示词FewShotPrompt
  • 使用 Vue3 + Pinia + Ant Design Vue3 搭建后台管理系统
  • SpringCloud核心组件
  • 基于C++11实现将IP地址、端口号和连接状态写入文件