Java 의 Vector 클래스는 내부적으로 배열을 사용하고 있다. 따라서 Vector 의 자바스크립트 버전을 만들기 위해서는 Array 객체에 대한 빵빵한 지식이 필요하다 (없어도 된다. 그러나 있으면 매우 좋다). 자! 배열의 기초와 유용한 메쏘드들을 살펴보자.
배열의 생성
1. 생성자를 이용한 생성
- new Array(arrayLength)
ex) friends = new Array(3); // 크기가 3 인 배열 생성
- new Array(element0, element1, ... , elementN)
ex) friends = new Array("개똥이", "소똥이", "말똥이"); // 크기 3인 배열 생성(값이 채워짐)
2. 직접 생성
friends = ["개똥이", "소똥이", "말똥이"];
간접적인 배열 길이의 증가
배열의 길이는 현재 배열의 길이보다 큰 인덱스를 사용하면 자동으로 증가한다. 아래는 배열의 길이가 0 인 객체 생성 후 99번째 요소에 값을 할당하여 배열의 길이가 100 으로 증가한 예이다.
friends = new Array();
friends[99] = "새똥이";
메쏘드 종류
concat : 두개의 배열을 합쳐 새로운 배열을 리턴한다. 원본 배열은 변하지 않는다.
문법
arrayName.concat(arrayName2, arrayName3, ... , arrayNameN)
인자
arrayName2, ... , arrayNameN - 합쳐질 인자들
예제
두 배열을 합치는 예
alpha = new Array("a", "b", "c");
numeric = new Array(1, 2, 3);
alphaNumeric = alpha.concat(numeric); // ["a", "b", "c", 1, 2, 3] 배열 생성
join : 모든 요소가 구분자로 이어진 문자열을 리턴한다. 디폴트 구분자는 comma(,) 이다.
문법
arrayName.join(separator)
인자
separator 요소와 요소 사이에 사용될 구분자 문자열
예제
friends = new Array("소똥이", "개똥이", "말똥이");
strFriends1 = friends.join(); // 소똥이,개똥이,말똥이
strFriends2 = friends.join(", "); // 소똥이, 개똥이, 말똥이
strFriends3 = friends.join(" + "); // 소똥이 + 개똥이 + 말똥이
pop : 배열의 마지막 요소를 삭제한 후 그 값을 리턴하고 배열의 크기를 줄인다.
문법
arrayName.pop()
인자
없음
예제
// 말똥이가 pop 되고 배열에는 "개똥이", "소똥이"만 남는다.
// 배열크기도 2로 줄어든다.
friends = ["개똥이", "소똥이", "말똥이"];
popped = friends.pop(); // popped 에 말똥이가 할당된다.
push : 배열에 하나 또는 여러개의 값을 넣고 새로운 배열의 길이를 리턴한다.(배열길이 증가)
문법
arrayName.push(element1, element2, ... , elementN)
인자
element1, element2, ... , elementN - 추가될 요소들
예제
friends = ["개똥이", "소똥이"];
pushed = friends.push("말똥이", "새똥이"); // ["개똥이", "소똥이", "말똥이", "새똥이"]
alert(pushed); // 4
reverse : 배열 요소를 역순으로 재배치한다(첫번째 요소는 마지막으로, 마지막 요소는 처음으로).
문법
arrayName.reverse()
인자
없음
예제
myArray = new Array("1", "2", "3");
myArray.reverse(); // ["3", "2", "1"]
shift : 첫번째 요소를 삭제하고 배열의 길이를 하나 줄인 후, 삭제된 요소를 리턴한다.
문법
arrayName.shift()
인자
없음
예제
friends = ["개똥이", "소똥이", "말똥이"];
shifted = friends.shift(); // ["소똥이", "말똥이"]
alert("삭제된 요소는 " + shifted + " 입니다."); // 개똥이
slice : 얇게 썬 슬라이스 치즈가 생각난다(^^). 배열의 일부를 잘라내어 새로운 배열을 리턴한다.
문법
arrayName.slice(begin[,end]) : [] 은 선택사항임
인자
begin - 0보다 큰 시작 인덱스 (필수)
end - 0보다 큰 끝 인덱스 (선택). 지정되지 않으면 배열의 끝까지 복사된다.
예제
numbers = ["0", "1", "2", "3", "4"];
sliced1 = numbers.slice(2, 3); // ["2"]
sliced2 = numbers.slice(2); // ["2", "3", "4"]
sort : 배열의 요소를 정렬한다.
문법
arrayName.sort([compareFunction])
인자
compareFunction - 정렬방법을 지정한 함수.
생략시에는 요소들의 toString() 값을 사전순서(Dictionary order) 대로 정렬한다.
compareFunction(a, b) 에서
1) a > b : 0 보다 큰 값 리턴
2) a = b : 0 리턴
3) a < b : 0 보다 작은 값 리턴
예제
// 역행 정렬
function descComparator(a, b) {
return b - a;
}
// 순행 정렬
function ascComparator(a, b) {
return a - b;
}
numbers = ["0", "1", "2", "3", "4"];
numbers.sort(); // ["1", "2", "3", "4", "5"]
numbers.sort(ascComparator); // ["1", "2", "3", "4", "5"]
numbers.sort(descComparator); // ["4", "3", "2", "1", "0"]
splice : 이전 배열요소를 삭제하고 새로운 내용물을 추가하는 형태로 배열 내용을 변경한다. 삭제된 요소들은 리턴된다. Vector 와 유사한 기능을 하므로 숙지하자.
문법
arrayName.splice(index, howMany, [element1][, ..., elementN])
인자
index - 변경하고자 하는 요소의 시작 인덱스
howMany - 삭제하고자 하는 이전 배열요소 갯수.
element,...,elementN - 추가하고자 하는 배열 요소들
예제
// numbers[2]부터 2개("2", "3")를 삭제하고 그 자리에 "5"와 "6" 을 삽입한다.
numbers = ["0", "1", "2", "3", "4"];
spliced = numbers.splice(2, 2, "5", "6"); // ["0", "1", "5", "6", "4"]
alert(spliced); // "2", "3"
unshift : 하나 또는 여러개의 요소를 배열의 왼쪽에 추가한다. 배열길이는 증가한다.
문법
arrayName.unshift(element1,..., elementN)
인자
element1,...,elementN - 배열의 앞쪽에 들어갈 요소들
예제
numbers = ["0", "1", "2"];
numbers.unshift("-2", "-1"); // ["-2", "-1", "0", "1", "2"]
아거거.. 기양 써내려가는 글이 아닌 레퍼런스 문서를 만드는 것은 역시 힘들고 지루하다..
아는것이 힘이다. 많이 참고하시길..
자바스크립트의 array는 배열 기능뿐만 아니라 스택처럼 쓸수가 있다. 그외에도 다양한 기능이 가능하다.
확실히 고급 언어임에는 틀림이 없는 듯...
아잉push 너무 좋앙!!