배열은 여러 자료를 묶어서 활용할 수 있는 특수한 자료입니다!
배열은 변수 = [요소1, 요소2, 요소3, 요소4 •••] 로 선언해 사용할 수 있습니다.
배열 요소에 접근하기 위해서는 배열[인덱스] 로 접근할 수 있습니다. 이때 인덱스는 0부터 시작합니다!
배열 요소의 개수는 배열.length 로 접근할 수 있습니다.
배열에 요소를 추가하고 싶을 때는 배열.push(요소)를 사용하거나 배열[인덱스] = '요소' 를 사용할 수 있습니다. push는 맨 뒤에 요소가 들어가는 반면 인덱스를 사용하게 되면 자신이 선택한 인덱스에 배열이 들어가게 됩니다.
만약 특정 위치에 요소를 넣고 싶으면 배열.splice(인덱스, 0, 요소) 를 사용하면 됩니다.
배열의 요소를 제거하고 싶을 때는 배열.splice(인덱스, 제거할 요소의 개수) 를 사용할 수 있습니다. splice 단독으로 쓰게 되면 인덱스를 기준으로 요소를 제거하는 것입니다. 만약 요소를 기준으로 제거하고 싶으면 배열.indexOf(요소) 를 통해 요소의 인덱스를 확인한 후에 배열.splice() 를 사용하는 방법이 있습니다.
비파괴적 처리 : 처리 후에 원본 내용이 변경되지 않는다.
파괴적 처리 : 처리 후에 원본 내용이 변경된다.
Chapter 4-1 마무리 |
1. 다음 배열들의 2번째 인덱스에 있는 값을 찾아보세요. |
① ["1", "2", "3", "4"] -> ["3"] ② ["사과", '배", "바나나", "귤", "감"] -> ["바나나"] ③ [52, 273, 32, 103, 57] -> [32] |
2. 다음 코드의 실행 결과를 예측해보세요. |
> 4 > 5 |
3. 다음 표시된 함수들이 파괴적 처리를 하는지 비파괴적 처리를 하는지 구분해 맞는 것에 O 표시하세요. |
① 비파괴적 처리 ② 파괴적 처리 ③ 비파괴적 처리 ④ 비파괴적 처리 |
반복문은 배열 요소나 객체 요소를 하나하나 꺼내서 특정 문정을 실행할 때 사용합니다!
for(const 반복 변수 in 배열 또는 객체) {
문장
}
for ~ in 반복문은 반복 변수에 인덱스가 들어있습니다! 따라서 요소를 사용하기 위해서는 배열[i]와 같이 사용해야합니다.
그럴 때 for ~ of 반복문을 사용하게 되면 반복 변수에 요소가 들어갑니다!
for(const 반복 변수 of 배열 또는 객체) {
문장
}
for의 가장 기본적인 형태는
for(let i = 0; i < 반복 횟수; i++){
문장
}
기본 형태를 사용해 1부터 100까지 더하는 예제를 만들어봅시다!
<body>
<script>
let res = 0
for(let i = 1; i<=100; i++){
res += i;
}
console.log(`1~100까지 다 더한 값은 ${res}입니다.`)
</script>
</body>
while 반복문은 불 표현식이 true인 동안 반복문을 실행합니다!
while(불 표현식) {
문장
}
<body>
<script>
let i = 1;
while(true){
alert(`${i}번째입니다.`)
i++
}
</script>
</body>
이렇게 하면 무한루프가 되어 끝나지 않습니다! 따라서 불 표현식을 적절하게 작성해야합니다.
<body>
<script>
let i = 1
while(confirm('계속하시겠습니까?')){
alert(`${i}번째입니다.`)
i++
}
</script>
</body>
confirm을 사용하면 true 또는 false의 결과를 내놓기 때문에 취소를 누르면 반복문이 중단됩니다.
반복문이 언제 끝나는지 확실하게 모르지만 특정 값이 되었을 때 끝내야한다! 그럴때는 break 키워드를 사용하면 됩니다!
<body>
<script>
for(let i = 0; true; i++){
alert(`${i}번째입니다.`)
const isContinue = confirm('계속하시겠습니까?')
if(!isContinue) break
}
alert('프로그램 종료')
</script>
</body>
위의 while문과 똑같이 실행되지만 break 키워드를 사용했습니다!
특정 값에서 실행하지 않고 그냥 넘어가고 싶다! 그럴 때는 continue 키워드를 사용하면 됩니다!
<body>
<script>
let output = 0
for(let i = 1; i<=10; i++){
if(i%2 == 0) continue
output += i
}
alert(`홀수의 합은 ${output}입니다.`)
</script>
</body>
짝수면 continue를 사용해 아래 문장이 실행되지 않고 건너뛰게 했습니다!
피라미드 1
<body>
<script>
let output = ''
for(let i = 1; i<=10; i++){
for(let j = 1; j<=i; j++){
output += '*'
}
output += '\n'
}
console.log(output)
</script>
</body>
피라미드 2
<body>
<script>
let output = ''
for(let i = 1; i<=10; i++){
for(let j = 10; j>=i; j--){
output += ' '
}
for(let k = 1; k<=i*2 - 1; k++){
output += '*'
}
output += '\n'
}
console.log(output)
</script>
</body>
Chapter 4-2 마무리 |
1. 다음 프로그램의 실행 결과를 예측해보세요. |
> 0, 1, 2, 3 > '사과', '배', '귤', '바나나' |
2. 다음 프로그램의 실행 결과를 예측해보세요. 혹시 오류가 발생한다면 어디를 수정해야 할까요? |
let i가 아니라 const i로 되어 있어 오류가 발생한다! |
3. 1부터 100까지의 숫자를 곱한 값을 계산하는 프로그램을 만들어보세요. 그리고 코드를 실행해 나온 결과를 확인해 보세요. |
<body>
<script>
let output = 1
for(let i = 1; i<=100; i++){
output *= i
}
console.log(`1~100의 숫자를 모두 곱하면, ${output}입니다`)
</script>
</body>
|
4. 처음에는 조금 어려울 수 있겠지만, 활용 예제의 피라미드를 활용해서 다음과 같은 피라미드를 만들어보세요. |
<body>
<script>
let output = ''
const size = 5
for(let i = 1; i<=size; i++){
for(let j = size; j>i; j--){
output += ' '
}
for(let k = 1; k<= i*2 - 1; k++){
output += '*'
}
output += '\n'
}
for(let i = size - 1; i>=1; i--){
for(let j = size; j>i; j--){
output += ' '
}
for(let k = 1; k<= i * 2 - 1; k++){
output += '*'
}
output += '\n'
}
console.log(output)
</script>
</body>
|
3주차 끝!!! O(∩_∩)O
'혼공스' 카테고리의 다른 글
혼공단 11기 회고록 (1) | 2024.02.05 |
---|---|
혼공스 - 5주차 👍 (1) | 2024.01.29 |
혼공스 - 4주차 ✨ (0) | 2024.01.22 |
혼공스 - 2주차 (。・∀・)ノ゙ (1) | 2024.01.08 |
혼공스 - 1주차! 🤓 (1) | 2024.01.02 |