본문 바로가기
JavaScript

[생활코딩] javascript - 배열

by Hello Do. 2016. 5. 22.

본 강의 학습은 [생활코딩]를 통하여 학습하고 있습니다.


JavaScript - 배열 (1/5) : 배열의 문법


배열(array)이란 연관된 데이터를 모아서 통으로 관리하기 위해서 사용하는 데이터 타입이다. 

변수가 하나의 데이터를 저장하기 위한 것이라면 배열은 여러 개의 데이터를 하나의 변수에 저장하기 위한 것이라고 할 수 있다.


var name = 'egoing';

alert(name);


var member = ['egoing', 'k8805', 'sorialgi']; // 배열

alert(member[0]); // egoing 출력

alert(member[1]); //k8805 출력

alert(member[2]); // sorialgi 출력


배열에 담겨있는 값을 가져올 때는 대괄호 안에 숫자를 넣는다. 

이 숫자를 색인(index)라고 부르고 0부터 시작한다. 

즉 첫번째 원소(egoing)를 가져오려면 대괄호 안에 0을 넣어주어야 한다는 것이다. 

두번째는 1, 세번째는 2를 입력한다. 이 값을 이용해서 배열에 저정된 값을 가져올 수 있다.


JavaScript - 배열 (2/5) : 배열의 효용, 부제 : 배열이 없다면?

function get_member1(){

    return 'egoing';

}

document.write(get_member1());

 

function get_member2(){

    return 'k8805';

}

document.write(get_member2());

 

 

function get_member3(){

    return 'sorialgi'

}

document.write(get_member3());


- 배열의 효율성!

function get_members(){

    return ['egoing', 'k8805', 'sorialgi'];

}

var members = get_members();

document.write(members[0]);

document.write(members[1]);

document.write(members[2]);


JavaScript - 배열 (3/5) : 배열과 반복문의 조우

function get_members(){

    return ['egoing', 'k8805', 'sorialgi'];

}

members = get_members();

// members.length는 배열에 담긴 값의 숫자를 알려준다. 

for(i = 0; i < members.length; i++){

    // members[i].toUpperCase()는 members[i]에 담긴 문자를 대문자로 변환해준다.

    document.write(members[i].toUpperCase());   

    document.write('<br />');

}


JavaScript - 배열 (4/5) : 데이터의 추가(배열의 제어)

: 데이터의 추가/수정/삭제


var arr = [1, 2, 3, 4, 5];

alert(arr.length); // 5


- push는 인자로 전달된 값을 배열(li)에 추가하는 명령

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

li.push('f');

alert(li); // a, b, c, d, e, f


- concat은 복수의 원소를 배열에 추가하는 방법

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

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

alert(li); // a, b, c, d, e, f, g


- unshift는 배열의 시작점에 원소를 추가하는 방법이다

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

li.unshift('z');

alert(li); // z, a, b, c, d, e


- splice는 첫번째 인자에 해당하는 원소부터 두번째 인자에 해당하는 원소의 숫자만큼의 값을 배열로부터 제거한 후에 리턴한다. 

그리고 세번째 인자부터 전달된 인자들을 첫번째 인자의 원소 뒤에 추가한다.

(보충 설명 : http://opentutorials.org/course/50/110)

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

li.splice(2, 0, 'B');

alert(li); // a,b,B,c,d,e



JavaScript - 배열 (5/5) : 제거와 정렬


- shift는 첫번째 원소를 제거하는 방법

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

li.shift();

alert(li); // b, c, d, e


- pop는  배열 끝점의 원소를 배열 li에서 제거

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

li.pop();

alert(li); // a, b, c, d


- 정렬

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

li.sort();

alert(li); // a,b,c,d,e

 

- 반대로

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

li.reverse();

alert(li); // d,b,a,e,c