wj-design-art
TypeScript icon, indicating that this package has built-in type declarations

1.2.5 • Public • Published

描述

让javascript使用设计模式更简单

安装

npm i wj-design-art -S

使用

责任链模式的API

  • ResChain类
说明 入参
ResChain constructor(handleFn: HandleFn, transaction?: any, next?: ResChain) HandleFn:处理事务的函数,transaction:事务, next:下一个处理对象
  • 实例方法或属性
名称 说明 入参 出参
setNext 设置下一个处理对象,setNext(next: ResChain) next: 下一个处理对象 void
handle 开始处理事务,handle(transaction?: any) transaction:要处理的事务 void

责任链模式的使用

import designArt from 'wj-design-art';
 
// 要处理的事务
const count = 1100;
 
// 部门处理事务的函数
function deptHandleFn(transaction: any) {
    return new Promise((resolve) => {
        setTimeout(function() {
            if(transaction >= 500) {
                console.log(transaction + '部门不能解决,给单位')
                resolve({
                    isNext: true
                });
            } else {
                resolve({
                    isNext: false
                });
            }
        }, 1000);
    });
}
 
// 单位处理事务的函数
function companyHandleFn(transaction: any) {
    return new Promise((resolve) => {
        setTimeout(function() {
            if(transaction >= 1000) {
                console.log(transaction + '单位不能解决,给集团');
                resolve({
                    isNext: true
                });
            } else {
                resolve({
                    isNext: false
                });
            }
        }, 1000);
    });
}
 
// 集团处理事务的函数
function groupHandleFn(transaction: any) {
    return new Promise((resolve) => {
        setTimeout(function() {
            console.log(transaction + '集团解决了')
            resolve({
                isNext: false
            });
        }, 1000);
    });
}
 
const dept = new designArt.ResChain(deptHandleFn, count);
const company = new designArt.ResChain(companyHandleFn, count);
const group = new designArt.ResChain(groupHandleFn, count);
 
dept.setNext(company);
company.setNext(group);
 
// 或者不用setNext函数,直接给定下一处理对象
// const group = new designArt.ResChain(groupHandleFn, count);
// const company = new designArt.ResChain(companyHandleFn, count, group);
// const dept = new designArt.ResChain(deptHandleFn, count, company);
 
dept.handle();
 
// 输出结果为
// 1100部门不能解决,给单位
// 1100单位不能解决,给集团
// 1100集团解决了

单例模式API

名称 说明 入参 出参
singles 一个属性,所有的单例 none none
add 增加单例,add(_class: any, classname: string = _class.name, ...args: any[]) _class:类,classname:类名,...args:实例化类时的参数 void
del 删除单例,del(key: string) key:要删除的键 void
clear 清空,clear() none void

单例模式的使用

import designArt from 'wj-design-art';
const { singleCase } = designArt;
 
class A {
    getName() {
        return 'wj';
    }
}
class B {
    getName() {
        return 'jack';
    }
}
class C {
    public myname: string;
    constructor(name: string) {
        this.myname = name;
    }
    getName() {
        return this.myname;
    }
}
singleCase.add(A); // {A: instance}
singleCase.add(B, 'singleB'); // {A: instance, singleB: instance}
singleCase.add(C, 'singleC', 'cname'); // {A: instance, singleB: instance, singleC: instance}
const singles = singleCase.singles; // {A: instance, singleB: instance, singleC: instance}
console.log(singles.A.getName()); // wj
console.log(singles.singleB.getName()); // jack
console.log(singles.singleC.getName()); // cname
singleCase.del('A'); // {singleB: instance, singleC: instance}
singleCase.del('singleB'); // {singleC: instance}
singleCase.clear(); // {}

命令模式

命令模式API

  • Command 类
说明 入参
Command 命令模式类 none
  • 实例方法
名称 说明 入参 出参
add 添加命令, add(command: CommandItem) command:函数或者是实现了ICommand接口的实例 Command
remove 删除命令,remove(command: CommandItem) command:函数或者是实现了ICommand接口的实例 Command
undo 撤销命令,删除最后一次添加的命令,undo() none Command
reset 重置命令,清空所有命令,reset() none Command
execute 执行所有的命令,execute() none void

命令模式的使用

import designArt from 'wj-design-art';
import { ICommand } from 'wj-design-art/lib/types/Command/types';
 
const { Command } = designArt;
 
const command = new Command();
 
class One implements ICommand {
    execute() {
        console.log('one');
    }
}
 
const one = new One();
 
function two() {
    console.log('command two');
}
 
command.add(one).add(two);
 
command.add(function() {
    console.log('command three');
});
 
// one,command two,command three
 
command.remove(one); // command two,command three
 
command.undo(); // command two
 
command.execute(); // command two
 

仓库地址

https://github.com/WJjack/wj-design-art.git

Package Sidebar

Install

npm i wj-design-art

Weekly Downloads

3

Version

1.2.5

License

ISC

Unpacked Size

15.7 kB

Total Files

19

Last publish

Collaborators

  • wjjack