✍ 공부/TypeScript

[type-challenges] KebabCase

Po_tta_tt0 2023. 7. 3. 18:53
반응형

문제

camelCase나 PascalCase를 kebab-case로 바꿔주세요

FooBarBaz -> foo-bar-baz

설명

/* _____________ Your Code Here _____________ */

type KebabCase<S> = S extends `${infer A}${infer B}` ?
B extends Uncapitalize<B>
? `${Uncapitalize<A>}${KebabCase<B>}`
: `${Uncapitalize<A>}-${KebabCase<B>}`
: S


/* _____________ Test Cases _____________ */
import type { Equal, Expect } from '@type-challenges/utils'

type cases = [
  Expect<Equal<KebabCase<'FooBarBaz'>, 'foo-bar-baz'>>,
  Expect<Equal<KebabCase<'fooBarBaz'>, 'foo-bar-baz'>>,
  Expect<Equal<KebabCase<'foo-bar'>, 'foo-bar'>>,
  Expect<Equal<KebabCase<'foo_bar'>, 'foo_bar'>>,
  Expect<Equal<KebabCase<'Foo-Bar'>, 'foo--bar'>>,
  Expect<Equal<KebabCase<'ABC'>, 'a-b-c'>>,
  Expect<Equal<KebabCase<'-'>, '-'>>,
  Expect<Equal<KebabCase<''>, ''>>,
  Expect<Equal<KebabCase<'😎'>, '😎'>>,
]

Uncapitalize<T>는 T(string)의 첫 문자를 소문자로 바꿔준다.
S를 A(첫 문자) B(나머지 문자)로 쪼개고,
B가 Uncapitalize를 extends하면 == B가 apple일 때 Uncapitalize를 extends한다 // B가 Apple일 때 Uncapitalize를 extends하지 않는다


extends할 시 - 를 붙이고, 아니면 붙이지 않고 연결한다.

하지만 B는 나머지 문자 전체이기 때문에 다시 KebabCase로 남은 문자를 돌아준다

반응형