Chapter1. 배열
1-1 배열
1-2 배열의 반복
1-3 배열 메서드
이전엔...
하나의 변수에 하나의 값만 넣을 수 있었음 -> 여러 개의 데이터를 한번에 처리 불가능, 매번 새로운 변수를 선언
배열과 객체는 단 한번의 선언으로 대량의 데이터를 쉽게 다룰 수 있음.
Chapter1. 배열(Array)
학습목표
- 배열에서 특정 인덱스(index)의 요소(element)를 조회하거나, 변경할 수 있다.
length속성을 이용하여 배열의 길이를 조회할 수 있다.- 배열의 요소가 배열인 이중 배열을 이해하고, 이중 배열의 요소를 조회하거나 변경할 수 있다.
- 배열의 각 요소에 대하여, 반복하는 코드를 실행시킬 수 있다.
- 배열에서 사용되는 다양한 메서드를 알고 사용할 수 있다.
split(),join(),slice(),splice(),Array.isArray(),push(),unshift(),pop(),shift(),indexOf(),includes()
다량의 데이터를 다룰 수 있는 데이터 타입
- 순서(인덱스 index)가 있는 값(요소 element)
- 1이 아닌 0부터 번호를 매김
- 대괄호(square bracket)을 이용해 배열을 만든다
- 각각의 원소(element)는 쉼표로 구분한다.
인덱스 조회
let myNumber = [73, 98, 86, 61, 96];
// "myNumber라는 배열의 3번째 인덱스"를 조회하려면
MyNumber[3]; // 61인덱스 변경
let myNumber = [73, 98, 86, 61, 96];
// "myNumber라는 배열의 3번째 인덱스"의 값을 변경하려면
myNumber[3] = 200;
myNumber; // [73, 98, 86, 200, 96];인덱스를 벗어나면 undefined가 출력됨
배열을 안쪽에 중첩시켜서 사용가능 = 행렬을 배열로 표현가능
let myNumber = [[13, 30], [73, 8], [44, 17]];
myNumber[1][0]; // 73배열로 할 수 있는 것
온점(dot)을 이용해 변수가 가지고 있는 속성(property)에 접근 가능
온점을 이용해 관련된 명령(methode)도 실행가능.
1. 길이 알아내기 : myNumber.length;
2. 요소(element) 추가 : myNumber.push(96);
3. 배열의 마지막 요소 삭제 : myNumber.pop(96);
4. 배열의 첫번째 요소 삭제 : myNumber.shift(96);
5. .splice(없애고 싶은 Index, 없애고 싶은 Index로부터 몇개를 제거할지, 제거하고 추가할것)
arr.length : 배열의 길이가 0인지 확인하여 빈 배열임을 확인 가능
Array.isArray(arr) : 배열인지 여부확인, 빈 배열인지 확인하는 방법으론 적절하지 않음
.shift : 배열의 첫 번째 요소를 제거하고 첫 번째 요소를 리턴함.
.unshift : 배열의 첫 번째 요소를 추가하고 배열의 length를 리턴함
- 원본 배열을 변화시킴. 원본 배열인 arr은 unshift 메서드로 요소가 추가되었음
- 따라서 arr을 리턴하면 요소가 추가된 배열을 리턴함
.slice: 원본 배열을 변경하지 않고 새로운 배열을 복사하거나 지정범위만큼 잘라 사용
-
ex) array.slice(0, n); 0번째 요소부터 n번째 요소의 앞 요소까지를 복사해 새로운 배열을 만들어 리턴함
-
만약 slice() 전달값을 넣지 않을 경우엔, 똑같이 복제됨.
📌 배열의 반복
배열과 반복문을 조합하는 경우는 매우 많다.
반복문을 이용해 배열의 요소를 한번씩 출력
let myNum = [73, 98, 86, 61];
// 조건:
1. 숫자(n)는 0부터 시작
2. 숫자를 배열의 길이보다 작을 때까지 반복
3. 숫자는 1씩 증가한다.
for(let n = 0; n < myNum.length; n++;) {
console.log(myNum[n]); // 배열 myNum의 n번째 인덱스 출력
}모든 요소를 누적해서 더하기
let myNum = [10, 20, 40, 10];
let sum = 0;
for (let n=0; n < myNum.length; n++) {
// 첫번째 반복땐 0 + 10 -> sum + myNum[0]
// 두번째 반복땐 10 + 20 -> sum + myNum[1]
// 세번짼 30 + 40
// 마지막은 70 + 10
sum = sum + myNum[n];
} 📌 배열 메서드
Array.isArray(): 배열 여부 판별
input엔 검사하고 싶은 객체, 결과는 true / falseconsole.table(arr): index와 value를 표로 나타냄.push(): 기존 array 뒤에 element 추가.pop(): 기존 array 뒤의 element 삭제.unshift(): 기존 array 앞에 element 추가.shift():기존 array 앞의 element 삭제.indexOf(): 배열 안에 특정 요소가 존재하는지 검사.
배열 안에 요소가 있으면 Index, 없으면 -1 출력
let words = ['Radagast', 'the', 'Brown'];
words.indexOf('Brown') // 2 출력
만약 없는 element를 넣게 되면
words.indexOf('없는단어') // -1 출력 .includes(): 배열 안에 특성요소가 존재하면 true, 없으면 false
Internet Explorer에선 작동하지 않고 에러가 뜸. 호환성 측면에선 indexOf가 좋다.
