ts Object.keys foreach

最近写ts的时候遇到了

ts Object.keys foreach 爆红

Obejct.Keys(A).foreach(v =>{
A[v]})

类型错误爆红

说实话这真不应该报错 理论上他们不是对同一个对象的操作吗

但是就是有问题

正好看到了人家的实现 我认为挺好的 .

所以在这里实现一下

const allGlobalComponent = {
  SvgIcon,
};
export default {
  install(app: any) {
    Object.keys(allGlobalComponent).forEach((key: string) => {
      app.component(
        key,
        allGlobalComponent[key],
      );
      console.log(key);
    });
  },
};

allGlobalComponent[key], 这里会爆红

两种解决方法

1 自定义keyOf方法 判断是不是对象的键

2 把key用as强转为keyof allGlobalComponent (这里注意不能直接转 他会提示你错误的)

第一

    function isKey<T extends object>(key: PropertyKey, O: T): key is keyof T {
      return key in O;
    }
    //PropertyKey 是 string symbol number 三个组成的union 因为对象的键有这三种可能 
    export default {
      install(app: any) {
        Object.keys(allGlobalComponent).forEach((key: string) => {
          if (isKey(key, allGlobalComponent)) {
            app.component(key, allGlobalComponent[key]);
          }

          console.log(key);
        });
      },
    };

第二

key 强转要注意 allGlobalComponent 是值不是类型要先用 typeof转为类型

export default {
install(app: any) {
Object.keys(allGlobalComponent).forEach((key: string) => {
app.component(
key,
allGlobalComponent\[key as keyof typeof allGlobalComponent],
);

      console.log(key);
    });

},
};
```

参考链接 TypeScript: Iterating over objects (fettblog.eu)

TypeScript: Improving Object.keys (fettblog.eu)

最后本人水平有限 文章难免出现错误 敬请指出 希望我们一同成长