4-1 배열
배열이란
여러 자료를 묶어서 활용할 수 있는 특수한 자료
배열 요소에 접근하기
배열[인덱스]
인덱스란? : 배열안에 있는 요소의 순서
const number=[273, 52, 103, 32] undefined numbers[0] - 273 numbers[1] - 52 numbers[1+1] - 103 numbers[1*3] - 32
배열 요소 개수 확인하기
배열.length
length? : 배열 내부의 들어 있는 요소의 개수를 확인하는 속성
const fruits = ['배', '사과', '키위', '바나나'] - undefined fruits.length - 4 fruits[fruits.length-1] // 마지막 요소를 선택할 때 자주 사용하는 패턴 - "바나나"
배열 뒷부분에 요소 추가하기
배열.push(요소)
const todos = ['우유 구매', '업무 메일 확인하기', '필라테스 수업'] - undefined todos - ['우유 구매', '업무 메일 확인하기', '필라테스 수업'] todos.push('저녁 식사 준비하기') // 값 추가 - 4 // 추가된 요소 개수 출력 todos.push('피아노 연습하기') // 값 추가 - 5 // 추가된 요소 개수 출력 todos - ['우유 구매', '업무 메일 확인하기', '필라테스 수업', '저녁 식사 준비하기' , '피아노 연습하기']
배열 요소 제거하기(인덱스를 기반으로 제거)
배열.splice(인덱스, 제거할 요소의 개수)
const itemsA = ['사과', '배', '바나나'] - undefined itemsA.splice(2,1) // 배열의 2번째 인덱스로부터 1개 요소 제거 - ["바나나"] // 제거된 요소가 배열로 리턴됨 itemsA - ["사과", "배"] // 바나나 요소 제거됨
배열 요소 제거하기(값을 기반으로 제거)
const 인덱스 = 배열.indexOf(요소)
배열.splice(인덱스, 1)
const itemsB = ['사과', '배', '바나나'] - undefined const index - itemsB.indexOf('바나나') - Undefined index - 2 // 배열 내부의 바나나의 인덱스 출력 itemsB.splice(index, 1) - ["바나나"] // 배열 2번째 인덱스에 있는 1개의 요소 제거 itemsB - ["사과","배"] // 바나나 제거됨 itemsB.indexOf('바나나') - -1 // 바나나가 배열에 없으므로 -1 출력
기본 숙제 ( 자료의 비파괴와 파괴)
의미
- 비파괴적 처리 : 처리 후에 원본 내용이 변경되지 않음
- 파괴적 처리 : 처리 후에 원본 내용이 변경됨
장점과 단점
- 비파괴적 처리 장점 : 자료를 보호할 수 있음
- 비파괴적 처리 단점 : 메모리를 낭비할 수도 있음
- 파괴적 처리 장점 : 메모리를 절약할 수 있음
- 파괴적 처리 단점 : 원본이 사라지기 때문에 위험할 수 있음
예문
비파괴적 처리
const a = "안녕" const b = "하세요" const c = a+b // c에 a와 b를 합친 문자열 저장 c - "안녕하세요" a - "안녕" // a의 내용이 바뀌지 않음 b - "하세요"// b의 내용이 바뀌지 않음
파괴적 처리
const array = ["사과", "배", "바나나"] array.push("귤") // 배열 뒷부분에 "귤" 요소 추가 - 4 // 추가한 후의 배열 길이 출력 array - ["사과", "배", "바나나", "귤"] // 원본 array의 내용이 바뀜
추가 숙제(173pg 3번 문제)
1번 : 비파괴적 처리
const strA = "사과,배,바나나,귤" - undefined strA.split(",") // ,에 따라 나눠서 배열로 만듬 - ["사과", "배", "바나나", "귤"] strA - "사과,배,바나나,귤" // strA의 값이 변하지 않았으므로 비파괴적 처리
2번 : 파괴적 처리
const arrayB = ["사과", "배", "바나나", "귤"] - undefined array.push("감") // 감 요소 추가 - 5 arrayB - ["사과", "배", "바나나", "귤", "감"] // arrayB의 값이 변했으므로 파괴적 처리
3번 : 비파괴적 처리
const arrayC = [1,2,3,4,5] - undefined arrayC.map((x) => x*x) // arrayC의 각 값 변환 - [1,4,9,16,25] arrayC - [1,2,3,4,5] // arrayC의 값이 변하지 않았으므로 비파괴적 처리
4번 : 비파괴적 처리
const strD = " 여백이 포함된 메시지 " - undefined strD.trim() // 공백제거 - "여백이 포함된 메시지" strD - " 여백이 포함된 메시지 " //strD의 값이 변하지 않았으므로 비파괴적 처리
4-2 반복문
반복문 종류
- for in 반복문
- for of 반복문
- for 반복문
- while 반복문
이 외
- break 키워드
- continue 키워드
for 반복문
기본 형태
for(let i = 0; i < 반복횟수; i++){
문장
}예제
<script>
for(let i=0;i<5;i++){
console.log(`${i}번째 반복입니다.`)
}
</script>결과
0번째 반복입니다.
1번째 반복입니다.
2번째 반복입니다.
3번째 반복입니다.
4번째 반복입니다.
while 반복문
기본 형태
while (불 표현식) {
문장
}무한루프 : 조건을 거짓으로 만들 수 있는 내용이 문장에 없어 반복문이 무한 반복 되는 것
예제
<script>
let i = 0
while (true) {
alert(`${i}번째 반복입니다.`)
i=i+1
}
</script>결과
89번째 반복입니다.
