设计模式 - Mixin模式

混入(Mixin)是一个对象,我们可以使用它来向另一个对象或类添加可重用的功能,而无需使用继承。我们无法独立使用混入,它的唯一目的是向对象或类添加功能,而不使用继承。

比如说,在我们的应用程序中,我们需要创建多个狗。然而,我们创建的狗的基本类型没有任何属性,只有一个名字属性。

class Dog {constructor(name) {this.name = name;}
}

狗不仅仅应该有一个名字,它还应该能够叫、摇尾巴和玩耍!我们不必直接在Dog类中添加这些行为,而是可以创建一个混入(mixin)来为我们提供叫、摇尾巴和玩耍的属性。

const dogFunctionality = {bark: () => console.log("Woof!"),wagTail: () => console.log("Wagging my tail!"),play: () => console.log("Playing!"),
};

我们可以使用 Object.assign 方法将 dogFunctionality mixin 添加到 Dog 原型中。此方法允许我们向目标对象添加属性:在本例中为 Dog.prototype。每个新的 Dog 实例都可以访问 dogFunctionality 的属性,因为它们被添加到Dog 的原型中!

class Dog {constructor(name) {this.name = name;}
}const dogFunctionality = {bark: () => console.log("Woof!"),wagTail: () => console.log("Wagging my tail!"),play: () => console.log("Playing!"),
};Object.assign(Dog.prototype, dogFunctionality);

让我们创建我们的第一只宠物 pet1,名为 Daisy。由于我们刚刚将 dogFunctionality mixin 添加到Dog的原型中,Daisy 应该能够走路、摇尾巴和玩耍!

const pet1 = new Dog("Daisy");pet1.name; // Daisy
pet1.bark(); // Woof!
pet1.play(); // Playing!

Mixins 让我们可以轻松地在不使用继承的情况下向类或对象添加自定义功能。

虽然我们可以在不继承的情况下使用 mixin 添加功能,但 mixin 本身可以使用继承!

大多数哺乳动物(除了海豚,也许还有更多)也可以走路和睡觉。狗是哺乳动物,应该会走路和睡觉!让我们创建一个 animalFunctionality mixin,它添加了 walk 和 sleep 属性。

const animalFunctionality = {walk: () => console.log("Walking!"),sleep: () => console.log("Sleeping!"),
};

我们可以使用 Object.assign 将这些属性添加到 dogFunctionality 原型中。在本例中,目标对象为 dogFunctionality

const animalFunctionality = {walk: () => console.log("Walking!"),sleep: () => console.log("Sleeping!"),
};const dogFunctionality = {bark: () => console.log("Woof!"),wagTail: () => console.log("Wagging my tail!"),play: () => console.log("Playing!"),walk() {super.walk();},sleep() {super.sleep();},
};Object.assign(dogFunctionality, animalFunctionality);
Object.assign(Dog.prototype, dogFunctionality);

现在,Dog 实例都可以访问walksleep方法。

在浏览器环境中的 Window 界面上可以看到现实世界中的 mixin 示例。Window 对象从 WindowOrWorkerGlobalScope 和 WindowEventHandlers 混合中实现其许多属性,这使我们能够访问 setTimeout 和 setIntervalindexedDB 和 isSecureContext 等属性。

由于它是一个 mixin,因此仅用于向对象添加功能,因此您将无法创建 WindowOrWorkerGlobalScope 类型的对象。

window.indexedDB.open("toDoList");window.addEventListener("beforeunload", event => {event.preventDefault();event.returnValue = "";
});window.onbeforeunload = function() {console.log("Unloading!");
};console.log("From WindowEventHandlers mixin: onbeforeunload",window.onbeforeunload
);console.log("From WindowOrWorkerGlobalScope mixin: isSecureContext",window.isSecureContext
);console.log("WindowEventHandlers itself is undefined",window.WindowEventHandlers
);console.log("WindowOrWorkerGlobalScope itself is undefined",window.WindowOrWorkerGlobalScope
);

React(ES6 之前)

在引入 ES6 类之前,Mixin 通常用于为 React 组件添加功能。React 团队不鼓励使用 mixin,因为它很容易给组件增加不必要的复杂性,使其难以维护和重用。React 团队鼓励使用高阶组件,这些组件现在通常可以被 Hooks 取代。

Mixins 允许我们通过将功能注入对象的原型来轻松地向对象添加功能,而无需继承。但修改对象的原型被视为不好的做法,因为它可能导致原型污染和我们功能来源的一定程度的不确定性。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/786224.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

权限认证SpringCloud GateWay、SpringSecurity、OAuth2.0、JWT一网打尽!

权限认证SpringCloud GateWay、SpringSecurity、OAuth2.0、JWT一网打尽 一、SpringCloud GateWay 1.它是如何工作的? ​ 客户端向 Spring Cloud Gateway 发出请求。如果Gateway处理程序映射确定一个请求与路由相匹配,它将被发送到Gateway Web处理程序。…

【Go】七、包、init函数、匿名函数、闭包

文章目录 1、包2、本质3、init函数4、匿名函数5、闭包 1、包 不同的包,不同的功能和业务,互相import 关于包: package 包名注意点: 建议包名和所在文件夹同名 main函数一定要放在main包下,否则编译报错 go run&a…

maven 请出缓存,重新拉取依赖

要让Maven清除本地仓库的缓存并重新下载依赖,你可以使用以下几种方法: 1. 强制更新快照(Snapshot)依赖 对于快照版本的依赖,Maven提供了一个简单的命令行选项来强制更新本地仓库中的快照版本,而不需要清除…

IP归属地在互联网行业中的应用

摘要:IP(Internet Protocol)地址归属地是指互联网上某个IP地址所对应的地理位置信息。在互联网行业中,IP归属地具有重要的应用价值,包括网络安全、广告定向、用户定位等方面。IP数据云将探讨IP归属地在互联网行业中的应…

3d怎么两个模型连接圆润?---模大狮模型网

在3D建模中,如何实现两个3d模型的圆润连接是一个常见而又关键的问题。无论是为了美观的外观设计还是为了模型的功能性,圆润连接都能够增加模型的整体质感和流畅度。模大狮将介绍一些常见的方法和技巧,帮助您实现两个模型之间的圆润连接。 一、…

Linux如何连接github仓库

一.创建一个github账号 如何创建一个github账号 二.在github上创建一个仓库 登录上github后出现这个界面 然后点击左上角头像,在按照图片位置点击: 继续按照图片上的位置进行点击: 创建成功: 三.云主机连接Github仓库 1.在linux中…

Hadoop系列总结

一、Hadoop linux基本操作 前提掌握Linux基本操作 参考 Linux基本操作-CSDN博客 1、查看hadoop指定路径下文件大小前6的文件信息 hdfs dfs[hadoop fs] -du -h /path/to/directory|sort -hr|head -n 6

宝塔 docker 安装 rabbitmq

点击宝塔目录docker 拉取镜像 docker pull rabbitmq:management创建rabbitmq容器 docker run -d --name rabbit -e RABBITMQ_DEFAULT_USERadmin -e RABBITMQ_DEFAULT_PASSadmin -p 15672:15672 -p 5672:5672 -p 25672:25672 -p 61613:61613 -p 1883:1883 rabbitmq:managemen…

支持向量机(Support Vector Machine,SVM)的功能及用法

支持向量机(Support Vector Machine,SVM)是一种监督学习算法,主要用于分类和回归分析。其基本思想是找到一个超平面,将不同类别的样本分开,并使得该超平面到最近的样本点的距离(即支持向量&…

深度学习-计算机视觉入门-part1

计算机视觉入门 文章目录 计算机视觉入门一、 从卷积到卷积神经网络1.图像的基本表示2. 卷积操作3.卷积遇见深度学习3.1 通过学习寻找卷积核3.2 参数共享:卷积带来参数量骤减3.3 稀疏交互:获取更深入的特征 二、手撕卷积代码三、经典CNN模型介绍四、CNN模…

skywalking idea中启动调试报错Output path is shared between the same module error

报错信息 简单描述:就是多个moudle一样用了一样的输出路径,这样容易造成冲突 Output path is shared between the same module error 参考:scala - Output path is shared between the same module error - Stack Overflow 解决方法&…

机器学习(四)

贝叶斯分类器与贝叶斯学习: 贝叶斯分类器:只要是一种生成式模型,并且使用到了贝叶斯公式 贝叶斯学习:一定在使用分布估计 贝叶斯分类器并不等于贝叶斯学习 极大似然估计: 先假设某种概率分布形式,再基于训练样例对参数进行估计 集成学习: 如何得到…

WPF学习笔记-FlowDocument实现表格单元格垂直居中以及边框设置

文章目录 概述一、基本方案1.1 添加Grid1.2 添加列1.3 添加行1.4 添加Grid的时候同时添加行和列1.5 添加元素1.6 获取指定单元格的元素1.7 添加TextBlock元素1.7.1 直接添加字符串1.7.2 添加Paragraph1.8 获取文本内容1.9 获取元素二、其他操作2.1 设置边框2.2 设置隔行颜色2.3…

云计算迎变局:阿里云、腾讯云“各有千秋”

毋庸置疑,无论在什么时候什么行业,低价策略都是一柄利器。比如,在电商行业,除了拼多多将低价策略贯彻到底之外,淘宝、京东也将性价比作为发力重点,并通过补贴、秒杀等方式,再度强调自身的“价格…

打造安全医疗网络:三网整体规划与云数据中心构建策略

医院网络安全问题涉及到医院日常管理多个方面,一旦医院信息管理系统在正常运行过程中受到外部恶意攻击,或者出现意外中断等情况,都会造成海量医疗数据信息的丢失。由于医院信息管理系统中存储了大量患者个人信息和治疗方案信息等,…

wps 开发插件

官方文档参考wps官方文档参考 1.环境安装 安装wps https://www.wps.cn/ 安装Node.js https://nodejs.org/en 安装代码编辑器 Visual Studio Code https://code.visualstudio.com/ 环境检查-进入cmd查看 node -v2.demo 2.1 demo下载 打开vscode,新建终端 安装…

HWOD:字符串逆序

一、知识点 回车键的ASCII码是10 fgets()会读入回车键,也就是说字符串最后一个字符之后是回车键,再之后才是\0 字符串逆序不一定要真正的逆序,只需倒着从最后一个字符打印到第一个字符即可 二、题目 1、描述 将一个字符串str的内容颠倒…

Redis开源协议调整,我们怎么办?

2024年3月20日, Redis官方宣布,从 Redis 7.4版本开始,Redis将获得源可用许可证 ( RSALv2 ) 和服务器端公共许可证 ( SSPLv1 ) 的双重许可,时间点恰逢刚刚完成最新一轮融资,宣布的时机耐人寻味。 Redis协议调整,对云计算…

C#实现Word文档转Markdown格式(Doc、Docx、RTF、XML、WPS等)

文档格式的多样性丰富了我们的信息交流手段,其中Word文档因其强大的功能性而广受欢迎。然而,在网络分享、版本控制、代码阅读及编写等方面,Markdown因其简洁、易于阅读和编辑的特性而展现出独特的优势。将Word文档转换为Markdown格式&#xf…

uniapp 小程序和app map地图上显示多个酷炫动态的标点,头像后端传过来,真机测试有效

展示效果 二、引入地图 如果需要搜索需要去腾讯地图官网上看文档,找到对应的内容 1.申请开发者密钥(key):申请密钥 2.开通webserviceAPI服务:控制台 ->应用管理 -> 我的应用 ->添加key-> 勾选WebService…