• TypeScript遍历对象属性问题


    一、问题 

     比如下面的代码:

    type Animal = {
        name: string;
        age: number
    }
    
    const animal:Animal={
        name:"dog",
        age:12
    }
    
    function test(obj:Animal) {
        for (let k in obj) {
            console.log(obj[k])。//这里出错
        }
    }
    test(animal)

      报错:

    二、解决办法 

    1. 把对象声明as any

    function test(obj:Animal) {
        for (let k in obj) {
            console.log((obj as any)[k]) //不报错
        }
    }

      这个方法直接绕过了typescript的校验机制

    2. 给对象声明一个接口

    type Animal = {
        name: string;
        age: number;
        [key: string]: any
    }
    
    const animal:Animal={
        name:"dog",
        age:12
    }
    
    function test(obj:Animal) {
        for (let k in obj) {
            console.log(obj [k]) //不报错
        }
    }
    test(animal)

      这个可以针对比较常见的对象类型,特别是一些工具方法。

    3. 使用泛型 

    function test<T extends object>(obj:T) {
        for (let k in obj) {
            console.log(obj [k]) //不报错
        }
    }

    4. 使用keyof

    function test(obj:Animal) {
        let k: (keyof Animal);
        for (k in obj) {
            console.log(obj [k]) //不报错
        }
    }
  • 相关阅读:
    c数据结构 -- 线性表之 顺序存储结构 于 链式存储结构 (单链表)
    c数据结构 绪论
    c数据结构 -- 使用链表实现计数
    c数据结构 -- 链表的理解
    vue mvvm原理与简单实现 -- 上篇
    vue图书小案例
    排序
    裁剪图片
    下载图片
    图片缩放
  • 原文地址:https://www.cnblogs.com/gg-qq/p/15508536.html
Copyright © 2020-2023  润新知