다들 저녁은 드셨는지 모르겠네요..ㅎㅎ 이 강좌를 읽는분들은 어느때인지 모르겠지만 꼭 식사는 챙겨드시기 바랍니다. ㅎㅎ
전 강좌에 이어 이번엔 PJS의 Array부분을 한번 알아보도록 하죠.
Array하면 여러분들은 어떤생각이 떠오르십니까?? 전 iterator / Eunmerable 이 생각납니다. 같은 생각이신가요? 그럼 방향은 충분히 좋습니다.
한번 가보죠.
clear : 배열을 모두 비운다
<script>
var foo = ['sam', 'justin', 'dan'];
foo.clear();
alert(foo);
</script>
실행했을때의 결과는 예상되시죠? 네 빈 배열이 되었습니다.
clone : 배열 복사
<script>
var foo = ['sam', 'justin', 'dan'];
var bar = foo.clone();
alert(bar);
</script>
실행했을때의 결과는 예상되시죠? foo와 같은 배열이 복사되어집니다.
한가지 질문을 해보겠습니다.(저의 강좌를 보셨으면 예상되는 질문이겠죠?)
<script>
var foo = ['1','2','3'];
var bar = foo.clone();
foo[0] = 'a';
alert(bar);
</script>
위의 코드를 실행했을때의 결과는 어떻게 나올까요? 네 그렇습니다. "1,2,3"이 출력됩니다. 이유를 알아볼까요? 전 강좌에서는 오브젝트의 참조변수는 포인터변수처럼 행동한다고 했습니다. 허나 위의 소스에서는 그렇게 행동하지 않는군요. 그렇습니다. clone 메소드의 내부를 잠시 살펴볼까요?
clone: function() {
return [].concat(this);
}
예상하셨나요? 예상하시지 못했다면, 소스코드를 보시고 아시겠습니까? concat 메소드는 새로운 배열 오브젝트를 만들어 냅니다. 여기서 중요한건 "새로운"이란 단어입니다. 새롭기 때문에 clone메소드는 기존의 배열의 참조변수를 만들어 내지않고 새로운 변수를 메모리에 할당여 새로운 값을 가지게 됩니다. 그래서 전 강좌에서 배운데로 bar가 foo의 참조변수가 되지 않고 새로운 일반변수가 되어버린거죠.
compact : null / undefined의 값을 제외하고 새로운 배열 오브젝트 반환
프로그램을 짜면서 사용하게 될까? 하는 의구심을 들게하는 메소드입니다. 전 한번도 배열에 null이나 undefined가 들어간적이 없어서.ㅎㅎ (경험부족인가요?)
<script>
var foo = ['frank', 'sue', 'sally' ,null];
var bar = foo.compact();
alert(bar);
// --> frank, sue, sally
</script>
크게 설명할 부분은 없어보입니다.
each : 쉽게 for문을 연상하시면 될듯합니다.
<script>
var foo = ['1','2','3'];
foo.each(function(val){alert(val)});
</script>
foo 에서 각각 하나씩의 아이템을 빼서 인수로 넘기면 인수에 정의되어 있는 함수가 실행되게 됩니다. for 문과 같은 개념입니다.
first : 배열의 첫번째 아이템을 리턴한다.(단, 배열이 비어있으면 undefined를 리턴한다)
<script>
var foo = ['a', 'b', 'c'];
var bar = foo.first();
// --> 'a'
</script>
flatten : 다중배열을 1차원 배열로 만들어 리턴한다.
<script>
var foo = ['a',['a2','b2'], 'c'];
alert(foo.flatten());
//--> 'a', 'a2', 'b2', 'c'
</script>
from : $A 메소드와 동일한 기능을 수행한다.
<html>
<script type="text/javascript" src="prototype.js"></script>
<body>
<input type='checkbox' id='item1' />
<input type='checkbox' id='item2' />
<input type='checkbox' id='item3' />
<input type='checkbox' id='item4' />
</body>
<script>
var foo = Array.from($('item1','item2','item3','item4'));
//var foo = $A($('item1','item2','item3','item4'));
foo.each(function(v){alert(v.id);});
//--> 'item1' ,'item2' ,'item3', 'item4'가 순서대로 출력된다
</script>
</html>
indexOf : 아이템에 해당하는 아이템의 index값을 리턴한다.(단, 없는 값일경우 -1 리턴)
<script>
var foo = ['1', '2', '3'];
foo.indexOf(1)
//--> 0
</script>
inspect : 배열을 String으로 반환한다. (결과의 양쪽끝에 '[', ']'를 붙여 출력한다)
<script>
var foo = ['Apples', {good: 'yes', bad: 'no'}, 3, 34];
alert(foo.inspect());
//-->"['Apples', [object Object], 3, 34]"
</script>
last : 배열의 마지막 아이템 반환
<script>
var foo = ['a', 'b', 'c'];
var bar = foo.last();
// --> 'c'
</script>
reduce : 하나의 아이템만을 가진 배열을 문자열로 변환하여 반환한다.(1개이상의 아이템을 가진것은 제외)
<script>
var foo = ['1'];
var foo2 = ['1','2'];
var bar = foo.reduce();
var bar2 = foo2.reduce();
alert(typeof bar); //--> string
alert(typeof bar2);// --> object
</script>
reverse : 배열의 순서를 뒤집는다(인자로 false일경우 일시적, 생략또는 true일때는 영구적)
<script>
var foo = ['1', '2'];
alert(foo.reverse(false)); //--> '2', '1'
alert(foo); //--> '1', '2'
foo.reverse();
alert(foo); //--> '2', '1'
</script>
size : 배열의 크기를 리턴한다 (length 프로퍼티와 동일)
<script>
var foo = ['1', '2'];
alert(foo.size()); //--> 2
</script>
toArray : 위에서 봤던 clone과 동일한 기능을 수행
PJS에 이렇게 정의되어 있습니다. Array.prototype.toArray = Array.prototype.clone;
toJSON : json 오브젝트를 string으로 변환하여 반환 // 1.5.1에 추가된 메소드
uniq : 배열내 중복된 아이템이 있으면 제거하고 리턴
<script>
['Sam', 'Justin', 'Andrew', 'Dan', 'Sam'].uniq();
</script>
without : 배열내에 특정 아이템을 제거하고 반환한다.
[3, 5, 6, 1, 20].without(3)
[3, 5, 6, 1, 20].without(20, 6)
이 글의 트랙백 주소 :: http://www.blankus.net/trackback/11
