Join

In this medium-level challenge, you'll implement the type-level version of Array.join, creating a Join<T, U> type that concatenates tuple elements into a single string type with a separator.

type Res = Join<["a", "p", "p", "l", "e"], "-">; // expected to be 'a-p-p-l-e'
type Res1 = Join<["Hello", "World"], " ">; // expected to be 'Hello World'
type Res2 = Join<["2", "2", "2"], 1>; // expected to be '21212'
type Res3 = Join<["o"], "u">; // expected to be 'o'

Detailed Explanation

type Join<T extends unknown[], U extends string | number = ','> =
  T extends [infer First extends string, ...infer Rest]
    ? Rest extends []
      ? First
      : `${First}${U}${Join<Rest, U>}`
    : '';

How it works:

• The type parameter U defaults to ',' to match JavaScript's Array.join() behavior when no separator is provided, as demonstrated by the test case Join<['1', '1', '1']> expecting '1,1,1'.
• We extract the first element using infer First extends string to ensure it is treated as a string type in template literals.
• If Rest is empty (i.e., we are on the last element), we return just First without appending a trailing separator.
• Otherwise, we concatenate First, the separator U, and the recursive result of Join<Rest, U> to build up the joined string.
• An empty tuple [] returns the empty string ''.
• The separator U can be either a string or number type (e.g., 1), which works naturally in template literal interpolation (${1} produces "1").

This challenge helps you understand recursive template literal type construction and tuple processing, and how to apply these techniques in real-world scenarios.