[ JavaScript ] 배열

배열이란

순서가 있는 값으로 []를 이용해서 만들고 각 엘리먼트는 ,(쉼표)로 구분해준다
배열은 여러값을 저장해서 다량의 데이터를 한번에 다루기 용이하다는 장점이 있다

let isNum = ['10', '20', '30', '40', '50'];

배열안의 각 엘리먼트의 순서는 인덱스라고 부르고, 이때 인덱스는 0으로 시작
따라서 1번째 인덱스 엘리먼트는 10이 아니라 20이 됨

isNum이라는 배열의 3번째 인덱스를 조회하고 싶으면

isNum[3]; // 40
isNum[8]; // undefined -- 배열에서 존재하는 인덱스에서 벗어난 엘리먼트 조회

isNum 배열의 3번째 인덱스의 엘리먼트를 변경하려고 하면

isNum[3] = 80 ;
isNum의 배열은 ['10', '20', '30', '80', '50'] 이 된다

let myNum = [[2,14] , [3,15], [4,16]];

배열 안에 배열이 존재하는 경우

myNum[1]; // [3, 15] --myNum배열의 1번째 인덱스
muNum[1][0]; // 3 -- myNum배열의 1번째 인덱스에 있는 배열에서 0번째 인덱스 

배열의 반복

배열의 요소를 한번씩 출력하기

let numNew = [10, 20, 30, 40, 50]

인덱스가 0으로 시작하기 때문에

1. 0번부터
2. 배열길이의 -1번까지 혹은 배열길이 미만까지
3. 숫자를 하나씩 증가시키면

배열을 순서대로 하나씩 출력할 수 있음

for(let n = 0; n < numNew.length; n++){
	console.log(numNew[n]);
}

배열의 요소를 모두 더하기

위와 조건은 동일하지만 출력이 아니라 합산해야한다는 점에서 다름

let sum = 0; //초기값을 설정하지 않으면 undefinde에 다음 값을 더하게 됨
for(let n = 0; n < numNew.length; n++){
	sum = sum + numNew[n];
}

배열 판별하기

let words = ['a','b','c']

typeof 연산자로 판별 했을 때 words는 object로 판별 //배열
let obj = { a:1 } 의 경우도 object로 판별 //객체

따라서 객체와 배열을 구분할 수 없음
배열을 판별하기 위해서 Array.isArray()를 사용

Array.isArray(words) -- true
Array.isArray([]) -- true //비어있어도 참으로 판별

배열의 엘리먼트

엘리먼트 추가/제거

let arr = ["pineapple", "banan", "mango"]

arr.push("melon") -- 뒤에 엘리먼트 추가
arr.pop() -- 뒤에 위치한 엘리먼트 삭제
arr.unshift("apple") -- 앞에 엘리먼트 추가
arr.shift() -- 앞에 위치한 엘리먼트 삭제

순서대로 아래와 같이 결과값을 받음
이 네가지는 원본의 배열을 변경하는 매소드임
let arr = ["pineapple", "banan",  "mango", "melon"]
let arr = ["pineapple", "banan"]
let arr = ["apple", "pineapple", "banan", "mango"]
let arr = ["banan", "mango"]

엘리먼트 검사

let words = ['a', 'b', 'c']

words.indexOf('b') -- 1 (배열의 1번째 인덱스에 위치)
words.indexOf('c') -- 2 (배열의 2번째 인덱스에 위치)
words.indexOf('f') -- -1 (없는 엘리먼트를 찾을때 -1로 나옴)

따라서 배열안에 엘리먼트 존재를 검사할 때
words.indexOf('엘리먼트') !== -1 이 true면 있는 엘리먼트

이 내용을 바탕으로 엘리먼트 검사하는 함수를 만들어 볼 수 있음

function hasElement(arr, element){
	let isPresent = arr.indexOf(element) !== -1;
    return isPresent;
 } //결과는 true나 false로 반환

이미 존재하는 includes라는 매소드를 사용해도 엘리먼트 검사 가능
브라우저 호환성때문에 추천하지 않음

words.includes('a') //true