Start learning free

LESSON 121 OF 675 · ARRAYS - CHALLENGES

First N Items in TypeScript: Copying with slice

Practice Read the full explanation

You get an array of integers nums and a number n. Return an array with the first n numbers of nums.

Keep them in the same order. When n is 0, return an empty array.

 

Example 1:

Input: nums = [3, 8, 1, 9, 4], n = 3
Output: [3, 8, 1]
Explanation: The first 3 numbers are 3, 8 and 1.
The 9 and the 4 are left out.

Example 2:

Input: nums = [5, 6, 7], n = 0
Output: []
Explanation: No numbers are taken, so the result is empty.

Example 3:

Input: nums = [2, 4], n = 2
Output: [2, 4]
Explanation: n is the length of nums, so every number is kept.

 

Constraints:

  • nums has 1 to 10 numbers.
  • Every number is an integer from -1000 to 1000.
  • n is from 0 to the length of nums.
STEP 1 OF 2
    Ctrl + Enter to check

    TYPESCRIPT · ARRAYS - CHALLENGES

    First N Items in TypeScript, explained

    Problem overview

    firstN receives an array of integers nums and a number n. It returns a new array with the first n numbers, in the same order. When n is 0 the result is an empty array, and n is never larger than the length of nums.

    For nums = [3, 8, 1, 9, 4] and n = 3 the answer is [3, 8, 1]: the 9 and the 4 are left out. For [5, 6, 7] and n = 0 it is [], and for [2, 4] and n = 2 every number is kept.

    Approach

    This is exactly what slice does. nums.slice(0, n) copies the items from index 0 up to, but not including, index n. Those are the items at indexes 0 to n - 1, which is n numbers. No loop and no special case for 0 is needed, because slice(0, 0) is an empty array.

    Step by step

    1. Copy the first n numbers. Call slice from 0 to n and keep the copy in a constant named result of type number[].
    2. Return it. The copy is a new array, so nums itself stays as it was.

    The solution in TypeScript

    class Solution {
        firstN(nums: number[], n: number): number[] {
            const result: number[] = nums.slice(0, n);
            return result;
        }
    }

    Running it on the three examples gives:

    [ 3, 8, 1 ] [] [ 2, 4 ]

    The type annotation number[] is for the compiler and the reader only. TypeScript erases it when it compiles to JavaScript, so it checks nothing while the program runs.

    Tracing the first example

    With nums = [3, 8, 1, 9, 4] and n = 3, the indexes are 0 to 4. The call slice(0, 3) copies the items at indexes 0, 1 and 2, which are 3, 8 and 1, and stops before index 3. The items at indexes 3 and 4, the 9 and the 4, are never copied. The length of the result is always the end minus the start, here 3 - 0 = 3, which is why the end index can simply be n.

    Another way: a loop

    The same result can be built by hand. Start with an empty array and push the numbers at indexes 0 to n - 1:

    const result: number[] = [];
    for (let i = 0; i < n; i++) {
        result.push(nums[i]);
    }

    On the three examples it gives the same [ 3, 8, 1 ] [] [ 2, 4 ]. When n is 0 the loop body never runs, so the empty array comes back untouched. This works, but slice says the same in one line and cannot go wrong with the loop bounds, which is why the lesson uses it.

    Edge cases and common mistakes

    • The end index is excluded. Using n - 1 as the end would return one number too few.
    • n equal to 0. The result is an empty array, with no extra code.
    • n equal to the length. slice(0, nums.length) copies everything, so [2, 4] stays [2, 4].
    • Changing the copy does not change the input. After result.push(99) on the copy of [3, 8, 1, 9, 4] with n = 3, the original still holds its five numbers. That would not be true if the function returned nums itself.
    • Don't confuse it with splice. splice(0, n) also returns the first n numbers, but it removes them from nums.

    Testing

    Try a single number and a negative one: firstN([7], 1) returns [ 7 ], and firstN([-5, 0, 5, 10], 1) returns [ -5 ]. The numbers' signs do not matter, because slice only looks at positions.

    Keep going with TypeScript500+ step-by-step lessons, from your first line of code to coding interviews. Free to start.
    Start learning free