>  기사  >  웹 프론트엔드  >  알아야 할 JavaScript 배열 방법

알아야 할 JavaScript 배열 방법

WBOY
WBOY원래의
2024-07-17 17:44:22228검색

Métodos de Arrays em JavaScript que Você Deveria Saber

배열은 JavaScript 프로그래밍의 필수 부분으로, 데이터 컬렉션을 저장하고 조작하는 강력한 방법을 제공합니다. 이 기사에서는 모든 JavaScript 프로그래머가 보다 효율적이고 명확한 코드를 작성하기 위해 알아야 할 18가지 기본 배열 방법을 살펴보겠습니다.

1. 푸시

arr.push(..element) 메서드는 배열 끝에 새 요소를 추가하고 배열의 새 길이를 반환합니다. 이 방법은 원래 배열을 변경합니다.

구문:

arr.push(element1, element2, …)

예:

let arr = [1, 2, 3];
arr.push(4); // arr agora é [1, 2, 3, 4]

2. 팝

arr.pop() 메서드는 배열에서 마지막 요소를 제거하고 제거된 요소를 반환합니다. 이 방법은 원래 배열과 길이도 변경합니다.

구문:

arr.pop()

예:

let arr = [1, 2, 3, 4];
arr.pop(); // arr agora é [1, 2, 3]

3. 교대

arr.shift() 메서드는 배열에서 첫 번째 요소를 제거하고 제거된 요소를 반환합니다. 이 방법은 원래 배열의 길이도 변경합니다.

구문:

arr.shift()

예:

let arr = [1, 2, 3, 4];
arr.shift(); // arr agora é [2, 3, 4]

4. 변속 해제

arr.unshift(elements) 메소드는 배열의 시작 부분에 하나 이상의 요소를 추가하고 배열의 새로운 길이를 반환합니다.

구문:

arr.unshift(item1, item2, …)

예:

let arr = [2, 3, 4];
arr.unshift(1); // arr agora é [1, 2, 3, 4]

5. 접합

arr.splice() 메소드는 요소를 제거, 교체 또는 추가하여 원래 배열을 수정합니다.

구문:

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

예:

let arr = [1, 2, 3, 4];
arr.splice(1, 1); // arr agora é [1, 3, 4]

6. 슬라이스

arr.slice() 메서드는 배열의 일부를 선택하고 시작 인덱스부터 끝까지 항목이 복사된 새 배열을 반환합니다. 원래 배열은 변경되지 않습니다.

구문:

arr.slice(start, end)

예:

let arr = [1, 2, 3, 4];
let newArr = arr.slice(1, 3); // newArr é [2, 3]

7. 포함

arr.includes(item, index) 메소드는 항목이 지정된 인덱스의 배열에 있는지 확인하고 해당 항목이 있으면 true를 반환하고 그렇지 않으면 false를 반환합니다.

구문:

arr.includes(item, index)

예:

let arr = [1, 2, 3, 4];
arr.includes(3); // true

8. 각

arr.forEach() 메서드는 배열의 각 요소에 대해 주어진 함수를 한 번씩 실행합니다.

구문:

arr.forEach(callback)

예:

let arr = [1, 2, 3, 4];
arr.forEach(num => console.log(num)); // imprime 1, 2, 3, 4

9. 가입

arr.join(separator) 메소드는 특정 구분 기호로 구분된 배열의 모든 요소가 연결된 문자열을 생성합니다.

구문:

arr.join(separator)

예:

let arr = [1, 2, 3, 4];
arr.join('-'); // "1-2-3-4"

10. toString

arr.toString() 메서드는 배열을 문자열로 변환하고 결과를 반환합니다.

구문:

arr.toString()

예:

let arr = [1, 2, 3, 4];
arr.toString(); // "1,2,3,4"

11. 지도

map() 메서드는 원본 배열의 각 요소에 대해 콜백 함수를 호출하고 결과가 포함된 새 배열을 반환합니다. 이는 돌연변이가 아닌 방법입니다.

구문:

  arr.map(function callback(currentValue, index, array) {
    // Retorna um novo valor
  })

예:

let arr = [1, 2, 3, 4];
let doubled = arr.map(num => num * 2); // [2, 4, 6, 8]

12. 감소

reduce() 메서드는 누산기와 각 배열 요소(왼쪽에서 오른쪽으로)에 함수를 적용하여 단일 값으로 줄입니다.

구문:

arr.reduce(function callback(accumulator, currentValue, index, array) {
  // Retorna o valor acumulado
}, initialValue)

예:

let arr = [1, 2, 3, 4];
let sum = arr.reduce((acc, num) => acc + num, 0); // 10

13. 필터

filter() 메소드는 제공된 함수에 의해 구현된 테스트를 통과한 모든 요소로 새 배열을 생성합니다.

구문:

arr.filter(function callback(element, index, array) {
  // Retorna true para manter o elemento
})

예:

let arr = [1, 2, 3, 4];
let even = arr.filter(num => num % 2 === 0); // [2, 4]

14. 정렬

sort() 메소드는 오름차순 또는 제공된 비교 함수에 따라 배열 요소를 구성합니다.

구문:

arr.sort([compareFunction])

예:

let arr = [4, 2, 3, 1];
arr.sort(); // [1, 2, 3, 4]

15.찾기

find() 메소드는 주어진 테스트 함수를 만족하는 배열의 첫 번째 요소를 반환합니다.

구문:

arr.find(function callback(element, index, array) {
  // Retorna true para encontrar o elemento
})

예:

let arr = [1, 2, 3, 4];
let found = arr.find(num => num > 2); // 3

16. 인덱스오브

indexOf() 메서드는 배열에서 특정 요소를 찾을 수 있는 첫 번째 인덱스를 반환하거나 해당 요소가 없으면 -1을 반환합니다.

구문:

arr.indexOf(searchElement, fromIndex)

예:

let arr = [1, 2, 3, 4];
let index = arr.indexOf(3); // 2

17. 추가

some() 메소드는 배열의 요소 중 하나 이상이 구현된 테스트 함수를 통과하는지 테스트합니다.

구문:

arr.some(function callback(element, index, array) {
  // Retorna true se pelo menos um elemento passar no teste
})

예:

let arr = [1, 2, 3, 4];
let hasEven = arr.some(num => num % 2 === 0); // true

18. Concat

O método concat() é usado para mesclar dois ou mais arrays.

Sintaxe:

arr.concat(array2, array3, ..., arrayN)

Exemplo:

let arr1 = [1, 2];
let arr2 = [3, 4];
let merged = arr1.concat(arr2); // [1, 2, 3, 4]

Esses métodos são fundamentais para trabalhar com arrays em JavaScript. Dominar esses métodos permitirá que você manipule dados de forma mais eficiente e escreva códigos mais limpos e legíveis. Feliz codificação!

Referências:

  • 10 Important JavaScript Array Methods You Must Know
  • Lists of Top 10 JavaScript array methods a beginner Js developer should know

위 내용은 알아야 할 JavaScript 배열 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.