감공사

Code

😢 순서를 뒤바꾸는 방법으로 간단하게 푼 문제(Reverse Int or String Algorithm 참고)

😊 입력값으로 받은 숫자 String을 Array로 나누고(split('')) reduce를 이용하여 순서를 뒤바꿔 줬다.
그런 후 각 세자리 숫자만큼 나눠서(split(' ')) 배열에 저장하고 Math.max.apply()를 이용해 더 큰 값을 구해줬다.
(아래 Full Code를 참고하면, reduce를 쓰지않고 다른 방법을 사용하여 푼 예제를 볼 수 있다)

✔ String.prototype.split('')

element 하나하나씩 나눠서 배열로 return해줬다. ( [ '7', '3', '4', ' ', '8', '9', '3' ] )

✔ Array.prototype.reduce()

안에 순서를 뒤바꾸는 reduce function을 주입하여 return해줬다. ( '398 437' )

✔ String.prototype.Split(' ')

가운데 공백(space)을 이용해 세자리 숫자씩 각각 나눠줬다. ( [ '734', '839' ] )

✔ Math.max.apply()

apply()에 숫자를 넣어서 max(더 큰)값을 구해줬다

위의 Skill들은 JavaScript - helper methods 카테고리에서 간단한 사용방법을 확인할 수 있다.

Full Code

Code

😢 '?'를 출력하는 조건 때문에 조금 고민한 문제.
Max Chars Algorithm(가장 많이 쓰인 문자 찾기 알고리즘)이랑 비슷한데 조금 달랐다.
그래서 Max Chars에서 사용한 스킬을 접목시켜보고 싶었다.

😊 먼저, charMap Object를 만들어주고, for ... of를 사용해서 각 문자가 쓰인 만큼 Object에 저장해주었다.
(key는 문자, value는 쓰인 개수)
max를 구하는 방법은 Math.max.apply를 이용해서 다르게 구해주었다.
for loop을 한 번 더 쓰고싶지 않았기 때문이다.(쓴 것과 속도는 비슷할듯)

다시 for ... in 을 열어주고, 미리 구한 max와 같은 것이 있다면 counter를 증가시켜줬다.
만약 counter가 1개만 증가했다면, 가장 많이 쓰인 문자는 1개인 것이고, 1개가 넘는다면 같은 max가 존재한다는 것!
결과적으로, 만약 counter > 1이라면 '?'를 출력하고 return, 아니라면 maxChar(가장 많이 쓰인 문자)를 출력해주었다.

다른 사람들이 푼 것도 살펴봤지만, 풀이 방법은 비슷하고, 가독성이 좋은 코드가 없어서 그냥 보기만 했다.(속도는 빨랐다)
내 코드가 가독성은 더 좋다고 생각하는데, 아마 Object, Ternary, for ... of, for ...in 그리고 Object.values를 모른다면 어려울 것 같긴 하다. 위의 개념은 JavaScript - helper methods or Grammar 카테고리에서 간단한 사용방법을 볼 수 있다.

✔ Object {}

charMap = { 'a': 1, 'b': 3 }; 이렇게 저장된다고 생각하면 된다.

✔ Ternary(삼항 조건 연산자)

charMap[char] = charMap[char] ? charMap[char]+1 : 1;
charMap[char]이 있다면 +1, 없다면 1을 넣어준다는 뜻이다.

✔ for ... of

classic for loop과 같지만, index범위를 지정하는 것이 없고, 알아서 값을 하나씩 가져온다고 생각하면 된다.
array-like를 사용할 때 이용 가능하다.

✔ for ... in

위의 for of와 같지만, Object의 for loop을 사용하기 위해 쓰는 문법이다.

✔ Object.values()

{ 'a': 1, 'b': 3 } 이라는 Object가 있을 때, [ 1, 3 ]처럼 values만 뽑아준다.

위의 Skill들은 JavaScript - helper methods or Grammar 카테고리에서 간단한 사용방법을 볼 수 있다.

Full Code

Code

😢 긴가민가? 하면서 계속 진행하며 풀어봤더니 해결된 문제. 문자열은 역시 배열 index를 잘 다뤄야 좋다(문자열도 배열이니까)

😊 T에 Test Case 수를 저장하고, 그 수만큼 반복되는 for loop을 열어준다.
반복할 수인 R을 따로 저장해주고, 반복될 문자열 S도 따로 저장해주는데, 특히 S는 배열 String에서 그냥 String으로 변환해준다.
( 처음에 입력값을 가져올 때 R과 S는 함께 있으므로, split(' ') 후 slice를 이용해 잘라준다)
마지막으로, 문자열의 길이 S만큼 반복하는 for loop안에 반복할 수 R만큼 반복하는 for loop을 열어줘서 같은 문자를 P에 중복 대입해준다. 한 문장이 끝날 때마다 console.log(P);를 통해 출력해주면 된다.

✔ parseInt()

String을 Number로 변환해주기 위해 사용하였다.
(자세한 내용은 JavaScript-helper method 카테고리에 있다)

✔ split(' ')

R과 S를 분리하기 위해 사용하였다.
(자세한 내용은 JavaScript-helper method 카테고리에 있다)

✔ slice()

R은 index 0, S는 index 1에 있으므로, slice를 이용해 잘라서 저장해준다.
(자세한 내용은 JavaScript-helper method 카테고리에 있다)

Full Code

Code

😢 C언어로 자주 알파벳 가지고 놀았었는데, 기억이 잘 나지 않아서 검색을 좀 했다.
JavaScript로 ASCII Code 다루는 방법을 익혀서 새로웠지만 재밌었다.

😊 Solution 1)
단순하게 한 번 풀어보고자, 모든 알파벳을 배열에 담고 비교해보았다. for ... of를 이용해서 알파벳을 하나씩 반복해주고,
if else를 이용해서 해당 알파벳이 있다면 index를, 없다면 -1를 배열로 저장하였다. 출력은 join(' ')으로 형식을 맞춰주면 된다.

Solution 2)
먼저, 결과값을 담아줄 result array를 선언하였다. 그리고
for loop의 범위로 a-z를 주었다. 'a'는 ASCII Code 97번이고, 'z'는 ASCII Code 122번이기 때문에 97-122까지 반복 실행된다.
입력된 문자열(input 변수)에 해당하는 알파벳이 있다면 그 값의 index를, 없다면 -1를 반환하여 result array에 저장한다.
마지막으로, join(' ')을 통해 출력 형식을 맞춰 주면 된다.

가장 중요한 것은 -1 또는 해당 index라는 키워드가 나왔을 때, indexOf를 떠올릴 수 있어야 한다.

✔ String.prototype.charCodeAt()

각 알파벳의 ASCII Code를 알아내기 위해 사용하였다.
JavaScript-helper method에서 예제를 다뤄 보겠다.

✔ String.fromCharCode()

해당 ASCII Code에 해당하는 문자를 반환한다.
indexOf안에 찾고자하는 character를 넣기 위해 사용했다.(a-z의 ASCII Code가 순서대로 들어간다)
JavaScript-helper method에서 예제를 다뤄 보겠다.

✔ String.prototype.indexOf()

입력받은 값중에 해당 알파벳이 있는지, 있다면 그 위치(index)를 반환받고, 없다면 -1을 반환받기 위해 사용하였다.
JavaScript-helper method에서 예제를 다뤄 보겠다.

Full Code

Code

😢 보자마자 바로 풀 수 있었다. 매우 기초적인 문제.

😊 for ... of 를 이용하여 하나씩 더해 주거나, classic for loop을 이용해서 하나씩 더해 주면 된다.

✔ for ... of

array 값을 순서대로 하나씩 가져오며, array의 길이만큼 반복해준다.

✔ 2차원 배열(Two-dementional Array)

입력값을 문자열로 가져오기 때문에 배열로 값을 지정하여 가져올 수 있다.
(e.g., input = [ '5', '54321' ]; 이라면 input[1]의 '5'는 input[1][0])

Full Code

Q. 정수 n을 입력받아, Fibonacci(피보나치 수열)의 n번째 수를 출력하라.

피보나치 수열이란 처음 두 항을 1과 1로 한 후, 그 다음 항부터는 바로 앞의 두 개의 항을 더해 만드는수열을 말한다.

For example, the sequence
[0, 1, 1, 2, 3, 5, 8, 13, 21, 34]
forms the first ten entries of the fibonacci series.
Example:
fib(4) === 3

Code

😢 배열을 이용한 단순 fib는 쉽게 풀었고, recursion(재귀)를 사용하는 fib는 생각하기에는 어려웠지만 단순했고, memoize(Dynamic Programming)은 매우 생소해서 익숙해지는 시간이 필요했다.

😊 Solution 1)
index 0과 1의 값을 미리 저장한 배열(array)를 선언해주고, classic for loop을 반복해주었다.
i는 1부터 시작해주고 arr.push(arr[i-1] + arr[i-2])형식으로 index를 조정해주어 값을 push해주고 arr[n]을 출력해주면 된다.

Solution 2) 재귀함수(Recursion)
재귀함수를 이용한다.
만약 n값이 2보다 작다면 n값을 return하는 Base Case를 걸어두어 간단하게 해결할 수 있다.
(무조건 index 0은 0이고, index 1은 1로 시작하기 때문이며, 최대 -2를 해주므로, 0또는 1값만 발생할 수 있다)
0, 1, 1이 합쳐져 다음 수를 만들고, 이것들이 결과적으로 피보나치 수열을 이루기 때문이다(결국 1을 찾는 것이다)
return fib(n-1) + fib(n-2);을 통해 처음부터 끝까지 모든 경우의 수를 재귀적으로 실행한다.

Solution 3) 재귀함수와 Memoize(Dynamic Programing)
재귀함수로 검색을 해주지만, 모든 경우의 수를 탐색하지 않고, cache를 생성하여 한 번 검색한 값은 저장하고, 다시 탐색하지 않는다.
재귀함수 fib(여기서는 slowFib)를 memoize함수 안에서 실행하도록 하여, 한 번 탐색한 값은 cache object에 저장하고 그 값을 다시 탐색한다면 cache에서 값을 꺼내 반환해준다. 만약 처음으로 탐색하는 값이라면 slowFib를 실행시킨다.
이렇게 재귀함수를 사용해주면 시간낭비 없이 효율적으로 재귀를 진행할 수 있다.

✔ Nested functions

Memoize function안에 inner function을 만들어줘서, 이미 검색한 값이라면 cache[args]를 리턴, 그게 아니라면 검색하게 한다.
이 과정을 통해 시간 복잡도를 줄일 수 있다. 검색하는 시간을 줄여주기 때문이다.
JavaScript - Grammar 카테고리에서 조금 더 다뤄 보겠다.

✔ Function.prototype.apply()

memoize의 inner function에서 slowFib를 실행시켜주는 방법이다.
helper method 카테고리에서 조금 더 다뤄 보겠다.

✔ this

이 문제에서는 사실 apply()의 첫 번째 parameter에 null or this를 넣어도 큰 상관은 없지만,  this로 넣어줬다.
간단히 말하자면 this는 자신의 왼쪽(소속)을 나타낸다.
 JavaScript - Grammar에서 조금 더 다뤄 보겠다.

✔ args(The arguments object)

입력값을 간접적으로(?) 넘겨주기 위해 사용했다.
function안에서 다룰 수 있는 Array-like object인 arguments이며,
JavaScript - Grammar에서 조금 더 다뤄 보겠다.

✔ ... (Spread)

args를 array처럼 만들어 줄 수 있다. apply()의 두 번째 parameter가 array이므로 array-like값을 넘어주기 위해 사용했다.
JavaScript - ES2015 카테고리에서 개념을 확인할 수 있다.

Full Code

Q. 정수 n을 입력받고, nxn 크기 나선형 행렬(달팽이)를 출력하라.

--- Examples
matrix(2)
  [[1, 2],
  [4, 3]]
matrix(3)
  [[1, 2, 3],
  [8, 9, 4],
  [7, 6, 5]]
matrix(4)
  [[1,   2,  3, 4],
  [12, 13, 14, 5],
  [11, 16, 15, 6],
  [10,  9,  8, 7]]

Code

😢 행렬(2차원 배열)의 패턴을 파악하는 것이 핵심!
3X3 행렬 Test Case를 그려놓고 패턴을 파악하다보니 마지막 for loop의 진행 방향을 놓쳤었다.
진행 순서를 눈으로 확인하기 위해, 진행되는 값을 출력해 보았더니 훨씬 이해가 쉬웠다(Full Code 밑에 추가)

😊 먼저, 행렬(2차원 배열)을 초기화 해주기 위해 for loop으로 n(행)만큼 array를 추가해주었다.
그리고 1부터 값을 증가해주기 위해 count를 선언해주고, 0부터 n-1까지 startRow(Column), endRow(Column)을 각각 선언해준다.
while loop을 이용해 각 StartRow(Column)와 endRow(Column)가 같은 값을 가질 때까지 반복해준다.
(StartRow(Column)는 EndRow(Column)보다 커질 수 없고, EndRow(Column)은 음수가 될 수 없다)

그리고 변경되어야하는 row 또는 column을 중심으로 i를 선언해주고 count값을 증가하며 넣어준다.
해당 row나 column작업이 끝나면 증가 또는 감소시켜준다.

패턴을 찾아줘야하는 알고리즘이기 때문에 특별한 helper method skill은 없다.

Full Code

Spiral Matrix Code For Visual(진행 순서를 눈으로 확인하기 위한 Code)

Q. 입력받은 string에서 vowels(모음 - a, e, i, o, u)가 몇 개인지 찾아내라.

--- Examples
vowels('Hi There!') --> 3
vowels('Why do you ask?') --> 4
vowels('Why?') --> 0

Code

😢 vowels를 손쉽게 찾도록 도와줄 includes, match를 활용하는 것이 익숙하지 않았다.

😊 Solution 1)
checker array에 모음(a, e, i, o, u)를 미리 저장해두고, for ... of loop안에서 checker.includes()를 이용해 모음이 있다면 count를 증가시키면서 모음의 개수를 찾아냈다. for ... of는 여러모로 참 유용하다.

Solution 2)
match helper method안에 RegExp를 삽입하여 매우 간단하게 모음을 찾아냈다.
입력받은 str에 match를 사용해주면, 만약 원하는 값이 match됐을 때, 그 값이 반환된다.
여기서 중요한 것은 RegExp에서 g를 넣어줘야 global로 끝까지 검색을 하여 match된 모든 값의 배열을 반환해주며, i를 넣어줘야 대소문자 구분없이 match를 확인해준다.

✔ Array.prototype.includes()

Array에 있는 값들 중에 includes()괄호 안에 넣어준 값을 포함하고 있나? 확인해준다.

✔ String.prototype.match()

String(문자열)에 있는 character중에 match(RegExp)괄호 안에 있는 RegExp의 조건과 매치되는 값이 있나? 확인해준다.

✔ /[aeiou]/gi

[a, e, i, o, u]중에 하나라도 있으면 체크된다.
g는 global search(한 번 매치되고 끝나지 않고, 끝까지 체크한다)
i는 case-insensitive search 대소문자 구분없이 같은 알파벳이라면 동일하게 체크된다.

Full Code

Q. 입력받은 n(숫자)만큼의 층을 생성하는 피라미드를 출력하라.
(단, n은 양수이며, 각 층의 양측 공백은 space로 채워야한다)

--- Examples
pyramid(1)
    '#'
pyramid(2)
    ' # '
    '###'
pyramid(3)
    '  #  '
    ' ### '
    '#####'

Code

😢 각 층(level)의 column은 홀수로 출력되어야 하며, 가운데(midpoint)를 찾아 확장하는 것이 핵심이다.
이 두 가지 핵심 포인트를 찾는 것에 시간이 조금 걸렸다.

😊 Solution 1)
먼저, 해당 피라미드의 가운데지점(midpoint)을 세팅해준다. (2*n-1)
외부 for loop의 row(행)은 각 층수이기 때문에 받은 숫자(n)만큼 반복되고,
내부 for loop의 column(열)은 항상 홀수로 출력되어야 하기 때문에 2*n-1만큼 반복되어야 한다.
그리고 만약 각 층의 #이 채워질 범위가 midpoint - row <= column <= midpoint + row에 해당하면 #,
그게 아니라면 ' '(space)를 level에 대입해준다. 그리고 내부 for loop이 끝날 때마다 각 층을 출력해준다.

Solution 2) 재귀함수
먼저, 함수의 parameter에 row=0, level='' 을 default로 설정해준다. 초기화 후 다른 값으로 반복 대입이 필요하기 때문이다.
Base Case 1)로 만약 row(행)가 n(받은 입력값)과 같으면 return;하여 작업을 끝내주고,
Base Case 2)로 만약 각 층의 값이 level.length(2*n-1)만큼 채워지면 다음 row(층) 작업(재귀)을 실행시켜주고,
원래 하던 작업은 return; 시켜준다.(중요)(Solution 1의 column을 여기서는 level로 대체해준다)
만약 return해주지 않으면, 아래로 작업이 진행되기 때문에 의도하지 않는 실행이 발생될 수 있기 때문이다.
그 후 Solution 1)과 마찬가지로 midpoint - row <= level.length <= midpoint + row 범위에 해당하면 #,
그게 아니라면 ' '을 level에 대입하여준다.
그리고 각 층의 level.length만큼 반복시켜주기 위해 pyramid(n, row, level + add)로 각 층을 재귀함수로 반복시켜준다.

✔ default

function pyramid(n, row=0, level='') 좌측의 row와 level은 입력받지 않는 이상 default인 0과 ''로 실행된다.

https://babeljs.io/docs/en/learn/#default-rest-spread

Full Code

Code

😢 학부에서 C나 Java를 쓸 때는 자주 사용했던 ASCII Code인데, JavaScript를 주로 사용하게되면서 오랜만에 써보았다.
아니 JavaScript에서는 처음 ASCII Code를 다뤘다.

😊 C나 Java에서는 변환명세 %d, %c 등을 통해 다뤘던 기억이 나는데,
JavaScript에서는 String.charCodeAt(index) helper method를 사용하면 된다.
그리고 4번째 줄에서 trim()도 사용하였지만, 사실 이 문제에서는 굳이 사용하지 않아도 된다.
다른 정답자들도 모두 이 방법으로 풀었다. 다른 방법이 딱히 없나보다.

✔ String.charCodeAt()

String이 담겨있는 변수에 charCodeAt(알고 싶은 index)를 이용해 사용해주면 된다.

Full Code