ホームページ >ウェブフロントエンド >jsチュートリアル >JS配列の配列メソッドの概要

JS配列の配列メソッドの概要

一个新手オリジナル: 2017-10-26 10:50:182658ブラウズ

1.Array配列メソッド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 メソッド ————「Access メソッド」は配列の値を変更しません。それ自体; 🎜
- 🎜Iteration メソッド————「トラバーサルメソッド」;🎜
🎜🎜2.Mutator Method🎜
- 🎜①[ ].push—関数: 1 つ以上の要素を配列の末尾の parameters: (単一または複数の配列要素); return value: 新しい配列の長さ 🎜
```
 //标准用法
 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—関数: 配列の先頭に 1 つ以上の要素を追加します。パラメータを渡します: (単一または複数の配列要素); <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
```
- 🎜④[].shift()、<code>Function: 最初の要素を削除します。parameters: なし。戻り値: 削除された要素。 🎜
```
   //标准用法
   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()、関数: 配列要素の位置を反転、パラメータを渡す : ( インデックス、削除する番号 [select]、追加する要素 [select]); 戻り値: 削除された要素で構成される配列。 🎜
```
   //标准用法
   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"]
```
- 🎜⑦[].fill(), Function: 配列の開始インデックスから終了インデックスまでの固定値を入力します。すべての要素、parameters: (配列要素を埋めるために使用される値、開始インデックス [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);}
```
- 🎜⑧[].sort()、Function: 配列の要素を並べ替えて配列を返し、パラメータを渡します: (ソート順を指定する関数 [オプション]); 戻り値: 配列された配列。 🎜
```
 //标准用法
 arr.push(el1, el2 ……elN)；
 //合并两个数组
 [].push.apply(arr1, arr2)
```
🎜🎜🎜3.アクセサーメソッド🎜
- 🎜① [ ].join—関数: 配列 (または配列のようなオブジェクト) のすべての要素を文字列に結合します。、 パラメータを渡す: (配列の各要素を区切る文字列を指定します [オプション]); 戻り値: すべての配列要素を連結した文字列 🎜
```
//标准用法
let a = [1 ,2 ,3 ];
a.pop();//3
```
- 🎜②[ ].concat—関数: 2 つ以上の配列を連結します。、 パラメータの受け渡し: (配列および/または値を新しい配列に接続します [オプション]); 戻り値: 結合された配列 🎜
```
 //标准用法
 arr.unshift(el1, el2 ……elN)；
```
- >🎜③[ ].slice—Function: このメソッドは、選択された配列の最初から最後までの部分 (最後を除く) の浅いコピーを新しい配列に返します。。 , パラメータの受け渡し: (開始インデックス [select], 終了インデックス [select]); 戻り値: 切り捨てられた配列; code>[ ].toString—Function: 指定された配列とその要素を表す文字列を返します。パラメータを渡す: 戻り値。 : 変換された文字列 (=[].join())🎜
```
//标准用法
let a = [1 ,2 ,3 ];
a.shift();//1
```
- 🎜⑤[ ].includes —関数: 配列に指定された値が含まれているかどうかを判断します。 パラメータを渡す: (検出される要素); 戻り値 : true または false; /li>
- 🎜⑥[ ].indexOf—関数: 配列 Index、parameters 内の指定された要素の最初の要素を検索します。 : (見つかった要素); 戻り値: 見つかりません -1、インデックスが見つかりました 🎜🎜4.反復メソッド。 🎜
  - 🎜
    🎜

以上がJS配列の配列メソッドの概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：jQuery の select プラグインを使用して非同期リアルタイム検索を実装する方法次の記事：jQuery の select プラグインを使用して非同期リアルタイム検索を実装する方法

続きを見る