JavaScript Katas: Letterbox Paint Squad

소개 🌐

문제 해결은 일반적으로 경력과 삶에 중요한 기술입니다.

그렇기 때문에 모든 레벨의 흥미로운 카타를 가져와 사용자 정의하고 해결 방법을 설명합니다.

오늘의 운동

오늘은 또 다른7 kyu 카타,
난이도를 약간 높인다는 의미입니다.

출처: Codewars

You and a group of friends are earning some extra money by re-painting the numbers on people's letterboxes for a small fee.

Since there are 10 of you in the group, each person just paints one digit, e.g. somebody will paint only the 1's, somebody else will paint only the 2's and so on...

At the end of the day you realise not everybody did the same amount of work.

To avoid any fights you need to distribute the money fairly. That's where this Kata comes in.

paintLetterboxes 와 start 두 개의 매개변수를 받는 함수 end 를 작성하세요.
start 번호가 주어지면, 예: 125 ,
및 end 번호(예: 132 ,
그려진 모든 10자리 숫자의 빈도를 반환하고,
예를 들어 [1, 9, 6, 3, 0, 1, 1, 1, 1, 1] .

125: 1 x 1, 1 x 2, 1 x 5
126: 1 x 1, 1 x 2, 1 x 6
...
132: 1 x 1, 1 x 3, 1 x 2

입력: 두 개의 숫자.

출력: 숫자 배열.

솔루션에 대한 생각 💭

먼저 운동을 이해해야 합니다! 우리가 그것을 이해하지 못하면, 우리는 그것을 해결할 수 없습니다!.

나는 그 운동을 이해하고 있다고 생각한다(= 내가 함수에 넣은 것과 그것을 통해 얻고자 하는 것).

이제 입력에서 출력으로 이동하는 특정 단계가 필요합니다.

나는 작은 아기 단계에서 이것을 시도합니다.

시작과 끝 사이의 모든 숫자로 배열을 생성합니다.

각 숫자를 분할된 숫자로 매핑합니다

.

모든 숫자를 하나의 큰 배열로 줄입니다.

0에서 9까지의 모든 숫자를 사용하여 객체 생성

모든 숫자를 센다

배열로 반환

예시:

입력: 125, 132

시작과 끝 사이의 모든 숫자로 배열 생성: [125, 126, 127, 128, 129, 130, 131, 132]

각 숫자를 분할 숫자로 매핑합니다. [ [ '1', '2', '5' ], [ '1', '2', '6' ], ..., [ '1', '3', '2' ] ]

모든 숫자를 하나의 큰 배열로 줄입니다. [ '1', '2', '5', '1', '2', '6', ..., '1', '3', '2' ]

0에서 9까지의 모든 숫자로 객체 생성: { '0': 0, '1': 0, ... , '9': 0 }

모든 숫자 세기: { '0': 1, '1': 9, ... , '9': 1 }

배열로 반환: [ 1, 9, 6, 3, 0, 1, 1, 1, 1, 1 ]

출력: [ 1, 9, 6, 3, 0, 1, 1, 1, 1, 1 ] ✅

🥵

구현(명시적) ⛑

function paintLetterboxes(start, end) {
  // create array with the number of every number between start and end
  // const array = [...Array(end - start + 1).keys()].map(i => i + start);
  const allNumbers = [...Array(end + 1).keys()].slice(start);

  // map each number into its split digits
  const splitIntoDigits = allNumbers.map((num) => String(num).split(""));

  // reduce every number into one big array
  // const allDigits = splitIntoDigits.reduce((acc, cur) => acc.concat(cur), []); // node < 11
  const allDigits = splitIntoDigits.flat();

  // create object with all numbers from 0 to 9
  const startObject = [...Array(10).keys()].reduce(
    (acc, cur) => ({ ...acc, [cur]: 0 }),
    {}
  );

  // count every digit
  const counted = allDigits.reduce(
    (acc, cur) => ({ ...acc, [cur]: acc[cur] + 1 }),
    startObject
  );

  // return as array
  const result = Object.entries(counted).reduce(
    (acc, cur) => [...acc, cur[1]],
    []
  );

  return result;
}

결과

console.log(paintLetterboxes(125, 132));
// [ 1, 9, 6, 3, 0, 1, 1, 1, 1, 1 ] ✅

console.log(paintLetterboxes(2, 4));
// [ 0, 0, 1, 1, 1, 0, 0, 0, 0, 0 ] ✅

구현(암시적) ⛑

function paintLetterboxes(start, end) {
  const startObject = [...Array(10).keys()].reduce(
    (acc, cur) => ({ ...acc, [cur]: 0 }),
    {}
  );
  const counted = [...Array(end + 1).keys()]
    .slice(start)
    .map((num) => String(num).split(""))
    .flat()
    .reduce((acc, cur) => ({ ...acc, [cur]: acc[cur] + 1 }), startObject);
  return Object.entries(counted).reduce((acc, cur) => [...acc, cur[1]], []);
}

결과

console.log(paintLetterboxes(125, 132));
// [ 1, 9, 6, 3, 0, 1, 1, 1, 1, 1 ] ✅

console.log(paintLetterboxes(2, 4));
// [ 0, 0, 1, 1, 1, 0, 0, 0, 0, 0 ] ✅

놀이터 ⚽

코드를 가지고 놀 수 있습니다 here

다음 편 ➡️

훌륭한 일!

아마도 이 솔루션은 너무 복잡하지만 재미있었습니다!
... , Array , keys , entries , slice , flat , map reduce 사용법을 배웠습니다

새로운 학습 내용을 사용하여 문제를 더 쉽게 해결할 수 있기를 바랍니다!

다음 시간에는 또 다른 재미있는 카타를 풀겠습니다. 계속 지켜봐 주세요!


특정 카타를 해결해야 한다면 메시지를 보내주세요here.

제 최신글을 읽고 싶으시다면 get in touch with me!

추가 읽기 📖

...

Array

keys

entries

slice

flat

map

reduce

질문 ❔

카타를 얼마나 자주 하시나요?

어떤 구현이 더 마음에 드시나요? 왜요?

대체 솔루션이 있습니까?