웹표준,웹접근성(html, html5, css, css3, javascript, jQuery, jQueryMobile, snecha, senchaTouch, php, mobileWebApp)

Array 객체 본문

javascript/Tutorial

Array 객체

jokack01 2014. 1. 21. 10:12

Array 객체

여러가지 자료들을 쉽게 관리할 수 있게 도와주는 객체


Array의 생성자 합수

 생성자 함수

이름 

 Array()

 빈배열을 생성

 Array(number)

 매개변수로 던지 수 만큼 배열을 생성 

 Array(mixed, ... , mixed)

 매개변수로 받은 자료형을 바탕으로 배열 생성 


Array 객체 생성 - 네 가지 방법으로 생성 가능 하다. 

var array01 = [1,2,3,4,5]  // 1~5 까지의 값을 가진 배열선언

var array02 = new Array();  // 생성자함수로 빈배열 선언

var array03 = new Array(5);  // 생성자함수로 5개의 공간을 가지는 배열 선언

var array04 = new Array(1,2,3,4,5);  // 생성자함수로 1~5까지의 값을 가진 배열선언

console.log(array01,array02,array03,array04);  // 배열 출력  



Array객체의 속성과 메서드


Array 객체 속성

 속성 이름 

 설명 

 length

 배열요소의 개수를 반환 


ex ) Array.length 의 사용예

// 1~5의 숫자를 담는 배열 선언

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

// 변수 선언 및 초기화

var output = '' ;

// 화면에 배열의 길이값 출력

console.log('array.length : ' + array.length);

// array 배열의 길이값 만큼 i 를 반복 시킨다.

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

    // output 변수에 인덱스 번호와 배열의 값을 담는다. 

    output += 'array' + i + ':' + array[i] + '\n';

}

// 화면에 출력

console.log(output); 



Array객체의 메서드

메서드 이름 

설명 

 concat()

 매개변수로 입력한 배열의 요소를 모두 합쳐 배열을 만들어 리턴 

 join()

 배열안의 모든 요소를 문자열로 만들어 리턴 

 pop()

 배열의 마지막 요소를 제거하고 리턴 

 push()

 배열의 마지막 부분에 새로운 요소를 추가 

 reverse()

 배열요소의 순서를 뒤집는다 

 slice()

 배열요소의 지정한 부분을 리턴 

 sort()

 배열의 요소를 정렬 (문자열 기준)

 splice()

 배열요소의 지정한 부분을 삭제 하고 삭제한 요소를 리턴 

pop(), push(), reverse(), slice(), sort(), splice() 는 자기 자신을 변화 시키는 메서드 이다.


ex) concat()

var bike = ['honda','yamaha'];  // bike 배열 선언 

var car = ['bmw','audi','lexus'];  // car 배열선언

var sum = bike.concat(car);  // concat메서드를 이용 bike 배열에 car 배열을 합친다

console.log(sum); // 출력



ex) join()

var car = ['bmw','audi','lexus'];  // 배열선언

console.log(car.join());  // car 배열을 join메서드를 이용해서 문자열로 출력


ex) pop()

var car = ['bmw','audi','lexus'];  // 배열선언

console.log(car.pop());  // car 배열의 마지막 요소를 제거하고 그 값을 반환 


ex) push()

var car = ['bmw','audi','lexus'];  // 배열선언

car.push('infiniti')  //push메서드를 이용 car 배열마지막에 infiniti를 추가

console.log(car);  // car 배열 출력 


ex) reverse()

var car = ['bmw','audi','lexus'];  // 배열선언

car.reverse()  // reverse 메서드릴 이용 car 배열의 순서를 뒤바꾼다.

console.log(car);  // 출력


ex) slice()

var car = ['bmw','audi','lexus'];  // 배열선언

var output = car.slice(0,2);  // car 배열의 0번째 인덱스 부터 2개를 잘라내 변수에 저장

console.log(output);  // 출력


ex) 1.splice() - 삭제

var car = ['bmw','audi','lexus','ferrari'];  // 배열선언

var output = car.splice(1, 2);  // splice를 사용 인덱스1~2번까지를 배열에서 삭제하고 그 값을 저장

console.log(output);  // 삭제된 배열의 값을 출력

console.log(car);  // car 배열의 값을 출력


ex) 2.splice() - 삭제 후 교체

var car = ['bmw','audi','lexus','ferrari'];  // 배열선언

// splice를 사용 인덱스1~2번까지를 배열에서 삭제하고 값을 교체, 삭제된 값을 변수에 저장 

var output = car.splice(1, 2, 'toyota','chevrolet ');

console.log(output);  // 삭제된 배열의 값을 출력

console.log(car);  // car 배열의 값을 출력


ex) sort() - * 문자열 오름차순으로 정렬 된다. 

var car = [10, 30, 80, 100, 70];  // 배열선언

car.sort();  // sort 메서드를 이용 배열 정렬

console.log(car);  // 정렬된 배열 출력 




sort() 메서드의 정렬

기본적으로 문자열 오름차순으로 정렬 되는데 이 정렬방법에 변화를 주고 싶을 때는 sort() 매개변수로 함수를 넣어 준다. 기본적으로 두가지 매개변수를 받을 수 있어야 한다. 

arr.sort( function(left, right){

});


* 오름차순

function(left, right){

return left - right;

}


* 내림차순

function(left, right){

return right - left;

}


ex) sort() - 재정의 

var car = [10, 30, 80, 100, 70];  //배열선언

car.sort(function(left, right){  // sort 메서드를 이용 배열 정렬

    return left - right;

});

console.log(car);  // 정렬된 배열 출력 

'javascript > Tutorial' 카테고리의 다른 글

Date 객체  (0) 2014.07.11
Array 객체요소 제거  (0) 2014.07.11
메서드 체이닝  (0) 2014.01.20
String 객체  (0) 2014.01.10
Number 객체  (0) 2014.01.09