남고생들의 소소한 개발 일지

[JS] 배열 본문

/JavaScript

[JS] 배열

MainBrain 2019. 10. 8. 20:55

배열 : 여러 개의 데이터를 하나의 변수에 저장하기 위한 것

배열의 생성

var member = ['0번방', '1번방', '2번방']
alert(member[0]);	//0번방
alert(member[1]);	//1번방
alert(member[2]);	//2번방
VALUE 0번방 1번방 2번방
INDEX 0 1 2

 

배열의 효용

function get_member1(){
    return 'member1';
}

document.write(get_member1());		//member1
 
function get_member2(){
    return 'member2';
}

document.write(get_member2());		//member2
 
function get_member3(){
    return 'member3'
}

document.write(get_member3());		//member3

지난 시간에 배운 함수를 사용할 때 하나의 함수는 하나의 값만을 반환할 수 있기 때문에 다음과 같이 3개의 멤버의 정보를 출력하려면 각각의 함수를 만들어야 한다.

function get_members(){
    return ['member1', 'member2', 'member3'];
}
var members = get_members();
document.write(members[0]);		//member1
document.write(members[1]);		//member2
document.write(members[2]);		//member3

하지만 연관된 정보를 한꺼번에 배열에 담는다면 코드를 간단하게 짤 수 있다.

 

배열의 사용

배열에 담긴 값이 많다면 배열의 인덱스 값을 기억하기 힘들다.

function get_members(){
    return ['aco', 'mainbrain', 'tistroy'];
}
members = get_members();

for(i = 0; i < members.length; i++){
    document.write(members[i].toUpperCase());   
    document.write('<br />');
}

// 결과
// ACO
// MAINBRAIN
// TISTORY

// members.length는 배열에 담긴 값의 숫자를 알려준다.
document.write(members.length);		//3
// members[i].toUpperCase()는 members[i]에 담긴 문자를 대문자로 변환해준다.
document.write('small'.toUpperCase());	//SAMLL
// 반대로 .toLowerCase()는 앞의 문자를 대문자로 변환해준다.
document.write('BIG'.toUpperCase());	//big

다음과 같이 반복문을 같이 사용한다면 배열을 편리하게 사용할 수 있다.

 

배열의 조작

var li = ['a', 'b', 'c', 'd', 'e'];
li.push('f');
alert(li);	//a,b,c,d,e,f

li = li.concat('g', 'h');
alert(li);	//a,b,c,d,e,f,g,h

li.unshift('z');
alert(li);	//z,a,b,c,d,e,f,g,h

끝에원소 추가

push : 배열의 끝에 원소를 추가하는 명령어

concat : 복수(여러 개)의 원소를 배열의 추가하는 명령어

앞에 원소 추가

unshift : 배열의 시작점에 원소를 추가하는 명령어

 

array = [0, 1, 2, 3, 4, 5, 6];
array.splice(1, 3, "a", "b", "c");
alert(array);	//0,a,b,c,4,5,6

원소 수정

splice : 첫 번째 인자에 해당하는 원소부터 두 번째 인자에 해당하는 원소의 숫자만큼 배열에서 제거하고 세 번째 인자부터 전달된 인자들을 첫 번째 인자 원소 뒤에 추가한다.

 

var li = ['a', 'b', 'c', 'd', 'e'];
li.shift();
alert(li);	//b,c,d,e

li.pop();
alert(li);	//b,c,d

첫 번째 원소 제거

shift : 배열의 첫 번째 원소를 제거

끝 원소 제거

pop : 배열의 마지막 원소 제거

 

var li = ['c', 'e', 'a', 'b', 'd'];
li.sort();
alert(li);	//a,b,c,d,e

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

원소 정렬

sort : 원소 오름차순 정렬

reverse : 원소 내림차순 정렬

 

이 외에 명령어가 더 궁금하면 생활코딩 JavaScript 사전 페이지에서 보도록 하자. 필요한 명령어가 있을 때 찾아서 하면 되니 지금 다 외울 필요는 없고 이런 명령어가 있다는 정도만 알아 두자.

 

출처 : 생활코딩 JavaScript - 배열

'프로그래밍 > JavaScript' 카테고리의 다른 글

[JS]모듈  (0) 2019.10.10
[JS] 객체  (0) 2019.10.10
[JS] 함수,입출력  (0) 2019.10.07
[JS] 반복문 (2)  (0) 2019.10.06
[JS] 반복문  (0) 2019.10.06