[javascript 언어공부] 배열(3)

이번에는 배열을 제어하는 방법에 대해서 알아보자.

우리는 배열에 담겨있는 데이터를 추가,삭제하거나 어딘가에 낑겨 넣거나 하는 작업을 할 필요가 있다. 

먼저 추가에 대해서 알아보자.

var li = ['a', 'b', 'c', 'd', 'e'];

다음과 같은 배열이 있다. 이 배열에 .push('f'); 라는 명령을 해보면

li.push('f');

배열을 호출했을 때 

alert(li);

var li = ['a', 'b', 'c', 'd', 'e','f'];

기존에 볼 수 없었던 'f'라는 원소가 배열 뒤에 추가되었음을 알 수 있다. 

push라는 함수가 있다. 이 함수는 자바스크립트가 기본적으로 제공하는 내장함수이다.

이 함수를 호출할 때 첫번째 인자로 'f'라는 값을 전달했더니, 

f라는 값을 push라는 함수가 소속돼있는 배열에 f라는 값을 추가한것이다.

push라는 것은 

a	b	c
0	1	2

우리가 이 배열에다가 .push('d')라고 하게 되면, 이 말은

배열이 갖고 있는 박스를 하나 늘리고, 여기에 3이라는 index값을 추가하고,

우리가 준 'd'라는 값을 안에 넣는 것이다.

그리고 push는 하나의 값을 추가하는 명령이라고 한다면,

여러개의 데이터를 한꺼번에 추가하고 싶다면 push보다는 concat이라는 명령을 사용할 수 있다.

var li = ['a', 'b', 'c', 'd', 'e'];

li = li.concat(['f', 'g']);

alert(li);

이 .concat의 인자는 배열이고, concatenate라는 말은 사슬같이 잇다; 연쇄시키다 라는 뜻으로 

기존의 배열에 새로운 인자로 주어진 배열을 연결시킨다는 뜻을 가지고 있다. 

변수에 담겨있는 배열과 concat에 들어있는 배열을 하나의 배열로 만들어 return하고 

그 값을 li에 다시 담게 되는 것이다.

지금까지는 배열에다가 원소를 추가할 때, 뒤쪽에다가 추가하는 것을 배웠다.

그렇다면 앞쪽에 추가하는 방법은 무엇이 있을까?

var li = ['a', 'b', 'c', 'd', 'e'];

그 떄 쓸 수 있는 명령이 바로 unshift() 이다.

li.unshift('z');

li에 unshift라는 명령을 한 후 'z'인자를 주면 

alert(li); 했을 때 ['z','a', 'b', 'c', 'd', 'e']; 가 된다.

index는 기존의 것들은 1씩 늘어나고, z는 0이 된다.

a가 이전에는 index가 0이었는데 1로 바뀐다.

그렇다면, 중간 어딘가에 배열을 낑겨넣고 싶다면 어떻게 하면 좋을까? 

그 때 사용할 수 있는 함수는 splice이다.

splice의 문법은 다음과 같다.

array.splice(index, howmany, element1, ...., elementN);

index를 보면, 배열을 추가할 특정 배열의 위치를 가르키는 index로 데이터형은 number이고, 필수옵션이다.

howmany를 보면, index에서부터 제거될 원소들의 수, 즉 아까 index에 해당되는 지점에서 howmany개의 element를 삭제하는 것이다.

만약 var li = ['a', 'b', 'c', 'd', 'e']; 에서 

li.spice(1,1)을 주면,

첫번째 1은 index 1의 자리에서 추가하라는 명령이며, 기존의 'b'는 뒤로 밀려나게 된다.

두번째 1은 기존의 1의 자리에 있던 애들 부터 몇 개를 삭제할 것이냐 라는 뜻이므로 , 1은 'b' 한개를 삭제한다는 뜻이다.

마지막으로 element들을 줄 수 있는데,

li.spice(1,1,'x','y');를 주면 element는 index가 1인 위치에서부터 추가되기 때문에

var li는  ['a', 'x','y', 'c', 'd', 'e']이 된다.

splice라는 함수를 호출하게되면, li라는 배열에 담긴 값을 바꾸는 것이고,

그 과정에서 삭제된 데이터 'b'를 리턴해 주는 것이다.

따라서 콘솔에서 

li.spice(1,1,'x','y'); 라는 명령을 주게 되면 'b'가 리턴되는 것이다.

다음으로 배열을 제거하는 방법을 알아보자. 

var li = ['a', 'b', 'c', 'd', 'e']; 배열을 정의하고, 

첫번째 값을 제거하고 싶다면 li.shift(); 하면 

삭제된 'a' 값이 리턴되고 

li에는 ['b', 'c', 'd', 'e'] 값이 남는다.

그렇다면, 제일 뒤에있는 값을 제거하려면 

li.pop(); 이라는 명령을 하면 된다. 따라서 명령을 실행하면 'e'라는 값이 리턴되고

li에는 ['b', 'c', 'd'] 값이 남는다.

마지막으로 배열을 정렬하는 방법에 대해서 알아보자.

다음과 같이 정렬되지 않는 배열이 있다.

var li = ['c', 'e', 'a', 'b', 'd'];

이 상태에서 li.sort();라는 배열을 실행하면 ['a', 'b', 'c', 'd', 'e'];로 정렬된다. 

만약 정렬순서를 역순으로 하고싶다면

li.reverse(); 라는 명령을 실행하면 ['e', 'd', 'c', 'b', 'a']; 로 정렬된다.

이 정렬순서는, 자바스크립트가 기본적으로 알고있는 알파벳 순서, 숫자 순서 등으로 정렬되는 것이다.