JavaScript中Serializable子类调用wake方法报错：解构参数未定义

我研究这个问题好几天了，还是没搞清楚原因：我定义了一个Serializable类，包含两个核心方法——serialize()用于将实例序列化为字符串，wake(serialized)用于恢复实例。

class Serializable {
  constructor() {}

  serialize() {
    return JSON.stringify(this);
  }

  wake(serialized) {
    // 问题应该出在这里，我不知道怎么处理
    const unserialize = JSON.parse(serialized)
    return new this.constructor(unserialize)
  }
}

接着定义了继承自Serializable的User类：

class User extends Serializable {
  constructor({
    firstName,
    lastName,
  }) {
    super();

    this.firstName = firstName;
    this.lastName = lastName;
  }
}

创建User实例并序列化：

let newUser = new User({
  firstName: "Solid",
  lastName: "Snake",
})

const serialized = newUser.serialize()
newUser = null

尝试恢复实例时报错：

const wakeUp = new User.wake(serialized)

Quokka提示：Cannot destructure property 'firstName' of 'undefined' as it is undefined.，控制台报错：Uncaught TypeError: (destructured parameter) is undefined。

1. 调用方式错误：wake是实例方法，不能直接通过User.wake()调用，更不能用new关键字调用这个方法。这种调用方式会导致wake方法内部的this指向异常，最终new this.constructor(unserialize)实际调用的是Function构造函数，无法正确传递参数给User的构造函数。
2. 方法语义不匹配：wake的作用是从序列化字符串恢复实例，这个逻辑不需要依赖已存在的实例，用实例方法实现不符合语义，也会增加调用复杂度。

把wake改成静态方法，这样就能直接通过类调用，同时确保正确创建子类实例：

class Serializable {
  constructor() {}

  serialize() {
    return JSON.stringify(this);
  }

  static wake(serialized) {
    const unserialized = JSON.parse(serialized);
    // this指向调用该静态方法的子类（比如User）
    return new this(unserialized);
  }
}

恢复实例时，直接调用静态方法即可，不需要加new：

const wakeUp = User.wake(serialized);
console.log(wakeUp.firstName); // 输出 "Solid"

内容的提问来源于stack exchange，提问作者Iroquois Pliskin