一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第11天,点击查看活动详情

Dear,大家好,我是“前端小鑫同学”,😇长期从事前端开发,安卓开发,热衷技术,在编程路上越走越远~


知识运用:

  1. 条件类型的灵活运用;
  2. 分布式条件类型的灵活运用;

    题目分析:

    题目地址:3057-easy-push
    image.png

    题目解答:

    测试用例:

    ```typescript / _ 测试用例 _ / import { Equal, Expect, ExpectFalse, NotEqual } from ‘@type-challenges/utils’

type cases = [ Expect, [1]>>, Expect, [1, 2, ‘3’]>>, Expect, [‘1’, 2, ‘3’, boolean]>>, ]

  1. <a name="KVrGE"></a>
  2. #### 答案及解析:
  3. 第一次尝试解答:
  4. 1. 我们同样做一下传入类型的约束,通过常用手法泛型类型来做;
  5. 1. 如何将用例中的数组+数组和数组+元素合并?我们可以采用结构后合并到一个数组中;
  6. 1. 那么我们就可以通过条件类型来判断是否为数组来进行不同的解构做拼接得到了下面的答案;
  7. ```typescript
  8. /* _____________ 答案,未能全部通过测试用例 _____________ */
  9. type Push<T extends any[], U> = U extends any[] ? [...T, ...U] : [...T, U];

第二次尝试解答:

  1. 第一次尝试的答案未能通过第三条测试用例;
  2. 我们通过typeA1 = Push<[‘1’, 2, ‘3’], boolean>;发现输出类型编程了联合类型,而非我们需要的Boolean类型,那么我们就想到了分布式条件类型的默认行为;
  3. 如何处理分布式条件默认行为呢?官方文档给出了答案,我们可以使用中括号给extends两侧的类型进行包裹来避免这种默认行为,得到下面可以全部通过的答案;
    1. /* _____________ 答案,可有全部通过测试用例 _____________ */
    2. type Push<T extends any[], U> = [U] extends [any[]] ? [...T, ...U] : [...T, U];

第三次尝试解答:

  1. 在这里我们还可以再次使用条件类型来判断U的类型是否为Boolean来直接返回boolean或返回U得到下面的答案;
    1. /* _____________ 答案,可有全部通过测试用例 _____________ */
    2. type Push<T extends any[], U> = U extends any[] ? [...T, ...U] : [...T, U extends boolean ? boolean : U];
    去演练场验证答案

接下来的一题是:【类型挑战】Unshift,难度⭐️


欢迎关注我的公众号“前端小鑫同学”,原创技术文章第一时间推送。