자바스크립트의 배열 메소드 요약(코드 포함)

이 글은 JavaScript의 배열 메소드에 대한 요약을 제공합니다(코드 포함). 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

1.copyWithin() 메소드는 원래 배열을 변경합니다.
배열의 처음 두 요소를 마지막 두 요소에 복사합니다.
array.copyWithin(target, start, end)
매개변수 설명
target 필수입니다. 지정된 대상 인덱스 위치에 복사합니다.
시작 선택사항. 요소 복사의 시작 위치입니다.
종료 선택사항. 복사를 중지할 인덱스 위치입니다(기본값은 array.length). 음수 값인 경우 역수 값을 나타냅니다.

var arr = [1,2,3,4,5];
arr.copyWithin(3,0,2);
console.log(arr);  //1,2,3,1,2

2.every(function(){})는 원래 배열을 변경하지 않습니다.
배열의 각 항목에 대해 함수를 실행합니다. 각 항목이 true를 반환하면

var arr=[1,2,3,4,5];
var result=arr.every(function(item){
  return item>1;
})
console.log(result);  //false

3.some(function( ) {}) 원래 배열을 변경하지 마세요.
배열의 각 항목이 함수를 실행합니다. True로 반환된 항목이 하나 있으면

var arr=[1,2,3,4,5]
var result=arr.some(function(item){
  return item>1;
})
console.log(result)  //true

4.fill () Array
array.fill(value, start, 끝)
매개변수 설명
값 필수입니다. 채울 값입니다.
시작 선택사항. 직위 채우기를 시작하십시오.
종료 선택사항. 채우기 중지 위치(기본값은 array.length)

var arr=[1,2,3,4,5];
arr.fill("哈哈",0,3);
console.log(arr);  //[ '哈哈', '哈哈', '哈哈', 1, 2 ]

5.filter()는 원래 배열을 변경하지 않습니다
새 배열을 생성하고 새 배열의 요소는 모두 확인하여 지정된 배열의 조건을 충족하는 요소입니다. .
참고: filter()는 빈 배열을 감지하지 않습니다.

var ages = [22, 53, 16, 40];
var ar5=ages.filter(function(age){
  return age>30;
})
console.log(ar5) //[ 53, 40 ]

6.find()는 원래 배열을 변경하지 않습니다.
테스트를 통과한 배열의 첫 번째 요소 값을 반환합니다(함수 내에서 판단).
find() 메소드는 배열의 각 요소에 대해 한 번씩 함수 실행을 호출합니다.
조건을 테스트할 때 배열의 요소가 true를 반환하면 find()는 조건을 충족하는 요소를 반환하며 실행 함수는 실행되지 않습니다. 후속 값을 요구했습니다.
조건에 맞는 요소가 없으면 undef가 반환됩니다.
참고: 빈 배열에 대해서는 find() 함수가 실행되지 않습니다.

var num = [212, 537, 160, 401];
function odd(x){
  return x%2;
}
var ar6=num.find(odd);
console.log(ar6);   //537

7.findIndex()는 원래 배열을 변경하지 않습니다.
조건을 충족하는 테스트 조건(함수)에서 전달된 배열의 첫 번째 요소 위치를 반환합니다.
findIndex() 메서드는 배열의 각 요소에 대해 한 번씩 함수 실행을 호출합니다.
조건을 테스트할 때 배열의 요소가 true를 반환하면 findIndex()는 조건을 충족하는 요소의 인덱스 위치와 후속 값을 반환합니다. ​​변경되지 않습니다.
조건에 맞는 요소가 없으면 -1이 반환됩니다.
참고: 빈 배열에 대해서는 findIndex() 함수가 실행되지 않습니다.

var num = [212, 537, 160, 401];
function odd(x){
  return x%2;
}
console.log(num.findIndex(odd)); //1

8.indexOf()는 원래 배열을 변경하지 않습니다.
배열에서 요소를 검색하고 해당 위치를 반환합니다.

var num = [212, 537, 160, 401];
console.log(num.indexOf(160));  //2

9.lastIndexOf()는 원래 배열을 변경하지 않습니다.
지정된 문자열 값이 나타나는 마지막 위치를 반환하고 문자열의 지정된 위치에서 뒤에서 앞으로 검색합니다.

var num = [212, 537, 160, 401];
console.log(num.indexOf(160));  //

10.join()은 원본 배열을 변경합니다.
배열을 문자열로 변환합니다. 그렇지 않은 경우 기본값은 쉼표입니다.
toString()은 원본 배열을 변경합니다. 배열을 문자 문자열로 변환하고 결과를 반환합니다. 매개변수가 없습니다.

var num = [212, 537, 160, 401];
console.log(num.join());  //212,537,160,401

11.map()은 원래 배열을 변경하지 않습니다.

지정된 함수를 통해 배열의 각 요소를 처리하고 처리된 배열을 반환합니다.

var arr=[12,23,45,56,78];
var arr1=arr.map(function(x){
  return x+1;
})
console.log(arr1);  //[ 13, 24, 46, 57, 79 ]
console.log(arr);   //[ 12, 23, 45, 56, 78 ]

12.forEach()는 원래 배열을 변경하지 않음 배열

메서드는 배열의 각 요소를 호출하고 해당 요소를 콜백 함수에 전달하는 데 사용됩니다.
참고: forEach()는 빈 배열에 대해 콜백 함수를 실행하지 않습니다.

var num=[ 212, 537, 160, 401 ];
num.forEach(function(num){
  return num/2;
})
console.log(num);  //[ 212, 537, 160, 401 ]

13.reduce()는 원래 배열을 변경하지 않습니다.

배열의 각 값부터 시작하여(왼쪽에서 오른쪽으로) 누산기로 함수를 받습니다. ) 축소되어 최종적으로 값으로 계산됩니다.
reduce()는 함수 구성을 위한 고차 함수로 사용될 수 있습니다.
참고: Reduce()는 빈 배열에 대해 콜백 함수를 실행하지 않습니다

var arr=[ 12, 23, 45, 56, 78 ];
var arr2=arr.reduce(function(total,item){
  return total-item;
})
console.log(arr2); //-190
console.log(arr);  //[ 12, 23, 45, 56, 78 ]

14.reduceRight() 원래 배열을 변경하지 않습니다.

함수는 Reduce()와 동일하지만 차이점은 ReduceRight()가 시작된다는 것입니다. 배열의 끝부터 배열의 배열 항목을 앞으로 누적합니다.
참고: Reduce()는 빈 배열에 대해 콜백 함수를 실행하지 않습니다.

var arr=[ 12, 23, 45, 56, 78 ];
var arr2=arr.reduceRight(function(total,item){
  return total-item;
})
console.log(arr2);  //-58
console.log(arr);   //[ 12, 23, 45, 56, 78 ]

15.pop()은 원래 배열을 변경합니다.

배열의 마지막 요소를 삭제하고 삭제된 요소를 반환합니다. 매개변수가 없으면
shift()는 원래 배열을 변경하고
삭제하고 배열의 첫 번째 요소를 반환합니다. 매개변수가 없으면
push()는 원래 배열을 변경하고
배열 끝에 하나 이상의 요소를 추가하고 새 길이를 반환합니다. 매개변수는 추가할 요소이며, 하나 이상이 될 수 있습니다.
unshift()는 원래 배열을 변경하고
배열의 시작 부분에 하나 이상의 요소를 추가하고 새 길이를 반환합니다. 매개변수는 추가할 요소이며, 하나 이상이 될 수 있습니다

16.sort()      会改变原数组
对数组的元素进行排序,只能是一位数，如果是两位数会按字典序排列，改进：加一个回调函数

var arr2=[2,8,45,12,5,67,9];
arr2.sort(function(a,b){
  return a-b;
});
console.log(arr2);  //[ 2, 5, 8, 9, 12, 45, 67 ]

17.reverse()    会改变原数组
反转数组的元素顺序

var arr2=[ 2, 5, 8, 9, 12, 45, 67 ];
arr2.reverse();
console.log(arr2);    //[ 67, 45, 12, 9, 8, 5, 2 ]

18.valueOf()         不会改变原数组
返回数组对象的原始值，一般原样返回

var arr2=[ 67, 45, 12, 9, 8, 5, 2 ];
arr2.valueOf();
console.log(arr2);  //[ 67, 45, 12, 9, 8, 5, 2 ]
// 可以自己定义一个对象的valueOf()方法来覆盖它原来的方法。
// 这个方法不能含有参数，方法里必须return一个值。
var x = {};
x.valueOf = function(){
    return 10;
}
console.log(x+1);// 输出10
console.log(x+"hello");//输出10hello

19.slice()       不会改变原数组
选取数组的的一部分，并返回一个新数组。
array.slice(start, end)
参数        描述
start       可选。规定从何处开始选取(包括)。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元                 素，-2 指倒数第二个元素，以此类推。
end         可选。规定从何处结束选取（不包括）。该参数是数组片断结束处的数组下标。
                如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。
                如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。

var arr2=[ 67, 45, 12, 9, 8, 5, 2 ];
console.log(arr2.slice(1,4));  //[ 45, 12, 9 ]
console.log(arr2);     //[ 67, 45, 12, 9, 8, 5, 2 ]

20.splice()    会改变原始数组
方法用于插入、删除或替换数组的元素。
array.splice(index,howmany,item1,.....,itemX)
参数                       描述
index                     必需。规定从何处添加/删除元素。
                              该参数是开始插入和（或）删除的数组元素的下标，必须是数字。
howmany               必需。规定应该删除多少元素。必须是数字，但可以是 "0"。
                              如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
item1, ..., itemX     可选。要添加到数组的新元素

arr3=[2,3,4,5,6,7,8];
//删除
arr3.splice(2,3);
console.log(arr3);   //[ 2, 3, 7, 8 ]
//增加
arr3.splice(1,0,9,10);
console.log(arr3);  //[ 2, 9, 10, 3, 7, 8 ]
//替换
arr3.splice(0,3,8,7,3);  //[ 8, 7, 3, 3, 7, 8 ]
console.log(arr3);

最后再小结一下：

会改变原数组的方法：copyWithin()、fill()、join()、pop()、push()、shift()、unshift()、sort()、reverse()、splice()；

不会改变原数组的方法：every()、some()、filter()、find()、findIndex()、indexOf()、lastIndexOf()、map()、forEach()、reduce()、reduceRight()、valueOf()、slice()；

相关推荐：

对JavaScript数组的方法总结

JavaScript数组中的indexOf方法

위 내용은 자바스크립트의 배열 메소드 요약(코드 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!