Typescript类功能混合(mixin)使用,将多个类中功能合并到一个对象

最新推荐文章于 2025-10-13 10:52:55 发布

原创最新推荐文章于 2025-10-13 10:52:55 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#typescript #javascript #开发语言

ES6 同时被 2 个专栏收录

33 篇文章

订阅专栏

Nodejs

15 篇文章

订阅专栏

本文介绍了一个名为MixinFunc的函数，通过克隆构造函数和原型对象实现了混合多个类的功能，如a1、a2和a3。实例展示了如何创建mixCls并调用其继承的类方法。

//混合多个类为一个类
function MixinFunc(...mixins){
    class MixClass{}

    for (let m of mixins) {
        cloneProto(MixClass,m);//克隆构造函数
        cloneProto(MixClass.prototype,m.prototype);//克隆原型对象
    }
    return MixClass;
}
//克隆对象
function cloneProto(t,s){
    for (let k of Reflect.ownKeys(s)) {
        //不克隆构造函数key,原型对象key及对象名key
        if (k !== 'constructor' && k !== 'prototype' && k !== 'name'){
            let d = Object.getOwnPropertyDescriptor(s,k);//取源对象属性描述
            Object.defineProperty(t,k,d);//克隆源对象键值对目标对象
        }
    }
}

class a1{
    constructor() {
    }
    test1(){console.log('a1类的test1方法');}
}
class a2{
    constructor() {
    }
    test2(){console.log('a2类的test2方法');}
}
class a3{
    constructor() {
    }
    test3(){console.log('a3类的test3方法');}
}

let mixCls =MixinFunc(a1,a2,a3);//混合a1,a2,a3这三个类的功能到mixCls这个对象
console.log(Object.getOwnPropertyNames(mixCls.prototype));//[ 'constructor', 'test1', 'test2', 'test3' ]
//调用,因为类的方法都定义在原型对象上,所以Reflect.get要传入混合对象的原型对象
Reflect.get(mixCls.prototype,'test1')();//test1()
Reflect.get(mixCls.prototype,'test2')();//test2()
Reflect.get(mixCls.prototype,'test3')();//test3()