Javascript 배열 (Array)의 기본 개념, 인덱스(index)와 메소드(method)

일단 배열은 순서가 있는 값이라고 생각하면 된다.

 

배열 내에서의 순서는 인덱스라고 칭하며, 1이 아닌 0부터 시작한다.

 

[0]	[1]	[2]	[3]	[4]	[5]	[6]
84	49	34	45	43	39	94

위의 표에서 인덱스(Index)는 검정 박스이고, 그 밑은 요소(element)이다.

 

배열은 대괄호(square bracket)을 통해 만들 수 있으며, 각각의 원소(element)는 쉼표(comma)로 구분이 가능하다.

 

let number = [84, 49, 34, 45, 43, 39, 94]

 

위의 코드에서 대괄호 안에 있는 45는 number라는 배열의 3번째 인덱스 값은 45라고 표현할 수 있다.

 

let number = [84, 49, 34, 45, 43, 39, 94]

number[3]; // 45
number[3] = 4000; // 4000

number; // [84, 49, 34, 4000, 43, 39, 94]

 

인덱스를 통해 배열의 값을 도출할 수 있으며, 새로운 값을 할당하여 변경할 수 있다.

이차원 배열

let number2 = [[4, 5], [9, 23], [28, 46]]

number2[0]; // [4, 5]
number2[0][0]; // [4]

number2[0][0] = 342; 
number2; // [[342, 5], [9, 23], [28, 46]]

 

배열 속에 또 다른 배열이 있을 수 있다. 배열 속 배열의 값을 도출하고 싶다면, 위와 같이 인덱스를 중복하여 작성할 수 있으며, 이차원 배열 뿐만이 아니라 3차원 배열도 있다.

 

배열 메소드 (Array Method)

arr.length

let number = [84, 49, 34, 45, 43, 39, 94];

number.length; // 7

 

배열의 길이를 알아낼 수 있다.

arr.push()

let color = ['red', 'yellow', 'orange', 'blue'];

color.push('mint');

color; // ["red", "yellow", "orange", "blue", "mint"]

 

배열의 끝에 하나 이상의 요소를 추가한다.

arr.pop()

let color = ['red', 'yellow', 'orange', 'blue', 'mint'];

color.pop();

color; // ["red", "yellow", "orange", "blue"]

 

push와는 반대로 배열의 제일 마지막 요소를 삭제 할 수 있다.

arr.shift()

let color = ['red', 'yellow', 'orange', 'blue'];

color.shift();

color; // ["yellow", "orange", "blue"]

 

0번째 인덱스를 제거할 수 있다.

arr.unshift()

let color = ['red', 'yellow', 'orange', 'blue'];

color.unshift('white');

color; // ["white", "red", "yellow", "orange", "blue"]

 

0번째 인덱스를 추가할 수 있다.