[JavaScript] 자바스크립트 배열(Array) 생성 및 사용법 쉽게 정리

자바스크립트에서 배열을 만드는 방법 2가지

  • 배열 리터럴 대괄호([ ])를 사용하여 만드는 방법
  • Array() 생성자 함수로 배열을 생성하는 방법

 

배열 리터럴 대괄호([ ])를 사용하여 만드는 방법

// 배열 생성 (빈 배열)
var arr = []; 

arr[0] = 'zero';
arr[1] = 'one';
arr[2] = 'tow';

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}    

 

// 배열 생성 (초기 값 할당)
var arr = ['zero', 'one', 'tow']; 

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

 

// 배열 생성 (배열 크기 지정)
// 쉼표 개수만큼 크기가 지정됨
var arr = [,,,]; 

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}
        
// 값이 할당되지 않아서 undefined 3번 출력       

 

Array() 생성자 함수로 배열을 생성하는 방법

// 배열 생성 (빈 배열)
var arr = new Array(); 

arr[0] = 'zero';
arr[1] = 'one';
arr[2] = 'tow';

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}     

 

// 배열 생성 (초기 값 할당)
var arr = new Array('zero', 'one', 'tow'); 

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}     

 

// 배열 생성 (배열 크기 지정)
// 원소가 1개이고 숫자인 경우 배열 크기로 사용됨
var arr = new Array(3); 
        
for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}
        
// 값이 할당되지 않아서 undefined 3번 출력        

 

배열 리터럴을 사용하여 생성하는 방법과 Array() 생성자 함수를 사용하여 생성하는 방법의 거의 동일하다. 배열 리털를을 사용하여 배열을 생성하더라도 내부적으로 Array() 생성자 함수를 사용하여 생성하므로 기능상의 차이는 없으며, 배열 리터를이 조금 더 간소화된 문법이다.

 

자바스크립트에서는 배열을 사용 시 배열 리터럴([])을 사용할 것을 권장 한다.

 

자바스크립트 배열이 다른 언어와 다른 점 2가지

  • 배열 내부의 데이터 타입이 서로 다를 수 있다
  • 배열의 크기는 동적으로 변경될 수 있다
// 서로 다른 데이터 타입을 담을 수 있다
var arr = [1234, 'test', true];     

 

var arr = [1234, 'test', true];

// 배열의 크기를 임의로 변경( 3 -> 5 )
// arr[3], arr[4]는 값이 할당 되지 않았기 때문에 undefined
arr.length = 5; 

// 새로운 배열을 추가하면 크기는 자동으로 변경 ( 5 -> 6 )      
arr[5] = 'apple'; 

// 새로운 배열 추가로 크기 변경 ( 6 -> 7 )       
arr.push('banana');  

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

//////////////////////////////////
// 출력 결과
//////////////////////////////////
1234
test
true
undefined
undefined
apple
banana

자바스크립트의 배열은 변수 외에도 객체와 함수도 담을 수 있고, 배열이 생성되면 배열의 크기는 임의로 변경이 가능하며 이미 할당된 값은 사라지지 않는다. 자바스크립트의 배열은 제약사항이 적어서 자유롭게 사용할 수 있지만 사용 시 많은 주의를 기울여야 한다.

 

 

댓글

Designed by JB FACTORY