一款纯 JS 实现的轻量化图片编辑器

在本文中，我们将了解到 tuple 类型的一些特殊操作，以及如何使用 infer 来进行推断，与递归操作结合，最终解决问题。

Tuple to Object

在本题中，我们将实现将一个数组转化为一个对象，这个对象的 key 与 value 必须是相同的，且 key\value 在该数组中

const tuple = ['tesla', 'model 3', 'model X', 'model Y'] as const

type result = TupleToObject<typeof tuple> // expected { tesla: 'tesla', 'model 3': 'model 3', 'model X': 'model X', 'model Y': 'model Y'} 

测试用例

import type { Equal, Expect } from '@type-challenges/utils'

const tuple = ['tesla', 'model 3', 'model X', 'model Y'] as const
const tupleNumber = [1, 2, 3, 4] as const
const tupleMix = [1, '2', 3, '4'] as const

type cases = [Expect<Equal<TupleToObject<typeof tuple>, { tesla: 'tesla'; 'model 3': 'model 3'; 'model X': 'model X'; 'model Y': 'model Y' }>>,Expect<Equal<TupleToObject<typeof tupleNumber>, { 1: 1; 2: 2; 3: 3; 4: 4 }>>,Expect<Equal<TupleToObject<typeof tupleMix>, { 1: 1; '2': '2'; 3: 3; '4': '4' }>>,
]

// @ts-expect-error
type error = TupleToObject<[[1, 2], {}]> 

根据题意与测试用例，我们可以提取出以下几点

1.需要传入一个 tuple 类型，且 tuple 中的类型不能是数组与对象
2.需要对传入的 T 进行遍历
3.返回一个对象，对象的 key/value 必须是相同的

相信通过前两篇文章的阅读，我们已经对这些条件相当熟悉了，所以我们就不在先通过 JS 来实现这个题目，直接使用 TS 来进行编写。