배열변수 사용

Javascript의 배열변수(Array)는 광범위하게 사용되고, 융통성이 좋다.

광범위하다는 의미는 개체나 속성이나 여러개의 요소들이 같은 패턴으로 되어 있을 때는 거의 모두 배열변수를 활용하여 데이터를 저장하고 참조된다.

forms elements options arguments anchors links String
history images applets layersNetscape embeds plugins

융통성이 좋다는 의미는 데이터의 내용에따라 인수나 배열변수의 길이를 자동적으로 갱신하므로 편리하게 사용될수 있다는 의미이다. 배열변수 요소 번호를 지정할 때 번호를 건너뛰기해도 된다.

어떤 배열변수의 요소가 세 개이고 인덱스 번호가 각각 0,1,2일 때 3에서 49까지 요소를 추가할 필요없이 인덱스 번호가 50인 요소를 바로 만들 수 있다. 배열변수의 길이 속성은 4가 아닌 51로 설정된다.


Javascript에서는 개체와 배열변수가 대부분 서로 동일하다. 주요 차이점 두 가지는 보통 개체는 자동 길이 속성을 가지지 않고 배열변수는 속성과 개체 메서드를 가지지 않는다는 것이다.


상세한 설명은 Array 개체와 내장 개체를 참고하라.

배열변수 인수 지정

대괄호 '[index]'를 사용하여 배열변수에 인수를 지정한다.
배열변수의 제일 처음 인수는 [0]이고, 마지막 인수는 [요소의길이-1]이다.
배열변수의 요소의 길이는 length 속성으로 알수 있다.

대괄호 안에는 정수를 계산하는 식 또는 숫자 값을 입력할 수 있다.

<SCRIPT>
var myArray=new Array('일','월','화','수','목','금','토'); // 새로운 배열변수를 생성하고 값을 할당한다.
onData=myArray[1]; // 인수로 배열변수 값을 불러 변수에 할당한다.
document.write('myArray[1]=',onData,'<BR>myArray[6]=',myArray[6],'<BR>'); // 인수를 사용하여 배열변수를 출력하다.
document.write('배열변수의 요소의 길이는 ',myArray.length,'<BR>'); // 배열변수 길이를 출력한다.
document.write('오늘은 ',myArray[new Date().getDay()],'요일');
  // 현재 날자의 요일값을 얻어 배열변수에서 인수로 사용하여 현재 요일을 출력한다.
</SCRIPT>
연상식 배열변수로서의 개체

연상식 배열변수란 임의의 데이터 값을 임의의 문자열과 동적으로 연결시키는 데이터 구조이다.
여기에서 속성의 이름은 식별자이며, 보통 도트(점) 연산자 '.'를 사용하여 개체의 속성에 접속한다.

myObject.oneProperty

인덱스 연산자 []를 사용해서 개체의 속성에 접속할 수도 있으나, 여기에서는 연상식 배열변수로 개체를 다룬다. 배열변수 인수로 사용할 때는 속성명을 인수로 사용하면 된다.

myObject[oneProperty] // 위 구문과 같다.

인덱스 연산자를 사용하는 것이 배열변수 요소 접속에 좀더 일반적으로 연관되어 있지만 개체와 함께 사용될 경우 인덱스는 항상 문자열 리터럴로 표현된 속성 이름이 되므로 도트 연상식 배열변수도 사용된다.

다음은 개체 속성에 접속하는 두 가지 방법의 중요한 차이점이다.

연산자속성 이름속성 이름의 의미
도트obj.prop식별자데이터로 조작 불가
인덱스obj[prop]리터럴 문자열데이터로 조작 가능

런타임까지 속성 이름을 모를 때(예: 사용자 입력에 따라 개체를 구성할 때) 이러한 차이점은 매우 유용하다.

연상식 배열변수에서 모든 속성을 추출하려면 for...in... 루프를 사용한다.

<SCRIPT>
var myArray=new Array(); // 새로운 배열변수를 만든다.
myArray.name='홍길동'; // 개체의 속성을 지정한다. 배열변수 요소로 등록된다.
myArray.gender='남';
myArray.birth='2000';

document.write('myArray.name="',myArray.name,'"<BR>'); // 개체의 속성을 출력한다.
document.write('myArray.gender="',myArray.gender,'"<BR>');
document.write('myArray.birth="',myArray.birth,'"<BR><BR>');

for (prop in myArray){ // for...in... 문장을 사용하여 개체의 배열변수 모두를 열거하는 루프를 시작한다.
  document.write('배열변수 속성명 ',prop,'의 값은 myArray['+prop+']="',myArray[prop],'"<BR>');
    // 개체의 속성을 배열변수로 접속하여 내역을 출력한다. 인수는 속성명인 문자열이 된다.
} // 루프를 종료한다.
</SCRIPT>