typescript - 类型 'string | boolean' 不可分配给类型 'never' 。类型 'string' 不可分配给类型 'never'

Question

interface modal {
    name: string;
    check: boolean;
}

type Key = "name" | "check";

const obj: modal = fn();

function fn():any {
    return {
        name: "hello"
    }
}

class Modal {
    name: string;
    check: boolean;
    constructor() {
        this.name = "";
        this.check = false;
        Object.keys(obj).forEach((key: string) => {
            this[key as keyof modal] = obj[key as keyof modal];
        })
    }
}

我在这个 [key as keyof modal] 处出错

错误信息:类型'string | bool 值'不可分配给类型'从不'。类型“string”不可分配给类型“never”。

Answer 1

Object.keys总是返回 string[] ，无论如何。当然，预计它会返回Array<keyof typeof obj>。在这种情况下，但事实并非如此。请看this list of issues在 github 上。

在这种情况下，首先应该做的是 type assertion .

(Object.keys(obj) as Array<keyof typeof obj>)

然而，这还没有结束。这里还是报错:

this[key] = obj[key]; // error

一般来说，TS不喜欢突变。请看my article和 this回答。

this[key] 的类型和 obj[key]是string | boolean .

请看这段代码:

type Key = "name" | "check";

let _name: Key = 'name'
let _check: Key = 'check'
obj[_name] = obj[_check] // error

上面的代码几乎与你的相同，除了你的变异在迭代器内部而我的不是。 key 的迭代索引和类型之间没有绑定(bind).

看例子:

(Object.keys(obj) as Array<keyof typeof obj>)
  .forEach((key, index) => {
    if (index === 0) {
      const test = key // keyof modal and not "name"
    }
  })

这是正确的行为，因为即使是 JS 规范也不保证首先 key是name . JS 引擎保留以任何顺序向您退还 key 的权利。当然，在 99.99% 的情况下你会得到预期的订单，但这并不意味着你有保证。

那么，为什么我们有 never在错误消息中？ TypeScript 生成预期键(联合)的交集，因为获取通用类型更安全。 string & boolean的交点- 给你never ，这就是您收到此错误消息的原因。

---

我相信你可以在不使用 type assertions 的情况下做到最好就是打电话reduce :

interface modal {
  name: string;
  check: boolean;
}

type Key = "name" | "check";

const obj: modal = fn();

function fn(): any {
  return {
    name: "hello"
  }
}

class Modal implements modal {
  name: string;
  check: boolean;
  constructor() {
    this.name = "";
    this.check = false;
    const result = (Object.keys(obj) as Array<keyof typeof obj>)
      .reduce((acc, key) => ({
        ...acc,
        [key]: obj[key]
      }), this)
    Object.assign(this, result)
  }
}

Playground值得使用implements modal或大写 modal界面。