JavaScript 배열 메서드

JavaScript 배열의 힘은 배열 메서드에 숨겨져 있습니다.

배열을 문자열로 변환합니다

JavaScript 메서드 toString() 배열을 구분자로 구분된 문자열로 변환합니다。

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

결과

Banana,Orange,Apple,Mango

직접 시도해 보세요

join() 메서드는 모든 배열 요소를 하나의 문자열로 결합할 수도 있습니다.

그 행동은 toString()과 유사하지만, 구분자를 지정할 수도 있습니다：

예제

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");

결과

Banana * Orange * Apple * Mango

직접 시도해 보세요

Popping과 Pushing

배열을 처리할 때, 요소를 제거하고 새로운 요소를 추가하는 것은 매우 간단합니다.

Popping과 Pushing이란：

배열에서弹出프로젝트, 또는 배열에추입프로젝트.

Popping

pop() 메서드는 배열에서 마지막 요소를 제거합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // fruits에서 마지막 요소（"Mango"）을 제거합니다

직접 시도해 보세요

pop() 메서드는 "弹出"된 값을 반환합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // x의 값은 "Mango"입니다

직접 시도해 보세요

Pushing

push() 메서드는 배열의 끝에 새로운 요소를 추가합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");       // fruits에 새로운 요소를 추가합니다

직접 시도해 보세요

push() 메서드는 새로운 배열의 길이를 반환합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.push("Kiwi");   // x의 값은 5입니다

직접 시도해 보세요

이동 요소

이동은弹出과 동일하지만 첫 번째 요소 대신 마지막 요소를 처리합니다.

shift() 메서드는 첫 번째 요소를 제거하고 모든 다른 요소를 더 낮은 인덱스로 "이동"시킵니다.

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // fruits에서 첫 번째 요소 "Banana"을 제거합니다.

직접 시도해 보세요

shift() 메서드는 "이동된" 문자를 반환합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();             // "Banana"을 반환합니다

직접 시도해 보세요

unshift() 메서드는 배열에 새로운 요소를 추가하고, 오래된 요소를 "역방향 이동"합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // fruits에 새로운 요소 "Lemon"을 추가합니다

직접 시도해 보세요

unshift() 메서드는 새로운 배열의 길이를 반환합니다。

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // 5를 반환합니다

직접 시도해 보세요

요소를 변경하려면

그들의인덱스 번호를 사용하여 배열 요소에 접근할 수 있습니다：

배열인덱스(인덱스)0부터 시작합니다。[0]은 첫 번째 배열 요소이며，[1]은 두 번째，[2]은 세 번째 ...

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";        // fruits의 첫 번째 요소를 "Kiwi"로 변경합니다

직접 시도해 보세요

length 속성은 배열에 새로운 요소를 추가하는 쉬운 방법을 제공합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";          // fruits에 "Kiwi"를 추가합니다

직접 시도해 보세요

제거할 수 있습니다.

JavaScript 배열이 객체라면, 그 요소는 JavaScript delete 연산자로제거：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // fruits의 첫 번째 요소를 undefined로 변경합니다

직접 시도해 보세요

사용하여 delete 배열에 정의되지 않은 공간을 남겨줍니다. 사용하세요 pop() 또는 shift() 대신 사용합니다。

배열 결합

splice() 메서드는 새로운 항목을 배열에 추가하는 데 사용될 수 있습니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

직접 시도해 보세요

첫 번째 매개변수(2)는 새로운 요소를 추가할 위치(결합)를 정의합니다。

두 번째 매개변수(0)는 제거할 요소의 개수를 정의합니다。

기타 매개변수("Lemon", "Kiwi")는 추가할 새로운 요소를 정의합니다。

splice() 메서드는 제거된 항목을 포함한 배열을 반환합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");

직접 시도해 보세요

splice()를 사용하여 요소를 제거합니다

똑똑한 매개변수 설정을 통해 사용할 수 있습니다： splice() 요소를 제거할 때 배열에서 '공간'이 남지 않도록 합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // fruits에서 첫 번째 요소를 제거합니다.

직접 시도해 보세요

첫 번째 매개변수(0)는 새로운 요소가 추가되어야 할 위치를 정의합니다.추가위치을 정의합니다.

두 번째 파라미터(1)은 제거되어야 할 요소의다수 제거요소.

나머지 파라미터가 생략되면. 새 요소가 추가되지 않습니다.

합치(연결) 배열

concat() 메서드는 기존 배열을 합치(연결)하여 새 배열을 생성합니다:

예제(두 개의 배열을 합치기)

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys);   // myGirls와 myBoys를 연결합니다

직접 시도해 보세요

concat() 메서드는 기존 배열을 변경하지 않습니다. 항상 새 배열을 반환합니다.

concat() 메서드는 어떤 양의 배열 파라미터도 받을 수 있습니다:

예제(세 개의 배열을 합치기)

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);   // arr1, arr2, arr3를 연결합니다

직접 시도해 보세요

concat() 메서드는 값도 파라미터로 받을 수 있습니다:

예제(배열과 값을 합치기)

var arr1 = ["Cecilie", "Lone"];
var myChildren = arr1.concat(["Emil", "Tobias", "Linus"]);

직접 시도해 보세요

배열 잘라내기

slice() 메서드는 배열의 일부를 잘라서 새 배열을 생성합니다.

이 예제에서는 배열 요소 1 ("Orange")에서 시작하여 배열 부분을 잘라냅니다:

예제

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1);

직접 시도해 보세요

slice() 메서드는 새 배열을 생성합니다. 원래 배열에서는 어떤 요소도 제거되지 않습니다.

이 예제에서는 배열 요소 3 ("Apple")에서 시작하여 배열 부분을 잘라냅니다:

예제

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3);

직접 시도해 보세요

slice() 예를 들어 (1, 3)와 같이 두 개의 파라미터를 받을 수 있습니다.

이 메서드는 시작 파라미터에서부터 끝 파라미터(포함되지 않음)까지 요소를 선택합니다.

예제

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);

직접 시도해 보세요

끝 파라미터가 생략된 경우, 예를 들어 첫 번째 예제에서는 slice() 수组和의 나머지 부분을 잘라냅니다.

예제

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(2);

직접 시도해 보세요

자동 toString()

원시 값을 필요로 하면 JavaScript는 자동으로 배열을 문자열로 변환합니다. 아래 두 예제는 동일한 결과를 생성합니다：

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

직접 시도해 보세요

예제

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits;

직접 시도해 보세요

모든 JavaScript 객체는 가지고 있습니다 toString() 메서드.

배열 정렬

다음 장에서 배열 정렬에 대해 배울 것입니다~.

배열에서 최대와 최소 값을 찾기

JavaScript 배열에서 최고와 최소 값을 찾는 내장 함수가 없습니다.

다음 장에서 이 문제를 해결하는 방법을 배울 것입니다.

완전한 배열 참조서

완전한 참조서를 원하시면 우리의 완전한 JavaScript 배열 참조서.

이 참조서는 모든 배열 속성 및 메서드 설명과 예제를 포함하고 있습니다.