如何在 JavaScript/VSCode/TypeScript 中聲明 setter 的類型？

Question

我有一個非常簡單的例子來演示這個問題：

class Person {
    _name = '';
    _age  = 0;
    get name() {
        return this._name;
    }
    /**
     * @type {string}
     */
    set name(name) {
        this._name = name;
    }
    get age() {
        return this._age;
    }
    /**
     * @type {number | string}
     */
    set age(age) {
        if (age === 'too old') {
            age = 100000;
        }
        this._age = age;
    }
}

我使用 VSCode 進行類型檢查，但為什么它會在類型上失敗？

我明確地說年齡設置器可以采用數字或字符串：

Answer 1

您沒有定義類型，而是寫了一個 JSDoc 注釋。 這實際上不會影響您的代碼。 因此 TypeScript 隱式設置類型number 。

如果您希望 setter 同時接受string和number一個解決方案，則可以使用這樣的聯合類型：

set age(age: string | number) {
   ...
}

請記住，稍后設置this._age時會出現問題，因為this._age也隱式具有類型number （默認值0 ），因此不能分配類型為string | number的值。 string | number 。

Answer 2

我相信您需要將聯合類型用括號括起來才能在 JSDoc 中有效：

/**
* @type {(number | string)}
*/

從文檔中：

多種類型（聯合類型） 這可以是數字或 boolean。{(number|boolean)} 這意味着一個值可以具有多種類型之一，整個類型列表用括號括起來並用 | 分隔。

Answer 3

以下代碼段應該可以工作。 只需使用typeof檢查age的類型，即可將類型縮小為if語句。

class Person {
  _name = '';
  _age  = 0;
  get name() {
      return this._name;
  }
  /**
   * @param {string} name
   */
  set name(name) {
      this._name = name;
  }
  get age() {
      return this._age;
  }
  /**
   * @param {number | string} age
   */
  set age(age) {
      if (typeof age === 'string') {
        if (age === 'too old') {
          age = 100000;
        } else {
          age = parseInt(age)
        }
      }
      this._age = age;
  }
}