집 > 기사 > 웹 프론트엔드 > JS 배열 배열 메소드 요약

JS 배열 배열 메소드 요약

一个新手원래의: 2017-10-26 10:50:182565검색

1.배열배열 메서드Array数组的方法

Mutator方法————"突变方法"会改变数组自身的值；
Accessor方法————"访问方法"不会改变数组自身的值；
Iteration方法————"遍历的方法" ；

2.Mutator方法

①[ ].push—作用：将一个或多个元素添加到数组的末尾，传参：（单个或多个数组元素）；返回值：新数组的长度；
```
 //标准用法
 arr.push(el1, el2 ……elN)；
 //合并两个数组
 [].push.apply(arr1, arr2)
```
②[].pop()，作用：删除最后一个元素，传参：无；返回值：删除的元素。
```
//标准用法
let a = [1 ,2 ,3 ];
a.pop();//3
```
③[ ].unshift—作用：将一个或多个元素添加到数组的开头，传参：（单个或多个数组元素）；返回值：新数组的长度；
```
 //标准用法
 arr.unshift(el1, el2 ……elN)；
```
④[].shift()，作用：删除第一个元素，传参：无；返回值：删除的元素。
```
//标准用法
let a = [1 ,2 ,3 ];
a.shift();//1
```
⑤[].reverse()，作用：数组元素颠倒位置，传参：无；返回值：颠倒后的数组。
```
//标准用法
arr.reverse()
```
⑥[].splice()，作用：数组元素颠倒位置，传参：（索引，删除个数【选】，要添加的元素【选】）；返回值：被删除的元素组成的一个数组。
```
//标准用法
array.splice(start)
array.splice(start, deleteCount) 
array.splice(start, deleteCount, item1, item2, ...)
```
⑦[].fill()，作用：用一个固定值填充一个数组中从起始索引到终止索引内的全部元素，传参：（用来填充数组元素的值，起始索引【选】，终止索引【选】）；返回值：修改后的数组。
```
//标准用法
arr.fill(value) 
arr.fill(value, start) 
arr.fill(value, start, end)
//例子
[1, 2, 3].fill(4)            // [4, 4, 4]
[1, 2, 3].fill(4, 1)         // [1, 4, 4]
[1, 2, 3].fill(4, 1, 2)      // [1, 4, 3]
```
⑧[].sort()，作用：对数组的元素进行排序，并返回数组，传参：（指定排列顺序的函数【选】）；返回值：排列后的数组。
```
//标准用法
arr.sort() 
arr.sort(compareFunction)
//例子
var numbers = [4, 2, 5, 1, 3];
numbers.sort(function(a, b) {
return a - b;
});// [1, 2, 3, 4, 5]
```

3.Accessor方法

①[ ].join—作用：将数组（或一个类数组对象）的所有元素连接到一个字符串中。，传参：（指定一个字符串来分隔数组的每个元素【选】）；返回值：一个所有数组元素连接的字符串；
```
//标准用法
var a = [&#39;Wind&#39;, &#39;Rain&#39;, &#39;Fire&#39;];
var myVar1 = a.join();      // myVar1的值变为"Wind,Rain,Fire"
var myVar2 = a.join(&#39;, &#39;);  // myVar2的值变为"Wind, Rain, Fire"
```

②[ ].concat—作用：并两个或多个数组。，传参：（将数组和/或值连接成新数组【选】）；返回值：合并后的数组；

//标准用法
var alpha = [&#39;a&#39;, &#39;b&#39;, &#39;c&#39;];
var numeric = [1, 2, 3];
alpha.concat(numeric);
//[&#39;a&#39;, &#39;b&#39;, &#39;c&#39;, 1, 2, 3]

③[ ].slice—作用：方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组。，传参：（开始索引【选】，结束索引【选】）；返回值：截去后的数组；

//标准用法
var fruits = [&#39;Banana&#39;, &#39;Orange&#39;, &#39;Lemon&#39;, &#39;Apple&#39;, &#39;Mango&#39;];
var citrus = fruits.slice(1, 3);
//[&#39;Orange&#39;,&#39;Lemon&#39;] 
  //类数组转数组
function list() {
 return [].slice.call(arguments)}
var list1 = list(1, 2, 3); // [1, 2, 3]

④[ ].toString—作用：返回一个字符串，表示指定的数组及其元素，传参：（无）；返回值：转化成的字符串；（=[].join()）

//标准用法
var monthNames = [&#39;Jan&#39;, &#39;Feb&#39;, &#39;Mar&#39;, &#39;Apr&#39;];
var myVar = monthNames.toString(); // assigns "Jan,Feb,Mar,Apr" to myVar.

⑤[ ].includes—作用：判断一个数组是否包含一个指定的值，传参：（要查找的元素）；返回值：true或 false；
```
//标准用法
let a = [1, 2, 3];
a.includes(2); // true 
a.includes(4); // false
```
⑥[ ].indexOf—作用：在数组中可以找到一个给定元素的第一个索引，传参：（要查找的元素）；返回值：找不到-1，找得到索引；
```
var array = [2, 5, 9];
array.indexOf(2);     // 0
array.indexOf(7);     // -1
```

4.Iteration方法

①[ ].forEach—作用：每个元素执行一次提供的函数，传参：（callback(当前元素,索引，该数组)）；返回值：无；
```
 //标准用法
 array.forEach(callback(currentValue, index, array){
 //do something
}, this)
```
②[ ].find—作用：返回数组中满足提供的测试函数的第一个元素的值，传参：（callback(当前元素,索引，该数组)）；返回值：该元素；（[].findIndex()返回索引）
```
 //标准用法
 array. find(callback(currentValue, index, array){
 //do something
}, this)
```
③[ ].filter—作用：创建一个新数组, 其包含通过所提供函数实现的测试的所有元素，传参：（callback(当前元素,索引，该数组)）；返回值
- Mutator 메서드 — ———"Mutation 방법"은 배열 자체의 값을 변경합니다. 🎜
- 🎜Accessor 방법 ————"접근 방법"은 배열의 값을 변경하지 않습니다. 🎜
- 🎜반복 방법————"순회 방법";🎜
🎜🎜2.Mutator method🎜
- 🎜①[ ].push—함수: 하나 이상의 요소를 다음에 추가합니다. 배열의 끝에서 매개변수: (단일 또는 다중 배열 요소); 반환 값: 새 배열의 길이 🎜
```
 //标准用法
 let arr = array. filter(callback(currentValue, index, array){
 //do something
 }, this)
```
- 🎜②[].pop(), 함수: 마지막 요소 삭제, 매개변수 전달: 반환 값; >: 요소를 삭제합니다. 🎜
```
 //标准用法
 var numbers = [1, 4, 9];
 var roots = numbers.map(Math.sqrt);
 // roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9]
```
- 🎜 ③[ ].unshift—함수: 배열 시작 부분에 하나 이상의 요소를 추가하고 매개변수 전달: (단일 또는 다중 배열 요소); <code>반환 값: 새 배열의 길이 🎜
```
   //标准用法
   function isBigEnough(element, index, array) {
    return (element >= 10);}
   var passed = [12, 5, 8, 130, 44].every(isBigEnough);// passed is false
   passed = [12, 54, 18, 130, 44].every(isBigEnough);// passed is true
```
- 🎜4[].shift(), <code>함수: 첫 번째 요소 삭제, 매개변수: 없음 반환 값: 삭제된 요소. 🎜
```
   //标准用法
   function isBigEnough(element, index, array) {
    return (element >= 10);}
   var passed = [1, 5, 8, 3, 4].some(isBigEnough);// passed is false
   passed = [2, 4, 18, 13, 4].some(isBigEnough);// passed is true
```
- 🎜⑤[].reverse(), 함수: 배열 요소의 위치 반전, 매개변수 전달 : 없음 ;반환 값: 역방향 배열. 🎜
```
   //标准用法
   var total = [0, 1, 2, 3].reduce(function(sum, value) {
    return sum + value;
  }, 0);// total is 6

   var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
    return a.concat(b);}, []);
    // flattened is [0, 1, 2, 3, 4, 5]
```
- 🎜⑥[].splice(), 함수: 배열 요소의 위치 반전, 매개변수 전달 : ( 인덱스, 삭제할 번호 [선택], 추가할 요소 [선택]) 반환값 : 삭제된 요소들로 구성된 배열. 🎜
```
   //标准用法
   var arr = ["a", "b", "c"];
   var iterator = arr.entries();// undefined
   console.log(iterator);// Array Iterator {}
   console.log(iterator.next().value); // [0, "a"]
   console.log(iterator.next().value); // [1, "b"]
   console.log(iterator.next().value); // [2, "c"]
```
- 🎜7[].fill(), 함수: 시작 인덱스부터 끝 인덱스까지 고정된 값으로 배열을 채웁니다. 의 요소, 매개변수: (배열 요소를 채우는 데 사용되는 값, 시작 인덱스 [select], 끝 인덱스 [select]): 수정된 배열. 🎜
```
   //标准用法
   let arr = [&#39;w&#39;, &#39;y&#39;, &#39;k&#39;, &#39;o&#39;, &#39;p&#39;];
   let eArr = arr.values();// 您的浏览器必须支持 for..of 循环
   // 以及 let —— 将变量作用域限定在 for 循环中
  for (let letter of eArr) {
         console.log(letter);}
```
- 🎜8[].sort(), 함수: 배열의 요소를 정렬하고 배열을 반환하고, 매개변수를 전달합니다. : (정렬 순서를 지정하는 함수[선택 사항]) 반환 값: 정렬된 배열. 🎜
```
 //标准用法
 arr.push(el1, el2 ……elN)；
 //合并两个数组
 [].push.apply(arr1, arr2)
```
🎜🎜🎜3.접속자메서드🎜
- 🎜① [ ].join—함수: 배열(또는 배열 유사 객체)의 모든 요소를 문자열로 결합합니다. , 매개변수 전달: (배열의 각 요소를 구분하는 문자열 지정 [선택 사항]) 반환 값: 모든 배열 요소를 연결하는 문자열 🎜
```
//标准用法
let a = [1 ,2 ,3 ];
a.pop();//3
```
- 🎜②[ ].concat—함수: 두 개 이상의 배열을 연결합니다. , 매개변수 전달: (배열 및/또는 값을 새 배열에 연결[선택 사항]) 반환 값: 병합된 배열; >🎜 ③[ ].slice—함수: 이 메서드는 선택한 배열 부분의 처음부터 끝까지(끝 제외)의 얕은 복사본을 새 배열로 반환합니다. . , 매개변수 전달: (시작 인덱스 [select], 끝 인덱스 [select]); 반환 값: 잘린 배열; code>[ ].toString—함수: 지정된 배열과 해당 요소를 나타내는 문자열을 반환합니다. 매개변수 전달: (없음); : 변환된 문자열; (=[].join())🎜
```
 //标准用法
 arr.unshift(el1, el2 ……elN)；
```
- 🎜⑤[ ].includes — 함수: 배열에 지정된 값이 포함되어 있는지 확인합니다. 매개변수 전달: (찾을 요소) 반환 값 : true 또는 false; /li>
- 🎜⑥[ ].indexOf—함수: 배열 Index, parameters에서 주어진 요소의 첫 번째 요소를 찾습니다. : (찾을 요소); 반환 값: 찾을 수 없음 -1, 인덱스를 찾았습니다. 🎜
```
//标准用法
let a = [1 ,2 ,3 ];
a.shift();//1
```
🎜 🎜🎜4.반복 방법; 🎜
- 🎜
  🎜

위 내용은 JS 배열 배열 메소드 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명：

이전 기사：jQuery에서 선택 플러그인을 사용하여 비동기 실시간 검색을 구현하는 방법다음 기사：jQuery에서 선택 플러그인을 사용하여 비동기 실시간 검색을 구현하는 방법