ES6 JavaScript 高阶对象、高阶类 详解

前言

• JS 是基于对象的，类 和 对象 都是 对象模版
• 混合 Mixin，指的是将一个对象的全部或者部分拷贝到另一个对象上去，其实就是属性
• 可以将多个类或对象混合成一个类或对象

1、高阶对象实现

1.1 普通的继承

class A extends Object {
   };
console.log(A);

Info: Start process (下午2:36:00)
[Function: A]
Info: End process (下午2:36:00)

1.2 匿名类

const A1 = class {
   
    constructor(x) {
   
        this.x = x;
    }
}

console.log(A1)
console.log(new A1(100).x)

Info: Start process (下午2:42:10)
[Function: A1]
100
Info: End process (下午2:42:10)

1.3 匿名继承

const B = class extends Object {
   
    constructor() {
   
        super();
        console.log('B constructor');
    };
};

console.log(B)
let b = new B();
console.log(b);

Info: Start process (下午2:44:20)
[Function: B]
B constructor
B {
   }
Info: End process (下午2:44:20)

1.4 用箭头函数改进匿名继承

const B = (SuperCls) => {
   
    return class extends SuperCls {
   
        constructor() {
   
            super();
            console.log('B constructor');
        };
    };
};

cls = B(Object);
console.log(cls)  
console.log('='.repeat(55))
console.log(new cls())

Info: Start process (下午2:53:15)
[Function: Object]
=======================================================
B constructor
{
   }
Info: End process (下午2:53:15)

说明：
1、箭头函数，参数是类，返回值也是类， Object 就是函数
2、cls = new B(Object); 
这个是不可以 new 的，因为 B 是一个普通函数，他的返回值是一个带 constructor 的类
3、cls = B(Object);
调用它返回一个类，一个带 constructor 的类
4、组合写法 cls = new (B(Object))