안녕하세요. 혀코입니다.
이번 시간에는 JavaScript로 숫자 하나를 받아서 #기호로 다음과 같이 계단을 표시하는 방법에 대해서 알아보겠습니다.
1의 경우, |
2의 경우, |
3의 경우, |
4의 경우, |
function steps(n) {
for(let row = 0; row < n; row++) {
let stair = '';
for(let col = 0; col < n; col++){
if (col <= row) {
stair += '#';
} else {
stair += ' ';
}
}
console.log(stair);
}
}
for loop안에 nested for loop을 사용해서 가로값과 세로값을 비교해서 같거나 세로값이 작을 경우 #을 표시하고 클 경우 빈칸을 표시해서 계단을 표시했습니다.
nested for loop을 사용하지 않고, recursion function을 사용하는 방법이 있습니다. 함수안에 동일한 함수를 콜하는 방법입니다. 구현을 해보면 다음과 같습니다.
function steps(n, row = 0, stair = '') {
if(n === row) {
return ;
}
if(n === stair.length) {
console.log(stair);
return steps(n, row+1);
}
if(stair.length <= row) {
stair += '#';
} else {
stair += ' ';
}
steps(n, row, stair)
}
함수는 숫자 하나만 받기 때문에 함수 자체에서 줄의 수(row)와 표시될 각 줄의 스트링 값(stair)의 디폴트 값을 정해줍니다. n으로 3을 받으면, 첫째 if 문을 패스하고 두번째 if 문도 패스해서 세번째 if 문에 가서 비어있는 stair 값에 # 기호를 더해줍니다. if 문을 나와서 recursion function을 통해 다시 함수를 호출하면 n은 3, row는 0, stair는 # 상태로 다시 함수를 실행하게됩니다. 그래서 두번째에는 첫째 if 문을 패스하고, 두번째 if 문도 패스하고 세번째 if 문을 가서 stair 값에 # 기호가 있어서 stair.length 값이 row 값보다 크기 때문에, else문으로 가서 stair 에는 '# '값이 저장됩니다. if else 문을 나와서 recursion function을 통해 다시 함수를 호출하면 n은 3, row는 0, stair는 '# ' 상태로 다시 함수를 실행합니다. 그래서 세번째에는 첫째, 두번째 if 문을 통과해서 if의 else 문을 지나 stair 값은 '# ' 값이 저장되고 n은 3, row는 0 stair는 '# ' 상태로 다시 함수를 실행해서 첫번째 if문 통과, 두번째 if 문에서 stair.length 값이 n 값과 동일하게 되므로, stair를 console.log로 출력을 하고, row 값에 1을 더해줘서 함수를 또 출력합니다. 이런식으로 계속 recursion function을 돌아 마침내 n값과 row값이 3으로 같아지게 되면, 함수가 종료됩니다.
세번째 if 문 대신 삼항연산자(Ternary operator)를 사용하면 다음과 같이 구현할 수 있습니다.
function steps(n, row = 0, stair = '') {
if(n === row) {
return ;
}
if(n === stair.length) {
console.log(stair);
return steps(n, row+1);
}
const add = stair.length <= row ? '#' : ' ';
steps(n, row, stair + add);
}
이렇게 JavaScript로 계단을 표시하는 방법에 대해서 알아봤습니다.
유용하셨다면, 공감과 구독 부탁 드립니다.
감사합니다.
댓글