【TypeScript系列】混入

混入

Table of contents

介绍

混入示例

理解示例

介绍

↥ 回到顶端

除了传统的面向对象继承方式,还流行一种通过可重用组件创建类的方式,就是联合另一个简单类的代码。 你可能在Scala等语言里对mixins及其特性已经很熟悉了,但它在JavaScript中也是很流行的。

混入示例

↥ 回到顶端

下面的代码演示了如何在TypeScript里使用混入。 后面我们还会解释这段代码是怎么工作的。

// Disposable Mixin
class Disposable {isDisposed: boolean;dispose() {this.isDisposed = true;}}// Activatable Mixin
class Activatable {isActive: boolean;activate() {this.isActive = true;}deactivate() {this.isActive = false;}
}class SmartObject {constructor() {setInterval(() => console.log(this.isActive + " : " + this.isDisposed), 500);}interact() {this.activate();}
}interface SmartObject extends Disposable, Activatable {}
applyMixins(SmartObject, [Disposable, Activatable]);let smartObj = new SmartObject();
setTimeout(() => smartObj.interact(), 1000);
// In your runtime library somewhere
function applyMixins(derivedCtor: any, baseCtors: any[]) {baseCtors.forEach(baseCtor => {Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {Object.defineProperty(derivedCtor.prototype, name, Object.getOwnPropertyDescriptor(baseCtor.prototype, name));});});
}

理解示例

↥ 回到顶端

代码里首先定义了两个类,它们将做为mixins。 可以看到每个类都只定义了一个特定的行为或功能。 稍后我们使用它们来创建一个新类,同时具有这两种功能。

// Disposable Mixin
class Disposable {isDisposed: boolean;dispose() {this.isDisposed = true;}}// Activatable Mixin
class Activatable {isActive: boolean;activate() {this.isActive = true;}deactivate() {this.isActive = false;}
}

下面创建一个类,结合了这两个mixins。 下面来看一下具体是怎么操作的:

class SmartObject {...
}interface SmartObject extends Disposable, Activatable {}

首先注意到的是,我们没有在SmartObject类里面继承DisposableActivatable,而是在SmartObject接口里面继承的。由于声明合并的存在,SmartObject接口会被混入到SmartObject类里面。

它将类视为接口,且只会混入Disposable和Activatable背后的类型到SmartObject类型里,不会混入实现。也就是说,我们要在类里面去实现。 这正是我们想要在混入时避免的行为。

最后,我们将混入融入到了类的实现中去。

// Disposable
isDisposed: boolean = false;
dispose: () => void;
// Activatable
isActive: boolean = false;
activate: () => void;
deactivate: () => void;

最后,把mixins混入定义的类,完成全部实现部分。

applyMixins(SmartObject, [Disposable, Activatable]);

最后,创建这个帮助函数,帮我们做混入操作。 它会遍历mixins上的所有属性,并复制到目标上去,把之前的占位属性替换成真正的实现代码。

function applyMixins(derivedCtor: any, baseCtors: any[]) {baseCtors.forEach(baseCtor => {Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {Object.defineProperty(derivedCtor.prototype, name, Object.getOwnPropertyDescriptor(baseCtor.prototype, name));})});
}

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

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

相关文章

Excel新函数TEXTJOIN太强大了,这些高级用法太实用了

今天跟大家分享WPS中新函数TEXTJOIN的使用方法和技巧,它不仅仅是一个强大的文本连接函数,还有一些高级用法可以帮助我们快速解决日常难题。 TEXTJOIN函数介绍 作用:TEXTJOIN函数是文本连接函数,使用分隔符连接列表或文本字符串区…

【C++】手撕AVL树

> 作者简介:დ旧言~,目前大二,现在学习Java,c,c,Python等 > 座右铭:松树千年终是朽,槿花一日自为荣。 > 目标:能直接手撕AVL树。 > 毒鸡汤:放弃自…

数媒大厦会议中心 成都数字产业园示范基地

数媒大厦会议中心,位于成都市金牛区国际数字影像产业园3楼区域,这里也是成都数字产业园示范基地的核心区域。该成都文创产业园及辐射周边配套公园用地约500亩,涵盖产业实训空间、产业实验室、数字资产交易平台、产业集群发展空间、双创孵化空…

工业智能网关的功能特点、应用及其对企业产生的价值-天拓四方

一、工业智能网关的功能特点 工业智能网关是一种具备数据采集、传输、处理能力的智能设备,它能够将工业现场的各种传感器、执行器、控制器等设备连接起来,实现设备间的信息互通与协同工作。同时,工业智能网关还具备强大的数据处理能力&#…

PR是啥?一篇文章学会Pull Request到底是干嘛的

PR?Pull Request 概念 PR,全称Pull Request(拉取请求),是一种非常重要的协作机制,它是 Git 和 GitHub 等代码托管平台中常见的功能。在开源项目中,Pull Request 被广泛用于参与社区贡献,从而促…

html--蝴蝶

<!DOCTYPE html> <html lang"en" > <head> <meta charset"UTF-8"> <title>蝴蝶飞舞</title> <link rel"stylesheet" href"https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.cs…

富格林:安全出金关注可信操作

富格林悉知&#xff0c;现货黄金投资凭借着诸多优势&#xff0c;成为了热门的投资产品之一&#xff0c;也获得了投资者的追捧。在投资中想要安全盈利出金&#xff0c;投资者一定要沉下心来学习专业知识和技术&#xff0c;这样才能在以后的投资操作中避免亏损&#xff0c;顺畅盈…

Android 13.0 kenel和frameworks中修改ram运行内存的功能实现

1.前言 在13.0的系统rom产品开发定制中,在对一些产品开发中的配置需求方面,在产品后续订单中,产品提出要提高硬件配置,但是硬件方面已经定板,项目时间比较仓促,所以 来不及对硬件重新定制,就需要软件方面在ram运行内存的容量大小方面作假,修改ram真实的大小容量,所以…

YOLOV5 改进:增加注意力机制模块(SE)

1、前言 本章将介绍yolov5的改进项目,为v5增加新的模块---注意力机制、SE模块 大部分更改的代码是重复的,只有少部分需要更改,下面会详细讲解 yolov5的yaml文件介绍:YOLOV5 模型:利用tensorboard查看网络结构和yaml文件介绍-CSDN博客 yolov5的模块更改,C3更改为C2f模块…

19 # 高级类型:索引类型

let obj {a: 1,b: 2,c: 3 } // 抽取值形成数组 function getValues(obj: any, keys: string[]) {return keys.map(k > obj[k]) }console.log(getValues(obj, [a, b])); // [1, 2] console.log(getValues(obj, [e, f])); // [undefined, undefined] 属性不存在也不报错可以使…

pgsql中按照逗号拆分成列

原始数据如下&#xff0c;要拆分dict_label字段&#xff1a; selectt_d.dict_sort,t_d.dict_label,t_d.dict_value from sys_dict_data t_d where t_d.dict_type qc_audit_type ORDER BY t_d.dict_sort 关键代码&#xff1a; split_part(t_d.dict_label,,,1) as mValue, sp…

递推算法C++

所谓递推&#xff0c;是指从已知的初始条件出发&#xff0c;依据某种递推关系&#xff0c;逐次推出所要求的各中间结果及最后结果。其中初始条件或是问题本身已经给定&#xff0c;或是通过对问题的分析与化简后确定。从已知条件出发逐步推到问题结果&#xff0c;此种方法叫顺推…

4.GetMapping和PostMapping 和 @RequestMapping的区别。RequestBody 和ResponseBody的区别

1.GetMapping和PostMapping 和 RequestMapping的区别 //GetMapping只能通过get请求。 public class Hello1{GetMapping("hello1")public String h1(){return "1";}//PostMapping只能通过post请求&#xff0c;需要输入参数。 public class Hello2{PostMapp…

C++作业day6

编程1&#xff1a; 封装一个动物的基类&#xff0c;类中有私有成员&#xff1a;姓名&#xff0c;颜色&#xff0c;指针成员年纪 再封装一个狗这样类&#xff0c;共有继承于动物类&#xff0c;自己拓展的私有成员有&#xff1a;指针成员&#xff1a;腿的个数&#xff08;整型 …

从自动化到测开,测试人员逆袭之路从此起步!

在当今竞争激烈的软件测试行业中&#xff0c;近期的招聘市场确实面临一些挑战。大量的求职者争相涌入岗位&#xff0c;许多热衷于功能测试的人士甚至难以找到理想的工作机会。更不幸的是&#xff0c;连自动化测试和性能测试这些专业领域也受到了测试开发人员的竞争压力。然而&a…

stm32-模拟数字转化器ADC

接线图&#xff1a; #include "stm32f10x.h" // Device header//1: 开启RCC时钟&#xff0c;包括ADC和GPIO的时钟//2&#xff1a;配置GPIO将GPIO配置为模拟输入模式//3&#xff1a;配置多路开关将左边的通道接入到规则组中//4&#xff1a;配置ADC转…

北京市密云办理营业性演出许可所需材料及注意事项

尊敬的客户&#xff0c;您好&#xff01;我们是北京经典世纪集团有限公司&#xff0c;专注于资 质代办服务。在这篇文章中&#xff0c;我们将为您介绍一下在北京市密云地区办理营业性演出许可所需的材料及需要注意的事项。&#xff08;游览器搜经典世纪胡云帅&#xff09; 办理…

买堡垒机的企业主要目的是什么?哪家堡垒机好?

近几年企业越来越重视网络安全了&#xff0c;也越来越多的企业购买了堡垒机。但还有一些企业不知道堡垒机是什么&#xff0c;今天我们就来聊聊买堡垒机的企业主要目的是什么以及哪家堡垒机好。 买堡垒机的企业主要目的是什么&#xff1f; 一般买堡垒机的企业目的不外乎是这三个…

学习笔记Day11:初探Linux

Linux系统初探 Linux系统简介 发行版本Ubuntu/centOS&#xff0c;逻辑一样&#xff0c;都可以用。 服务器 本质是一台远程电脑&#xff0c;大多数服务器是Linux系统&#xff0c;通常使用命令行远程访问而不是桌面操作。LInux服务器允许多用户同时访问。NGS组学测序数据上游…

OSPF虚链路vlink

OSPF虚链路——vlink&#xff08;使得其他区域和骨干区域相连&#xff09; 虚链路&#xff1a;一定是跨越非骨干区域连接的 1、虚链路属于区域0的逻辑链路 2、虚链路只能穿越1个非骨干区域 3、虚链路不能穿越特殊区域&#xff1b; vlink在配置的时候&#xff0c;需要指对方…