티스토리 뷰
코테를 준비하다가 지그재그 출력에 대해 자세히 잘 모르는 것 같아 이번 기회에 정리를 해보려 한다.
일정 숫자에서 출력
1 | 2 | 3 | 4 | 5 |
6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 |
이 부분은 많이들 하신 거 같으니 설명은 생략하겠습니다.
<html>
<body>
<h2>지그재그 출력</h2>
<script>
const num = 25;
for (let i = 1; i <= num; i++) {
document.write(`${i} `);
if (i % 5 == 0) {
document.write("<br />");
}
}
</script>
</body>
</html>
일단 출력은 5의 숫자에서 잘 떨어지게 출력이 된다...
문제는 깔끔하게 하기 위해 10 미만의 숫자에는 공백을 추가하였지만...
하지만 깔끔하게 잘 되지 않는다.
이전에 커멘드 출력을 할 때는 잘 된 것 같았지만, 잘 모르겠다.
그러니 일단 노가다로 해보자.
<html>
<body>
<h2>지그재그 출력</h2>
<script>
for (let i = 1; i <= 5; i++) {
document.write(`${i} `);
}
document.write("<br />");
for (let i = 10; i >= 6; i--) {
document.write(`${i} `);
}
document.write("<br />");
for (let i = 11; i <= 15; i++) {
document.write(`${i} `);
}
document.write("<br />");
for (let i = 20; i >= 16; i--) {
document.write(`${i} `);
}
</script>
</body>
</html>
일단 노가다로 할 경우 위와 같은 코드로 나온다.
하지만 결과는 맞아도 이건 개발자스럽지 않은 방법이다.
여기서 규칙을 찾아야 한다...
모르겠다.
다른 블로그를 참고해보려고 한다.
처음 코드를 그대로 가져와 적어보면서... 이해가 가지 않았다.
그리고 코드 하나하나 뜯어보았다.
<html>
<body>
<h2>지그재그 출력</h2>
<script>
const maxLine = 5;
let minNumber = 0;
for (let i = 1; i <= maxLine; i++) {
let data = [];
for (let j = 1; j <= 5; j++) {
minNumber += 1;
data.push(minNumber);
}
if (i % 2 == 0) {
data.reverse();
}
document.write(`${data}<br />`);
}
</script>
</body>
</html>
위위 코드는 필자가 이해를 통해 만든 코드다
그리고 아래는 결과물이다.
여기서 알 수 있었던 것은, 배열을 통해서 출력하는 법 push를 다시 한번 기억하게 해 주었다.
그리고 여기서 핵심은 reverse함수
javascript에서 reverse함수는 전체 문자열이나, 배열에 따라 거꾸로 출력을 해주는 함수다.
이 함수로 간편하게 할 수 있었다.
사실 필자는 코딩테스트 많이 준비는 하지 않았다.
하지만 이제 점점 현실적으로 코딩 테스트의 절실함을 느꼈고 준비를 하면서의 과정을 적어보았다.
물론 처음은 쉽지 않지만, 예전에 구구단이 어려웠던 것 처럼
이후에는 언제든 구구단 코드를 출력할 수 있는 실력을 가지기 위해선
역시 반복과 학습이 항상 존재한다는 것을 다시 한번 깨달았다.
이렇게 기본 개념을 하다 보니 조금씩 개념 정리를 하는데도 많은 도움이 되었다.
'ETC > Coding Test' 카테고리의 다른 글
programmers : 코딩테스트 연습 > 연습문제 > 문자열 다루기 기본 (0) | 2021.02.20 |
---|---|
programmers : 코딩테스트 연습 > 연습 문제 > 약수의 합 (0) | 2021.02.17 |
programmers : 코딩 테스트 연습 > 연습문제 > 124 나라의 숫자 (0) | 2021.02.13 |
지그재그 응용편 (0) | 2020.12.05 |
코테추천사이트 : 앞으로 공부를 해보려고 기록하는 코딩테스트 사이트를 모아보았다. (0) | 2020.11.26 |
- Total
- Today
- Yesterday
- github
- react
- redux
- 자바
- 리덕스
- 뷰
- 리액트 썸네일
- 리액트
- node
- programmers
- 함수
- 배열
- 리액트 유튜브
- Git
- 재공부
- Switch
- 코딩테스트
- 파이썬
- mongodb
- CSS
- 프로그래머스
- node-sass
- array
- 자바스크립트
- java
- Visual Studio Code
- javascript
- node.js
- Coding Test
- 노드
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |