자바스크립트 : 배열 생성, 데이터 추가, 출력 / indexOf / splice / join / split

배열

배열 생성

        var arr = [];

arr이라는 이름의 빈 배열을 []으로 배열을 생성하였다.

 

 

        var arr = new Array();

new Array()를 이용해서 생성할 수도 있다.

 

 var arr = [10,20,true,3.1415,'test'];

배열 생성과 동시에 데이터를 넣어줄 수도 있다.

자바스크립트에서는 데이터 타입에 관계없이 같은 배열에 포함될 수 있다.

 

 

 

데이터 추가

        arr.push(1);
        arr.push(2);
        arr.push(3);

1, 2, 3 이라는 데이터를 배열 arr에 넣어주었다.

 

 

 

배열 출력

document.write(arr,"<br>")

배열을 그대로 출력하면 배열의 데이터값이 나열되어 한번에 확인할 수 있다.

 

 

        document.write("<h2>배열값 가져오는 방법 -1<h2>");
        for(i=0; i<arr.length;i++){
            document.write(arr[i],"<br>")
        }

length로 배열의 길이를 확인할 수 있다. index가 0부터 시작하는 것을 주의하여 배열의 값을 하나씩 출력하였다.

 

 

 

            for(i in arr)
            document.write(arr[i],"<br>");

for(i in 배열) 으로 위와 동일하게 배열의 모든 데이터를 가져올 수 있다.

 

 

 

배열 검색 indexOf

document.write(arr.indexOf(1));

값이 1인 데이터의 index 번호를 나타낸다.

 

 

document.write(arr.indexOf(10));

찾는 데이터가 배열에 존재하지 않으면 -1이 출력된다.

 

 

배열 삭제 (부분추출)  splice

배열을 삭제할 수 있는 메서드는 없지만, 부분추출으로 원하는 부분만 빼낼 수 있다.

 

        document.write(arr,"<br>"); //1,2,3,4,5,6
        document.write(arr.splice(3,2),"<br>"); //4,5 (인덱스 3부터 2개)
        document.write(arr,"<br>"); //1,2,3,6

splice(3,2)는 인덱스3부터(4번째 값) 2개를 말한다.

다시 arr을 출력했더니 splice했던 데이터가 제외된 것을 확인했다.

 

 

 

join

배열의 내용을 하나의 문자열로 합치기

특정 문자로 배열 값을 구분 할 수 있다.

 

        var arr = [1, true, 'test', null, '123123', 123];
	document.write(arr,"<br>") //1,true,test,,123123,123
        document.write(arr.join('&'),"<br>") //1&true&test&&123123&123
        document.write(arr,"<br>") //1,true,test,,123123,123

join으로 배열의 각 데이터를 & 으로 구분하고 하나의 문자열로 합쳐서 출력하였다.

 

var str = arr.join('&');

join으로 합친 배열을 str 변수에 저장하였다.

 

 

 

split

문자열을 특정 문자열로 쪼개기 후에 배열로 관리

 

document.write(str.split('&',"<br>")); //1,true,test,,123123,123

문자열을 split를 이용해서 쪼개서 배열로 관리할 수 있다. 배열이 되어 각 값이 ,로 구분되어 출력된다.