본문 바로가기

IT 인터넷/javascript

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

336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

이번시간에는 배열에 대해서 배워보자.


배열(array)은 연관돼있는 데이터들을 모아서 통으로 관리하기 위해 사용하는 데이터 타입(형식)이다.

다시말해서 배열은 데이터를 담는 그릇이다.


이전에 배운 데이터를 담는 그릇은 변수이며, a라는 변수에는 1이라는 값이 들어갈 수도, 2라는 값이 들어갈 수도 있으나

변수 안에 들어가는 것은 하나의 값이었다.



배열은 데이터를 담는 여러개의 붙어있는 그릇이며, 하나의 데이터에 여러개의 데이터를 저장할 수 있고 꺼내올수도 있다.



먼저 배열을 만들어보자.

배열은 대괄호로 시작해 대괄호로 끝나야 하며, 그 안에 서로 연관돼있는 데이터를 넣는다. 


만약 회사에 3명에 직원이 있고, 그 구성원들을 이름을 배열에 담는다고 생각해보자.


var member = ['estelar','yesri','hongjoo'];

이렇게 배열을 만드는 것이며, 이 정보들을 하나의 그릇에 담은 것이다. 그리고 그 그릇을 member라는 변수에 다시 담게 된느 것이다.


이제 member라는 변수가 생겼고, 변수를 호출하면 

'estelar','yesri','hongjoo'

을 볼 수 있다. 



즉, 지금까지 우리는


var member1 = 'estelar';

var member2 = 'yesri';

var member3 = 'hongjoo';


이런식으로 변수에 하나의 값만 담아왔었는데, 배열을 사용하게 되면 여러개의 데이터를 담을 수 있게 되는 것이다.


명칭을 살펴보면

배열에 담겨있는 각각의 데이터를 원소(element)라고 하며, 


member라는 배열에는 3개의 원소가 들어있다.




그리고 우리고 배열에 값을 어떻게 빼낼 수 있을까? 

배열이 담긴 그릇을 보면 다음과 같다. 


 'estelar'

'yesri' 

'hongjoo' 


이처럼 각각의 원소들은 저장될 때 순서대로 고유한 식별자(번호)를 갖게 되고, 

이 식별자는 첫번째 저장된 값은 0이라는 고유한 값을 갖고, 두번째는 1, 세번째 저장된 것은 2라는 고유한 값을 가지게 된다.

이 고유한 값은 자바스크립트가 내부적으로 부여하는 것이며

이러한 값을 색인(index)라 한다.


우리가 책을 사면 맨 뒷장에 index(색인)페이지가 있는데, 이 페이지를 보면 필요한 정보를 찾아갈 수 있다.

이처럼 배열의 index번호도 필요한 값을 찾을 수 있도록 돕는 것이다.


다시한번 배열을 보자

var member = ['estelar','yesri','hongjoo'];


여기서 첫번째 원소를 호출하려면,

alert(member[0])이라 쓸 수 있으며, 경고창에  estelar가 출력된다.

주의할 점은 프로그래밍은 숫자를 셀 때 0부터 세는 점을 유의해야 할 것이다. 



다음으로 배열이 없다면? 이라는 가정을 통해 배열의 효용에 대해 배워보자. 


코드를 보자.


①function get_member1(){

    return 'estelar';

}

document.write(get_member1());

 

②function get_member2(){

    return 'yesri';

}

document.write(get_member2());

 

 

③function get_member3(){

    return 'hongjoo'

}

document.write(get_member3());


이렇게 코드를 작성한 이유는 함수 라는 것은, 여러개의 입력값을 받을 수 있지만, 하나의 출력값만 나올 수 있는 형태의 문법을 가지고 있기 때문이다.

예를 들어 function A(a,b,c) 라는 것처럼 여러개의 인자값을 받을 수 있다. 

하지만 return에는 하나의 출력만 가질 수 있는데, 

이러한 한계를 극복할 수 있는 아주 좋은 수단이 배열이다.


function get_members(){

    return ['estelar', 'yesri', 'hongjoo'];

}


위의 코드처럼, 함수 이름을 get_members로 바꾸고 함수를 정의한다.

이 결과를 return할 때, return 하는 결과가 배열이다.


배열은 하나의 그릇 안에 여러개의 값들이 담겨있기 때문에 

결과적으로는 하나의 값을 return하는 것이지만, 그 안에 여러개의 값이 있기 때문에

여러개의 값을 return하는 것이다.


이를 출력하기 위해


var members = get_members();

함수의 return값을 변수 안에 넣어주고 


document.write(members[0]);

document.write(members[1]);

document.write(members[2]);


members[0]을 호출하면 'estelar'가 

members[1]을 호출하면 'yesri'가 

members[2]을 호출하면 'hongjoo'가 출력된다.