Typescript 中是不是提供键值对？

Posted 2023-03-13

【中文标题】Typescript 中是不是提供键值对？

【英文标题】：Is key-value pair available in Typescript?Typescript 中是否提供键值对？

【发布时间】：2016-07-27 19:41:40

【问题描述】：

打字稿中是否提供键值对？如果是的话怎么做。谁能提供示例链接。

【问题讨论】：

是的，你能指定你的要求吗？

typescript 转译（不编译）成 javascript，因此 javascript 的所有功能都可以在 typescript 中使用。例如如果您在 js 中编写代码并将其扩展名更改为 .ts，它将与您的 js 代码一样正常工作。了解更多信息：- typescriptlang.org/docs。

【参考方案1】：

Typescript 中是否提供键值对？

是的。致电an index signature：

interface Foo 
   [key: string]: number;



let foo:Foo = ;
foo['hello'] = 123;
foo = 
  'leet': 1337
;
console.log(foo['leet']); // 1337

这里的键是string，值是number。

更多

您可以将 es6 Map 用于正确的字典，polyfilled by core-js。

【讨论】：

这是地图或字典。如果您想要与 C# KeyValuePair 等效的东西，请参阅答案 ***.com/questions/36467469/…

也很高兴知道，您无需将其称为key。例如，您也可以这样写：[countryCode: string]: string。很好的可读性。

这是更新后的链接：basarat.gitbook.io/typescript/type-system/index-signatures

是的，这是一张地图。但每次我搜索“TypeScript Map”时，我得到的只是 es6 Map，这不是我想要的！所以我非常感谢这个答案在这里。

你救了我

【参考方案2】：

KeyValue 接口存在于使用 typescript 的 Angular 库中。 因此，如果您的项目是有角度的，那么您可以使用这个通用接口。 或者，如果您没有在 Angular 中使用 TS，您可以使用它的声明来获得一个不错的通用 KeyValue 接口。

export declare interface KeyValue<K, V> 
    key: K;
    value: V;

【参考方案3】：

一种简洁的方法是将tuple 用作key-value pair：

const keyVal: [string, string] =  ["key", "value"] // explicit type
const keyVal2 = ["key", "value"] as const // inferred type with const assertion
const [key, val] = ["key", "val"] // usage with array destructuring

您可以创建一个通用的KeyValuePair 类型以实现可重用性：

type KeyValuePair<K extends PropertyKey, V = unknown> = [K, V]
const kv: KeyValuePair<string, string> = ["key", "value"]

TS 4.0

provideslabeled tuple elements 以获得更好的文档和工具支持：

type KeyValuePairNamed = [key: string, value: string] // "key" and "value" labels

兼容性

[key, value] 元组还保证了对 JS 内置对象的兼容性：

Object，尤其是。 Object.entries, Object.fromEntries Map，尤其是。 Map.prototype.entries 和 new Map() 构造函数 Set，尤其是。 Set.prototype.entries

Playground

【讨论】：

如何使用这个 KeyValuePairNamed？

只写const kvp: KeyValuePairNamed = ["mykey", "myval"]。标签是用于文档目的的仅类型构造。

【参考方案4】：

TypeScript 有 Map。你可以像这样使用：

public myMap = new Map<K,V>([
[k1, v1],
[k2, v2]
]);

myMap.get(key); // returns value
myMap.set(key, value); // import a new data
myMap.has(key); // check data

【参考方案5】：

如果您尝试使用以下示例

示例： 值1：“值1”

并根据某些条件动态添加conditionalData，试试

let dataToWrite: any = value1: "value1";

if(conditionalData)
   dataToWrite["conditionalData"] = conditionalData

【参考方案6】：

键值对的一个例子是：

[key: string]: string

当然，你可以把任何东西作为值

【讨论】：

export default interface KeyValuePair [key: string]: string | number | boolean; 稍微好一点，但是这是弱打字吗？这是否在某种程度上违背了目的？

【参考方案7】：

最简单的方法是：

var indexedArray: [key: string]: number

用法：

var indexedArray: [key: string]: number = 
    foo: 2118,
    bar: 2118


indexedArray['foo'] = 2118;
indexedArray.foo= 2118;

let foo = indexedArray['myKey'];
let bar = indexedArray.myKey;

【讨论】：

这很有帮助 - 比接口方法更少的代码，因为它不需要描述 Bar

你有这个用法的例子吗？

indexedArray = ; indexedArray["one"] = 1; /* 好 */ indexedArray["two"] = "two"; / 失败 */

最佳答案。与简单数据类型混淆程度最低

【参考方案8】：

你也可以考虑使用Record，像这样：

const someArray: Record<string, string>[] = [
    'first': 'one',
    'second': 'two'
];

或者这样写：

const someArray: key: string, value: string[] = [
    key: 'first', value: 'one',
    key: 'second', value: 'two'
];

【参考方案9】：

class Pair<T1, T2> 
    private key: T1;
    private value: T2;

    constructor(key: T1, value: T2) 
        this.key = key;
        this.value = value;
    

    getKey() 
        return this.key;
    

    getValue() 
        return this.value;
    

const myPair = new Pair<string, number>('test', 123);
console.log(myPair.getKey(), myPair.getValue());

【讨论】：

如果您尝试输入来自后端的数据，这将无济于事。

@MathijsSegers 这个类并不是一个具体的类型。将此类用作具体类型的派生类型

【参考方案10】：

另一种简单的方法是使用tuple：

// Declare a tuple type
let x: [string, number];
// Initialize it
x = ["hello", 10];
// Access elements
console.log("First: " + x["0"] + " Second: " + x["1"]);

输出：

第一个：你好第二个：10

【参考方案11】：

Typescript 中是否提供键值对？

如果您想到一个 C# KeyValuePair<string, string>：不，但您可以轻松地自己定义一个：

interface KeyValuePair 
    key: string;
    value: string;

用法：

let foo: KeyValuePair =  key: "k", value: "val" ;

【讨论】：

有点好笑，已经 6 票，总和为 0。否决票的人会介意添加评论，这个解决方案有什么不好吗？

我也想知道。反对者从不发表评论，我有时认为是因为他们自己不知道更好的解决方案。

我没有投反对票，但这个解决方案没有添加、获取、删除等功能。

@DaNeSh 没错。 KeyValuePair 不是列表，但它可以是列表的条目。也许您正在寻找List<>？见***.com/questions/23096260/…

KeyValuePair 不是列表。里面只有一个键和一个值。键：foo.key 和值：foo.value。看来您正在寻找List<> --> ***.com/questions/23096260/…

【参考方案12】：

不是针对提问者，而是针对所有其他感兴趣的人： 见：How to define Typescript Map of key value pair. where key is a number and value is an array of objects

因此解决方案是：

let yourVar: Map<YourKeyType, YourValueType>;
// now you can use it:
yourVar = new Map<YourKeyType, YourValueType>();
yourVar[YourKeyType] = <YourValueType> yourValue;

干杯！

【讨论】：

Map 在哪里定义？它是 Angular 特定的吗？

@JackMiller 映射由 ES6 定义：developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

yourVar[YourKeyType] = XXX。这不会在 Map 中设置元素。它确实设置了一个属性。

IE浏览器不支持地图，有什么办法吗？

@RahulUpadhyay 普通对象。