目前是不是有将两个或多个字符串文字类型连接到 TypeScript 中的单个字符串文字类型？

Posted 2023-03-10

【中文标题】目前是不是有将两个或多个字符串文字类型连接到 TypeScript 中的单个字符串文字类型？

【英文标题】：Is there currently anyway to concatenate two or more string literal types to a single string literal type in TypeScript right now?目前是否有将两个或多个字符串文字类型连接到 TypeScript 中的单个字符串文字类型？

【发布时间】：2020-03-15 11:11:49

【问题描述】：

首先，让我明确一点，我正在寻找的不是联合类型，而是直接串联，即"Hel" + "lo" = "Hello"，但对于字符串文字类型

基本上我有一个函数，它接受两个字符串文字，一个namespace 和一个name，并将它们与 / 结合起来作为它的输出，但我想不出一种方法来使输出字符串文字，而不是通用字符串。

我需要它是字符串文字，因为输出将用作对象的键。

我尝试过输入交叉点(&)、+、.concat()

function makeKey<NS extends string, N extends string>(namespace: NS, name: N) 
    return namespace + '/' + name; // <- want this to be `NS + / + N` = `NS/N`

// I want this to return a string literal rather than a generic string

const objKey = makeKey('admin', 'home')
// I want typeof objKey to be a string literal: `"admin/home"`, not a generic `string`

typeof objKey 是通用的 string 但我希望它是 string literal "admin/home"

【问题讨论】：

字符串文字是打字稿中的单独类型吗？

是string类型的子集，和string Enums差不多

不，目前没有办法

不幸的是，答案是no。有几个建议可能会为您提供此功能（this 或 this），但我不认为这些建议正在考虑之中。

@GetOffMyLawn 模板文字是单独的东西，字符串文字是打字稿类型

【参考方案1】：

TS4.1+ 答案：

您现在可以使用template literal types 来执行此操作：

function makeKey<NS extends string, N extends string>(namespace: NS, name: N) 
    return namespace + '/' + name as `$NS/$N`


const objKey = makeKey('admin', 'home');
// const objKey: "admin/home"

Playground link

---

TS4.1 之前的答案：

不幸的是，答案是no。 GitHub 中有几个功能建议，如果实施，可能会为您提供这样的功能（microsoft/TypeScript#12754 在映射类型期间增加键，或microsoft/TypeScript#6579 通过正则表达式操作字符串类型）但我不认为它们正在积极工作。无论如何，我在roadmap 中没有看到任何关于它的内容。如果你真的想看到这种情况发生，你可能想去其中一个 GitHub 问题并给他们一个 ? 或描述你的用例，如果它特别引人注目。但我不会屏住呼吸。对不起！

【讨论】：

谢谢@jcalz！我继续并在我的用例中对其中一个线程发表了评论。

我不知道这是一回事。非常酷，谢谢。

【参考方案2】：

一旦 模板字符串类型 被释放（看起来像 typescript 4.1），这将成为可能：

function makeKey<NS extends string, N extends string>(namespace: NS, name: N) 
    return (namespace + '/' + name) as `$NS/$N`;


const objKey = makeKey('admin', 'home') // objKey is of type 'admin/home'

Playground

---

模板字符串类型是模板字符串表达式的类型空间等价物。与模板字符串表达式类似，模板字符串类型包含在反引号分隔符中，并且可以包含$T 形式的占位符，其中T 是可分配给string、number、boolean 或@ 的类型987654329@。模板字符串类型提供连接文字字符串、将非字符串原始类型的文字转换为其字符串表示形式以及更改字符串文字的大小写或大小写的能力。此外，通过类型推断，模板字符串类型提供了一种简单的字符串模式匹配和分解形式。

一些例子：

type EventName<T extends string> = `$TChanged`;
type Concat<S1 extends string, S2 extends string> = `$S1$S2`;
type T0 = EventName<'foo'>;  // 'fooChanged'
type T1 = EventName<'foo' | 'bar' | 'baz'>;  // 'fooChanged' | 'barChanged' | 'bazChanged'
type T2 = Concat<'Hello', 'World'>;  // 'HelloWorld'
type T3 = `$'top' | 'bottom'-$'left' | 'right'`;  // 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'

更多细节和例子here

【参考方案3】：

它适用于我，使用 typescript 3.7.2，使用模板文字连接和 as 关键字来指定我的函数的输出类型。

const addSuffixToMyStringLiteral =
    (m: MyStringLiteral, suffix: string) => `$m$suffix` as MyStringLiteral;

不知道是不是打字稿的新功能。

【讨论】：

响应类型为 MyStringLiteral。 OP 预期，例如 literalexamplesuffix.