loading

자바스크립트(javascript) - 배열(Array) 인덱스 다양한 사용법

 

 

 

자바스크립트에서의 배열은 기본 베이스처럼 생각하면서 개발을 할 때,

거의 필수 적으로 사용을 한다.

사용을 하면서 항상 해왔던 방식, 항상 기본적으로 사용했던 방식

 

배열의 인덱스에 값을 넣어서 일반적으로 사용을 해왔다.

그러나 자바스크립트에서는 배열도 객체 이기 때문에 일반적인 사용법 외에

key와 value 값으로도 사용을 할 수 있다.

 

그리고 인덱스 값에 string 값인 숫자를 넣으면 또 어떻게 되는지 등등,

배열을 사용하면서 자세히 알아보지 않으면

 

실수할만한 내용들 또 배열은 아니지만 배열의 형태를 띤 객체에 대해서

배열로 변경해서 사용하는 방법 등을 알아보고 내용을 정리해보자.

 

 

▶일반적인 배열 사용법

var A = [];

A[0] = 10;
A[1] = 'JS';

console.log(A.length); // 2
console.log(A[0]); // 10


var B = [1,2, [10]];

console.log(B.length); // 3
console.log(B[2][0]); // 10


var C = [];

C.push('a');
C.push(10);

console.log(C.length); // 2
console.log(C[1]); // 10

 

우린 배열을 기본적으로 이렇게 사용을 한다.

A라는 배열을 선언하고 거기에 인덱스 값 0, 1, 2, 3 등등 지정을 해서

해당 인덱스의 배열에 값을 넣어서 사용을 하고,

 

B라는 배열에 쭉, 나열해서 값을 넣어서 사용을 한다.

그리고 C라는 배열을 선언하고 push라는 배열 메서드를 이용해서 값을 넣어서 사용을 하기도 한다.

 

하지만 이 방법 외에 자바스크립트에선 key와 value 값으로 값을 넣어서 사용도 가능하다.

예를 확인해보자.

 

 

▶Key와  value 값으로 배열 사용법

var A = []; // 배열 선언

A[0] = 10; // 배열 0번째 

A['JS'] = '개발'; // ?????

 

A의 0 번째 인덱스에 값을 넣어서 사용하는 건 위에서 설명했듯 일반적인 사용법이긴 한데...

아래 인덱스 넣는 곳에? string 문자열 값으로 인덱스를 지정해서 값을 넣었다.

 

자바스크립트는 이렇게도 사용이 가능하다...

자 이제 그럼 위 상황을 고려해서 배열의 값이 어떻게 들어가 있는지 console.log로 확인해보자.

 

console.log(A[0]); // 10

console.log(A['JS']); // 개발



console.log(A.length); // 1
console.log(A); // 10

 

배열 A의 길이를 보면 예상외로 2가 나올 줄 알았는데 1 이 나왔다.

즉, 배열은 인덱스 값만 넣은 것만 length로 취급하고 있다.

 

이것처럼 문자열 가지고 인덱스에 사용은 가능하지만,

이렇게 사용하는 것은 추천하지 않는다.

A 배열을 console.log 출력해봐도 [0]에 넣은 숫자 인덱스의 값만 출력되기 때문에

 

개발하면서 코딩은 자연스레 길어지고 또는 배열은 for문과 함께 사용을 많이 하는데

저렇게 문자열로 인덱스에 넣어서 사용을 하면 내가 문자열로 넣었던 것을 계속해서

기억하고 사용해야 하기 때문에...

 

그래서 배열은 배열답게 인덱스에 숫자를 넣어서 사용을 하자.

 

 

▶배열 인덱스에 string 값의 숫자를 넣어서 사용

위에서 인덱스에 문자열 값을 넣어서 사용을 해봤는데,

이번엔 문자열 값이 숫자라면? 어떤 현상이 벌어지는지 알아보자.

 

var A = [];


A['10'] = 5;

console.log(A.length); // 11

 

이 처럼 배열에 문자열로 인덱스를 넣어봤다. 그런데 A의 길이를 확인해보니????

그렇다. 저렇게 문자열 숫자로 인덱스를 지정하면 그냥 인덱스 번호로 지정된다.

 

그래서 A 배열의 길이를 확인해보면 A [10]인 배열의 길이가 11이 나오는 것이다.

배열은 인덱스는 0번부터 시작이니 10번까지 총 11의 길이가 출력이 되는 것이다.

반응형

+ Recent posts