프로그래밍과 데이터 in javaScript -배열-

배열

대괄호로 값들만 쉼표로 나열

요소(엘리먼트): 배열 안에 있는 값
인덱스: 각 요소 별로 순서를 알려주는 숫자
인덱싱 indexing - 인덱스를 통해서 요소에 접근하는 것
배열 요소 접근 - 배열이름[index];

 

배열 다루기

length프로퍼티 - 배열이 가지고 있는 요소의 총개수를 표현

console.log(members.length); //점표기법
console.log(member['length']); //대괄호표기법

members.length - 1  //배열의 마지막요소를 뜻함

배열에 요소 추가, 수정하기
수정: 존재하는 요소에 값을 할당 ex) member[4] = "d";
추가: 존재하지 않는 요소에 새로운 값 할당 ex) member[6] = "a";

 

요소 추가 시 주의사항
존재하지 않는 요소에 접근하면 undefined가 출력
인덱스의 순서를 뛰어넘어 추가하게 되면 undefined값을 가진 요소가 자동 생성

배열 메소드1
배열은 JS에서 미리 만들어둔 객체이므로 다양한 메소드들이 존재.

상기) 메소드: 프로퍼티 값이 함수

splice(삭제할index,삭제할갯수,추가할요소,...);

let a = [1,2,3,4,5,6];

a.splice(4); //4번인덱스 이후의 모든 요소들이 삭제됨
console.log(a); // [1,2,3,4]

a.splice(1,2); //1번 인덱스부터 시작해 요소 2개 삭제
console.log(a); // [1,4]

a.splice(1,1,2,3); //1번 인덱스부터 요소 1개 삭제하고 2,3추가
console.log(a); // [1,2,3]

Tip) splice메소드의 두 번째 파라미터에 0을 준다면 배열의 요소를 추가할 수 있고, 수정도 가능.

배열 메소드2
배열의 양 끝 부분의 요소 하나만 다루는 경우 유용한 메소드

//배열의 첫 요소를 삭제: shift()
//배열의 가장 첫 요소를 삭제하고, 나머지 요소들은 앞으로 밀어줌
members.shift();

//배열의 마지막 요소를 삭제: pop()
members.pop();

//배열의 첫 요소로 값 추가: unshift(value)
members.unshift('값');

//배열의 마지막 요소로 값 추가: push(value)
members.push('값');

 

배열에서 특정 값 찾기

indexOf(item) / lastIndexOf(item)
/*
포함되어 있다면 item가 있는 인덱스 리턴
여러번 포함 시 처음 발견된 인덱스 리턴
포함되지 않는다면 -1 리턴
*/

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.indexOf('Kakao')); //1  //앞부터 탐색
console.log(brands.indexOf('Daum')); //-1
console.log(brands.lastIndexOf('Kakao')); //3 //뒤부터 탐색

 

배열에서 특정 값이 있는지 확인

includes(item) //item이 있을 경우 true, 없을 경우 false리턴

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
console.log(brands.includes('Kakao')); //true
console.log(brands.includes('Daum')); //false

 

배열 뒤집기

let brands = ['Google', 'Kakao', 'Naver', 'Kakao'];
brands.reverse();
console.log(brands); //(4) ["Kakao", "Naver", "Kakao", "Google"]

 

더 많은 메소드 정보 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array

Array - JavaScript | MDN

for... of반복문
배열을 다루는 반복문으로 배열도 객체이지만 for...in문 대신 for... of 권장

for...in문은 프로퍼티 네임, for...of문은 배열의 각 요소가 변수에 할당

for...in문 사용시 프로퍼티 값이 함수라면 의도치 않는 값이 발생할 수 도 있음

for (변수 of 배열) {
  동작부분;
}
반복될 때마다 배열의 각 요소가 변수에 할당된다.

다차원 배열
배열의 요소에 배열이 들어가는 형태
배열 - 값들의 의미 < 값들의 위치나 순서
객체 - 값들의 의미 > 값들의 위치나 순서

let a = [[1,2], [3,4]];

다차원 배열 요소 접근
console.log(a[0]); // [1,2]
console.log(a[0][1]); // 2

let f = {
	'채소층' : ['참외','토마토'],
	'과일층' : ['사과','바나나'],
	'얼음층' : ['얼음'],
	'아이스크림층' : ['비비빅']
};
console.log(f['채소층'][0]); // 참외