Map.prototype.set() 返回 undefined,故原生不支持链式调用;需继承 Map 并重写 set 等方法使其返回 this,再扩展状态机语义如 transition、exec,结合 WeakMap 可实现实例级隔离的状态映射。

Map.prototype.set() 本身不返回 Map 实例,而是返回 undefined,因此**原生不支持链式调用**。但通过简单封装,可以实现兼具状态机语义与链式可读性的业务逻辑映射结构。
为什么直接 set() 无法链式?
标准行为如下:
const map = new Map();
console.log(map.set('a', 1)); // undefined
console.log(map.set('b', 2)); // undefined
每次调用返回 undefined,后续无法继续调用方法。要链式,需让每次操作返回自身(即 Map 实例)。
封装一个支持链式的 StateMap 类
继承原生 Map,重写 set() 和关键方法,使其返回 this:
- 保留所有原生 Map 功能(如
get、has、entries) -
set(key, value)返回this,支持连续调用 - 可扩展
on(key, handler)、transition(from, to, action)等状态机语义方法
class StateMap extends Map {
set(key, value) {
super.set(key, value);
return this;
}
// 示例:添加状态转移注册能力
transition(from, to, action) {
const key = `${from}→${to}`;
return this.set(key, action);
}
// 示例:触发状态迁移
exec(from, to, ...args) {
const handler = this.get(`${from}→${to}`);
return handler && handler(...args);
}
}
用链式方式构建状态驱动的业务映射
例如订单状态机:待支付 → 已支付 → 已发货 → 已完成,每步附带校验与副作用:
const orderFlow = new StateMap()
.set('status', 'pending')
.transition('pending', 'paid', (order) => {
if (order.amount <= 0) throw new Error('金额非法');
order.status = 'paid';
sendNotification(order, 'payment_confirmed');
})
.transition('paid', 'shipped', (order) => {
if (!order.warehouseReady) throw new Error('库存未就绪');
order.status = 'shipped';
updateLogistics(order);
})
.transition('shipped', 'completed', (order) => {
order.status = 'completed';
issueInvoice(order);
});
后续只需:orderFlow.exec('pending', 'paid', order),逻辑集中、映射清晰、可测试性强。
进阶:结合 WeakMap 实现实例级状态隔离
避免全局状态污染,为每个业务对象(如订单实例)绑定独立状态机:
- 用
WeakMap存储对象 → StateMap 映射 - 每个订单拥有专属状态流转规则,互不干扰
- 对象销毁时,WeakMap 自动回收,无内存泄漏风险
const instanceStates = new WeakMap();
function getStateMap(obj) {
if (!instanceStates.has(obj)) {
instanceStates.set(obj, new StateMap());
}
return instanceStates.get(obj);
}
// 使用
const orderA = { id: 'A' };
getStateMap(orderA)
.transition('pending', 'paid', () => console.log('A paid'))
.set('current', 'pending');

















