如何遍歷打字稿中的兩個對象鍵？

Question

我做了一個 Vector 類，但語法有問題。

這是我的代碼：

export class Vector {
  x: number;
  y: number;

  constructor(x = 0, y = 0) {
    this.x = x;
    this.y = y;
  }

  add(v: Vector) {
    var x: number, y: number;

    for (var component in this) {
      component == "x"
        ? (x = this[component] + v[component])
        : (y = this[component] + v[component]);
    }

    return new Vector(x, y);
  }
}

這是我遇到的語法問題：

正如你在“return new Vector(x,y)”行中看到的“x”和“y”說“變量'x'在被分配之前被使用”......對於“v[component]”說“Type ' Extract<keyof this, string>' 不能用於索引類型 'Vector'。”

我不知道我做錯了什么，代碼有效，但我想正確地編寫它。

Answer 1

就個人而言，這就是我要做的方式。

  add(v: Vector): vector {
    const res = new Vector();

    Object.keys(this).forEach(component => {
      res[component] = this[component] + v[component];
    });

    return res;
  }

我在這里拼湊了一個快速沙箱示例

Answer 2

@TJ Crowder 評論了一些合理的建議。 但是，如果您打算在方法中使用循環，則需要縮小編譯器的鍵類型：

TS 游樂場鏈接

您可以手動完成：

add (v: Vector): Vector {
  const vec = new Vector();

  for (const key in vec) {
    type K = 'x' | 'y';
    vec[key as K] = this[key as K] + v[key as K];
  }

  return vec;
}

或者通過對范圍的其余部分使用斷言函數：

function assertType <T = unknown>(value: unknown): asserts value is T {}

add (v: Vector): Vector {
  const vec = new Vector();

  for (const key in vec) {
    assertType<'x' | 'y'>(key);
    vec[key] = this[key] + v[key];
  }

  return vec;
}