Question

I d like to type an array so that the only allowed values in the array are the values of a certain key in a list of objects.

从原则上讲,我知道可以这样做:

const page1 = {
  videoTitles: [ someTitle ,  otherTitle ],
} as const

const page2 = {
  videoTitles: [ title ,  goodTitle ],
} as const

const allVideos = [...page1.videoTitles, ...page2.videoTitles]

// As desired, the if statement raises an error because  badTitle  isn t in either of the lists
if (allVideos.includes( badTitle )) {
  console.log( Found! )
}

然而,我喜欢做的是给物体以某种类型,并引起同样的行为,但我只能说明如何这样做。这里我大致喜欢:

type PageWithVideos = { readonly videoTitles: readonly string[] }
const page1: PageWithVideos = {
  videoTitles: [ someTitle ,  otherTitle ],
} as const

const page2: PageWithVideos = {
  videoTitles: [ title ,  goodTitle ],
} as const

const allTitles = [...page1.videoTitles, ...page2.videoTitles]

// Now, however, I don t get the same error. allTitles is just a string[]
if (allTitles .includes( badTitle )) {
  console.log( Found! )
}

I ve found that I can really force it with something like this:

type PageWithVideos<T extends string> = { readonly videoTitles: readonly T[] }

const page1: PageWithVideos< someTitle  |  otherTitle > = {
  videoTitles: [ someTitle ,  otherTitle ],
} as const

const page2: PageWithVideos< title  |  goodTitle > = {
  videoTitles: [ title ,  goodTitle ],
} as const

const allVideos = [...page1.videoTitles, ...page2.videoTitles] as const

// I m getting the error again (which is good), but this is a little silly
if (allVideos.includes( badTitle )) {
  console.log( Found! )
}

但我更希望不要重复名单上的每一个标题和通用名称。任何想法都会受到赞赏!

Answer 1

This sounds like the use case for the satisfies operator (introduced in TypeScript 4.9):

The new satisfies operator lets us validate that the type of an expression matches some type, without changing the resulting type of that expression.

因此,你可以捕获不符合<代码>形状的物体。页: 1

const page3 = {
    videoTitles: [0], // Error: Type  number  is not assignable to type  string .
    //            ~
} as const satisfies PageWithVideos

const page4 = {
    titles: ["badKey"], // Error: Object literal may only specify known properties, and  titles  does not exist in type  PageWithVideos .
//  ~~~~~~
} as const satisfies PageWithVideos

......由于<条码>作为“条码/代码”的表述,仍然正确推断其类型(特别是其内容的字面类型),并保持你所期望的行为:

const page1 = {
    videoTitles: [ someTitle ,  otherTitle ],
} as const satisfies PageWithVideos

const page2 = {
    videoTitles: [ title ,  goodTitle ],
} as const satisfies PageWithVideos

const allTitles = [...page1.videoTitles, ...page2.videoTitles]

if (allTitles.includes( badTitle )) { // Error: Argument of type  "badTitle"  is not assignable to parameter of type  "someTitle" | "otherTitle" | "title" | "goodTitle" .
    //                 ~~~~~~~~~~
    console.log( Found! )
}

Playground Link

友情链接