结合ES6 编写 JavaScript 设计模式中的结构型模式

class Calculator1 {
    constructor() {
        this.operations = function (value1, value2, operation) {
            const operationHandler = {
                add: () => value1 + value2,
                sub: () => value1 - value2,
            };
            return (
                typeof (operationHandler[operation] === "function") &&
                operationHandler[operation]()
            );
        };
    }
}
class Calculator2 {
    constructor() {
        this.add = function (value1, value2) {
            return value1 + value2;
        };
        this.sub = function (value1, value2) {
            return value1 - value2;
        };
    }
}
// 使用适配器模式构建类
class CalcAdapter {
    constructor() {
        const cal2 = new Calculator2();
        this.operations = function (value1, value2, operation) {
            return (
                typeof (cal2[operation] === "function") &&
                cal2[operation](value1, value2)
            );
        };
    }
}
const adaptedCalc = new CalcAdapter();
console.log(adaptedCalc.operations(30, 25, "sub")); // 5

class VectorRenderer {
    renderCircle(radius) {
        console.log(`渲染一个半径为 ${radius} 的圆`);
    }
}
class RasterRenderer {
    renderCircle(radius) {
        console.log(`绘制一个半径为 ${radius} 的像素圆`);
    }
}
class Shape {
    constructor(renderer) {
        this.renderer = renderer;
    }
}
class Circle extends Shape {
    constructor(renderer, radius) {
        super(renderer);
        this.radius = radius;
    }

    draw() {
        this.renderer.renderCircle(this.radius);
    }
    resize(factor) {
        this.radius *= factor;
    }
}
const raster = new RasterRenderer();
const vector = new VectorRenderer();
const circle = new Circle(vector, 5);
const rasterCircle = new Circle(raster, 5);
circle.draw();
circle.resize(2);
circle.draw();
rasterCircle.draw();
rasterCircle.resize(2);
rasterCircle.draw();

class Employer {
    constructor(name, role) {
        this.name = name;
        this.role = role;
    }
    print() {
        const { name } = this;
        console.log(`姓名：${name}`);
    }
}
class EmplyerGroup {
    constructor(name, composite = []) {
        console.log(name);
        this.name = name;
        this.composite = composite;
    }
    print() {
        console.log(this.name);
        this.composite.forEach((emp) => {
            emp.print();
        });
    }
}
const ravi = new Employer("ravi", "developer");
const bhavy = new Employer("bhavy", "developer");
const groupDevelopers = new EmplyerGroup("Developer", [ravi, bhavy]);
groupDevelopers.print();

class Shape {
    constructor(color = "") {
        this.color = color;
    }
}
class Circle extends Shape {
    constructor(radius = 0) {
        super();
        this.radius = radius;
    }
    resize(factor) {
        this.radius *= factor;
    }
    toString() {
        return `一个直径为 ${this.radius} 的园`;
    }
}
class ColoredShape extends Shape {
    constructor(shape, color) {
        super();
        this.shape = shape;
        this.color = color;
    }
    toString() {
        return `${this.shape.toString()}，颜色为${this.color}`;
    }
}
const circle = new Circle(2);
console.log(circle); // Circle { color: '', radius: 2 }
const redCircle = new ColoredShape(circle, "红色");
console.log(redCircle.toString()); // 一个直径为 2 的园，颜色为红色

class CPU {
    freeze() {
        console.log("冻结…");
    }

    jump() {
        console.log("跳过…");
    }

    execute() {
        console.log("执行…");
    }
}
class Memory {
    load(position, data) {
        console.log("加载中…");
    }
}
class HardDrive {
    read(lba, size) {
        console.log("读取中…");
    }
}
class ComputerFacade {
    constructor() {
        this.processor = new CPU();
        this.ram = new Memory();
        this.hd = new HardDrive();
    }
    start() {
        this.processor.freeze();
        this.ram.load("", this.hd.read("lba", "size"));
        this.processor.jump("");
        this.processor.execute();
    }
}
const computer = new ComputerFacade();
computer.start();

class User {
    constructor(fullname) {
        this.fullname = fullname;
    }
}
class User2 {
    constructor(fullname) {
        const getOrAdd = (s) => {
            const idx = User2.strings.indexOf(s);
            if (idx !== -1) {
                return idx;
            } else {
                User2.strings.push(s);
                return User2.strings.length - 1;
            }
        };
        this.names = fullname.split(" ").map(getOrAdd);
    }
}
User2.strings = [];
const getRadmon = (max) => Math.floor(Math.random() * Math.floor(max));
const randomString = () => {
    const result = [];
    for (let x = 0; x < 10; ++x) {
        result.push(String.fromCharCode(65 + getRadmon(26)));
    }
    return result.join("");
};

const users = [];
const users2 = [];
const firstnames = [];
const lastnames = [];
for (let i = 0; i < 100; ++i) {
    firstnames.push(randomString());
    lastnames.push(randomString());
}
for (const first of firstnames) {
    for (const last of lastnames) {
        users.push(new User(`${first} ${last}`));
        users2.push(new User2(`${first} ${last}`));
    }
}
console.log(`10k用户占用了大约 ${JSON.stringify(users).length} 字符`); // 10k用户占用了大约 370001 字符
const user2length = [users2, User2.strings]
    .map((x) => jsON.stringify(x).length)
    .reduce((x, y) => x + y);
console.log(`10k用户在享元模式占用约 ${user2length} 字符`); // 10k用户在享元模式占用约 191602 字符

class Percentage {
    constructor(percent) {
        this.percent = percent;
    }
    toString() {
        return `${this.percent}%`;
    }
    valueOf() {
        return this.percent / 100;
    }
}
const fivePercent = new Percentage(5);
console.log(fivePercent.toString()); // 5%
console.log(`5% 的50倍是${50 * fivePercent}`); // 5% 的50倍是2.5