JS - 배열의 이해

배열이란 하나의 변수에 여러 값을 저장할 수 있는 공간을 말하고, 이러한 값을 원소라고 부릅니다.

객체와 배열의 차이점은 변수명 뒤에 붙는 [ ... ] 인 것을 배열이라 하고, { ... } 인 것을 객체라 부릅니다. 객체에는 키(key) 와 원소(value) 값을 가지고 있고, 배열에는 원소(value)만 갖고 있습니다.

{ ... } 로 시작하는 것을 객체라 부릅니다.

var vars = {"key": "value",  "key2": "value2" .... };

이것은 배열입니다.

var vars = ["value", "value2" .... ];
var vars = Array("value", "value2" .... );

배열에는 이름이 따로 없고, 숫자로 이루어진 인덱스만 있다는 점이 객체와 다릅니다. 물론, 배열에는 정수형, 실수형, 문자열 등 다양한 데이터 타입이 들어갈 수 있습니다.

<script>
 var vars = [1, "value", true, 3.14, [1, 2, 3]];

 document.write( vars[0] );    // 1
 document.write( vars[1] );    // value
 document.write( vars[2] );    // true
 document.write( vars[3] );    // 3.14
 document.write( vars[4] );    // 1,2,3
 document.write( vars[4][0] ); // 1
 document.write( vars[4][1] ); // 2
 document.write( vars[4][2] ); // 3

 // 1차원 배열의 수
 document.write( vars.length ); // 5
 // 2차원 배열은 5번째이고, 배열의 수는 3개
 document.write( vars[4].length ); // 3
</script>

빈 배열로 초기화하고, 1차원 배열에 값을 넣습니다.

var var1 = [];
var var2 = Array();

var1[0] = "하";
var1[1] = "보";
var1[2] = "니";
var1[3] = " ";

var2[0] = "P";
var2[1] = "H";
var2[2] = "P";

// 두 배열을 하나로 합침니다.
document.write( var1.concat(var2) ); // 하,보,니, ,P,H,P

2차원 배열을 만듭니다.

<script>
 // [ [0], [1], [2], [3] ]
 var var1 = [[], [], [], []];
 // Array( Array(0), Array(1), Array(2) )
 var var2 = Array(Array(), Array(), Array());
 // [ [0], [1], [2], [3], [4] ]
 var var3 = [[], [], [], [], []];


 var1[0][0] = "하";
 var1[1][0] = "보";
 var1[2][0] = "니";
 var1[3][0] = " ";

 var2[0][0] = "P";
 var2[1][0] = "H";
 var2[2][0] = "P";

 // 두 배열을 하나로 합침니다.
 document.write( var1.concat(var2) ); // 하,보,니, ,P,H,P



 var3[4][0] = "hello";
 document.write( var3[4][0] ); // hello

 // 배열의 수는 5개인데, 6번째 배열을 호출하면 에러가 나옴. 
 var3[5][0] = "world";
 document.write( var3[5][0] ); // 에러
</script>

3차원 배열을 만듭니다.

<script>
 // [ [ [0] ], [ [1] ] ]
 var var1 = [[[]], [[]]];
 // Array( Array( Array(0) ), Array( Array(1) ), Array( Array(2) ) )
 var var2 = Array(Array(Array()), Array(Array()), Array(Array()));

 var1[0][0][0] = "하";
 var1[1][0][0] = "보";

 var2[0][0][0] = "P";
 var2[1][0][0] = "H";
 var2[2][0][0] = "P";


 // 두 배열을 하나로 합침니다.
 document.write( var1.concat(var2) ); 
 // 하,보,P,H,P
</script>