V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
particlec
V2EX  ›  问与答

原项目要升级 ts,请问这里 ts 的数据类型怎么写?

  •  
  •   particlec · 2022-07-20 11:00:06 +08:00 · 1566 次点击
    这是一个创建于 886 天前的主题,其中的信息可能已经有所发展或是发生改变。
    //header: {a: "sss", b: "京津冀"}
    // data: [{a: "迭代", b: "迭代"},{a: "测试", b: "测试"}, {a: "哦哦", b: "偶偶"}]
    // 整合数据和表头
    const json = concatHeaderAndData(header, data);
    //json: [{sss: "迭代", 京津冀: "迭代"}
    // {sss: "迭代", 京津冀: "迭代"}
    // {sss: "哦哦", 京津冀: "偶偶"}]

    const concatHeaderAndData = (header: {}, data: any[]) => {return........}

    (header: {}, data: any[])这里的数据类型该怎么写,header 里对象不固定
    第 1 条附言  ·  2022-07-20 14:15:21 +08:00
    加了下面一段代码后,无论哪个定义的类型都会报错
    const concatHeaderAndData = (header: any, data:any[]) => {
    return data.map((item) => {
    return Object.keys(item).reduce((newData, key) => {
    const newKey = header[key] || key;
    newData[newKey] = item[key];
    return newData;
    }, {});
    });
    };
    10 条回复    2022-07-21 02:04:10 +08:00
    SilentDepth
        1
    SilentDepth  
       2022-07-20 11:56:11 +08:00   ❤️ 1
    function concatHeaderAndData <H, D>(header: H, data: D) { /* ... */ }
    AlphaTr
        2
    AlphaTr  
       2022-07-20 12:59:30 +08:00   ❤️ 2
    concatHeaderAndData<K extends string | number | symbol, T extends string | number | symbol, S extends Record<K, any>>(h: Record<K, T>, d: Array<S>): Array<Record<T, S[keyof S]>> 不知道是不是这个意思
    particlec
        3
    particlec  
    OP
       2022-07-20 13:50:05 +08:00
    @AlphaTr @SilentDepth 谢谢,两个都可以都不会报错
    yazoox
        4
    yazoox  
       2022-07-20 13:50:33 +08:00
    interface Header {
    [key: string]: string | number; // or using 'any' as type directly
    }

    const concatHeaderAndData = (header: Header, data: Array<Header>) => {
    //
    }
    AlphaTr
        5
    AlphaTr  
       2022-07-20 13:59:32 +08:00
    更严谨可能是这样子, 能直接根据传参推断出返回值类型

    type ReverseMap<T extends Record<keyof T, keyof any>> = {
    [P in T[keyof T]]: {
    [K in keyof T]: T[K] extends P ? K : never
    }[keyof T]
    }

    function concatHeaderAndData<K extends string | number | symbol, H extends Record<keyof H, K>, S extends Record<keyof H, keyof any>>(h: H, d: Array<S>): Array<{
    [P in H[keyof H]]: S[ReverseMap<H>[P]]
    }>

    https://www.typescriptlang.org/play?#code/C4TwDgpgBA0hICYBqBDANgV2gXigbwCgooAzAezIC4oAiAIxQCcaioA3C6mgEwpYF8CBUJCgAlCGwiMAzhACyKMAB4AKlAgAPYBAB23GeIgBjMo27KA1vDIkoqgDRRrIW1BS6QAPi9RchYmIAbQAFKABLXXsglzdVAF146gDA1KCYCKjYuwTqVXT4jW09AygwgH5YKGpdSWlWYn4Ymxz4gkECEgxdY2BwsijTHpRgAAkIFG5pAEF9ABERlGUMrR19QxlgRkiAcygAHyhdDABbOmkDqBkQM7I0J1GitdKJU3MrFqhRpxgvJwBlJ4lQyvMwWbJfJwQjzeLwACgAFtRvlBuNRpoxGCgQMp-l4AJTozHY5QpUKZL7NVx2UaJaj-IISKSyBRKZSjLyhRLtXwpRgQYAYRhRbjuQzdSy6MgAdyiKEMGKxOLJYUilIhtKSUAZTOkckUKg5XLa-C87SEQ2MI3Gkxm80WcLwKC4gHALQAZGTQnHQuABhP00fhOIJOrgARnDnqg3qg4dD-Hi+KAA
    particlec
        6
    particlec  
    OP
       2022-07-20 14:17:13 +08:00
    补充了一些业务逻辑,然后发现上面定义的类型全部都会标红
    const concatHeaderAndData = (header: any, data:any[]) => {
    return data.map((item) => {
    return Object.keys(item).reduce((newData, key) => {
    const newKey = header[key] || key;
    newData[newKey] = item[key];
    return newData;
    }, {});
    });
    };
    duan602728596
        7
    duan602728596  
       2022-07-20 16:01:04 +08:00   ❤️ 1
    type Item = Record<string, string>;

    const headers: Item = {
    a: 'sss',
    b: '京津冀'
    };

    const data: Array<Item> = [
    { a: '迭代', b: '迭代' },
    { a: '测试', b: '测试' },
    { a: '哦哦', b: '偶偶' }
    ];

    const concatHeaderAndData = (header: Item, data: Array<Item>): Array<Item> => {
    return data.map((item: Item): Item => {
    return Object.keys(item).reduce((newData: Item, key: string): Item => {
    const newKey = header[key] || key;
    newData[newKey] = item[key];
    return newData;
    }, {});
    });
    };
    Bingchunmoli
        8
    Bingchunmoli  
       2022-07-20 16:25:21 +08:00 via Android
    遇见报错无脑 any ,,
    particlec
        9
    particlec  
    OP
       2022-07-20 16:25:26 +08:00
    @duan602728596 可以了,加逻辑后不报错,niub
    chenzhe
        10
    chenzhe  
       2022-07-21 02:04:10 +08:00 via iPhone
    有个网站可以吧数据结构复制进去然后自动生成类型,忘记网址了。你可以搜一搜 顺便楼内等大佬解答 哈哈哈
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1019 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 18:27 · PVG 02:27 · LAX 10:27 · JFK 13:27
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.