1. JavaScriptで配列を作成する方法(1)配列コンストラクタを使用する: var arr1 = new Array(); // 空の配列を作成 var arr2 = new Array(10); // 20 個の項目を持つ配列を作成 var arr3 = new Array("zs","ls","ww"); // 3 つの文字列を持つ配列を作成 (2)配列リテラル表記を使用する: var arr4 = []; // 空の配列を作成する var arr5 = [10]; // 1 つの項目を持つ配列を作成する var arr6 = ["zs","ls","ww"]; // 3 つの文字列を持つ配列を作成する 2. 配列メソッドの概要
3. 方法の詳細な説明1.結合()機能: 指定された区切り文字に従って配列内のすべての要素を文字列に格納し、その文字列を返します。 パラメータ: join(str); パラメータはオプションで、デフォルトでは "," に設定され、渡された文字が区切り文字として使用されます。 var arr = [1,2,3]; console.log(arr.join()); //1,2,3 console.log(arr.join("-")); //1-2-3 join() メソッドを使用すると、文字列を繰り返すことができます。文字列と繰り返し回数を渡すだけで、繰り返される文字列が返されます。関数は次のとおりです。 関数 repeatString(str, n) { 新しい配列(n + 1).join(str)を返します。 } console.log(repeatString("abc", 3)); // abcabcabc console.log(repeatString("Hi", 5)); // HiHiHiHiHi 2.ポップ()pop(): 配列の末尾から最後の項目を削除し、配列の長さを減らしてから、削除した項目を返します。 ar ar = [1,2,3]; コンソールログ(arr.pop()); //3 console.log(arr); //[1,2]---元の配列の変更 3.シフト()機能: このメソッドは、配列の最初の要素を削除して返すために使用されます。 var arr = [1,2,3] コンソールログ(arr.shift()); //1 console.log(arr); //[2,3]---元の配列の変更 4. プッシュ()機能: 配列の末尾に 1 つ以上の要素を追加し、新しい長さを返します。 var arr = [1,2,3]; console.log(arr.push("hello")); //4 console.log(arr); //[1,2,3,"hello"]---元の配列の変更console.log(arr.push("a","b")); //6 console.log(arr); //[1,2,3,"hello","a","b"]---元の配列の変更 5.シフト解除()機能: 配列の先頭に 1 つ以上の要素を追加し、新しい長さを返します。 var arr = [1,2,3]; console.log(arr.unshift("hello")); //4 console.log(arr); //["hello",1,2,3]---元の配列の変更 console.log(arr.unshift("a","b")); //6 console.log(arr); //["a","b","hello",1,2,3]---元の配列の変更 6.連結()機能: 元の配列にパラメータを追加します。このメソッドは、まず現在の配列のコピーを作成し、次に受け取ったパラメータをコピーの末尾に追加し、最後に新しく構築された配列を返します。 concat() メソッドに引数が渡されない場合、現在の配列がコピーされ、そのコピーが返されます。 定数arr1 = [1,2,3]; 定数arr2 = [4,5,6]; arr3 を arr1 と連結します。 console.log(arr3); //[1,2,3,4,5,6] 7. スライス()機能: 元の配列の指定された開始添え字から終了添え字までの項目で構成される新しい配列を返します。 slice() メソッドは、返される項目の開始位置と終了位置の 1 つまたは 2 つのパラメーターを受け入れることができます。引数が 1 つだけの場合、slice() メソッドは引数で指定された位置から現在の配列の末尾までのすべての項目を返します。 2 つの引数が指定された場合、メソッドは開始位置と終了位置の間にある項目を返しますが、終了位置は含まれません。 var arr = [1,3,5,7,9,11]; var arrCopy1 = arr.slice(1); var arrCopy2 = arr.slice(1,4); var arrCopy3 = arr.slice(1,-2); var arrCopy4 = arr.slice(-4,-1); console.log(arr); //[1, 3, 5, 7, 9, 11] (元の配列は変更されません) console.log(arrCopy1); //[3, 5, 7, 9, 11] console.log(arrCopy2); //[3, 5, 7] console.log(arrCopy3); //[3, 5, 7] console.log(arrCopy4); //[5, 7, 9] 8.ソート()機能: 配列内の要素を、デフォルトでは昇順で並べ替えます。 var arr = [6,1,5,2,3]; console.log(arr.sort()); //[1, 2, 3, 5, 6] console.log(arr); //[1, 2, 3, 5, 6]---元の配列の変更 9.逆()機能: 配列項目の順序を逆にします。 var arr = [13, 24, 51, 3]; console.log(arr.reverse()); //[3, 51, 24, 13] console.log(arr); //[3, 51, 24, 13] (元の配列が変更されます) 10.toString() メソッド機能: パラメータなしの join() と同様に、文字列に変換します。このメソッドは、データが暗黙的な型変換を受けるときに自動的に呼び出されます。手動で呼び出された場合は、直接文字列に変換されます。 var arr = [1,2,3]; console.log(arr.toString()); //1,2,3 console.log(arr); //[1,2,3]---元の配列は変更されていません 11.スプライス()機能: 削除、挿入、置換を実現できる、さまざまな用途を持つ非常に強力な配列メソッドです。 削除: 削除する最初の項目の位置と削除する項目の数という 2 つのパラメータを指定するだけで、任意の数の項目を削除できます。たとえば、splice(0,2) は配列の最初の 2 つの項目を削除します。 挿入: 開始位置、0 (削除する項目の数)、挿入する項目の 3 つのパラメータのみを指定することで、指定した位置に任意の数の項目を挿入できます。たとえば、splice(2,0,4,6) は、現在の配列の位置 2 から 4 と 6 を挿入します。 置換: 指定した位置に任意の数の項目を挿入し、同時に任意の数の項目を削除できます。開始位置、削除する項目の数、挿入する項目の数の 3 つのパラメータを指定するだけです。挿入されたアイテムの数は、削除されたアイテムの数と同じである必要はありません。たとえば、splice (2,1,4,6) は、現在の配列の位置 2 にある項目を削除し、位置 2 から 4 と 6 を挿入します。 splice() メソッドは常に、元の配列から削除された項目を含む配列を返します。項目が削除されなかった場合は空の配列を返します。 var arr = [1,3,5,7,9,11]; var arrRemoved = arr.splice(0,2); console.log(arr); //[5, 7, 9, 11] console.log(arrRemoved); //[1, 3] var arrRemoved2 = arr.splice(2,0,4,6); console.log(arr); // [5, 7, 4, 6, 9, 11] console.log(arrRemoved2); // [] var arrRemoved3 = arr.splice(1,1,2,4); console.log(arr); // [5, 2, 4, 4, 6, 9, 11] console.log(arrRemoved3); //[7] 12.値()機能: 配列の元の値 (通常は配列自体) を返します。これは通常、js によってバックグラウンドで呼び出され、コード内に明示的に表示されません。 var arr = [1,2,3]; console.log(arr.valueOf()); //[1,2,3] console.log(arr); //[1,2,3] //配列自体が返されることを証明するには console.log(arr.valueOf() == arr); //true 13.インデックス()機能: 配列内の指定されたデータの位置を左から右に照会します。指定されたデータが存在しない場合は -1 を返します。このメソッドはクエリメソッドであり、配列を変更しません。 パラメータ: indexOf(value, start); value はクエリするデータです。start はオプションで、クエリの開始位置を示します。start が負の数の場合、配列の末尾から前方にカウントします。値が見つからない場合、メソッドは -1 を返します。 var arr = ["h","e","l","l","o"]; console.log(arr.indexOf("l")); //2 console.log(arr.indexOf("l",3)); //3 console.log(arr.indexOf("l",4)); //-1 console.log(arr.indexOf("l",-1)); //-1 console.log(arr.indexOf("l",-3)); //2 14.最後のインデックス()機能: 配列内の指定されたデータの位置を右から左に照会します。指定されたデータが存在しない場合は -1 を返します。このメソッドはクエリメソッドであり、配列を変更しません。 パラメータ: lastIndexOf(value, start); value はクエリするデータです。start はオプションで、クエリの開始位置を示します。start が負の数の場合、配列の末尾から前方にカウントします。value が見つからない場合、メソッドは -1 を返します。 var arr = ["h","e","l","l","o"]; console.log(arr.lastIndexOf("l")); //3 console.log(arr.lastIndexOf("l",3)); //3 console.log(arr.lastIndexOf("l",1)); //-1 console.log(arr.lastIndexOf("l",-3)); //2 console.log(arr.lastIndexOf("l",-4)); //-1 15. 各()機能: 配列をループし、配列内の各項目に対して指定された関数を実行します。このメソッドには戻り値はありません。 パラメータ: すべて関数型で、パラメータはデフォルトで渡されます。パラメータは、走査する配列の内容、対応する配列インデックス、および配列自体です。 var arr = [1, 2, 3, 4, 5]; arr.forEach(関数(x, インデックス, a){ console.log(x + '|' + インデックス + '|' + (a === arr)); }); // 出力は次のようになります: // 1|0|真 // 2|1|真 // 3|2|真 // 4|3|真 // 5|4|真 16.マップ()機能: 配列内の各項目に対して指定された関数を実行し、各関数呼び出しの結果で構成される配列を返します。 配列内のすべての値を変更したい場合は、mapを使用します。 arr = [10, 30, 50, 60, 120, 230, 340, 450]とします。 newArr = arr.map(n => { とする n * 2を返す }) コンソールにログ出力します。 17.フィルター()機能: フィルター。配列内の各項目に対して指定された関数を実行し、フィルター条件を満たす配列を返します。 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; var arr2 = arr.filter(関数(x, インデックス) { インデックス % 3 === 0 || x >= 8 を返します。 }); console.log(arr2); //[1, 4, 7, 8, 9, 10] 18.すべて()機能: 配列内の各項目が条件を満たしているかどうかを判断します。すべての項目が条件を満たしている場合にのみ true が返されます。 var arr = [1, 2, 3, 4, 5]; var arr2 = arr.every(関数(x) { x < 10 を返します。 }); console.log(arr2); //true var arr3 = arr.every(関数(x) { x < 3 を返します。 }); console.log(arr3); // 偽 19.いくつか()機能: 配列内に条件を満たす項目があるかどうかを判断します。条件を満たす項目が 1 つでもある限り、true を返します。 var arr = [1, 2, 3, 4, 5]; var arr2 = arr.some(関数(x) { x < 3 を返します。 }); console.log(arr2); //true var arr3 = arr.some(関数(x) { x < 1 を返します。 }); console.log(arr3); // 偽 20.削減()機能: 配列の最初の項目から始めて、最後まで 1 つずつ走査し、配列のすべての項目を反復処理して、最終的な戻り値を構築します。 パラメータ: 最初のパラメータは、accumulatorは現在の集計値です。 2番目のパラメータは、配列をループするときの現在の要素です。 3番目のパラメータは、配列要素のインデックス値です。 4番目のパラメータは配列そのものです int: アキュムレータの初期値であり、自分で設定できます 最初の 2 つのパラメータは通常使用され、最後の 2 つのパラメータは一般的に使用されません。最も一般的な使用シナリオは、配列の合計です。 // 機能: 配列内のすべての内容を要約するには、少なくとも2つの値を渡す必要があります。let arr = [10, 30, 50, 60, 120, 230, 340, 450] newArr = arr.reduce((pre, n) => { とする 戻り値: pre + n }, 0) コンソールにログ出力します。 21.reduceRight()機能: (reduce と同様) 配列の最後の項目から開始し、最初の項目まで 1 つずつ順方向に移動して、配列のすべての項目を反復処理し、最終的な戻り値を構築します。 パラメータ:reduce と同じです。 var arr = [1,2,3,4,5]; var sum = arr.reduceRight(function(pre, cur, index, array){ pre + cur を返します。 },10); コンソール.log(合計); //25 22.インデックスを見つける()機能: 指定されたテスト関数を満たす配列の最初の要素のインデックスを返します。そうでない場合は -1 を返します。 arr = [10, 2, 9, 17, 22]とします。 インデックス = arr.findIndex((item) => item > 13) とします。 console.log(インデックス); // 3 要約するこれで、JavaScript 配列の一般的なメソッドの概要に関するこの記事は終了です。より関連性の高い JavaScript 配列メソッドについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
<<: Docker を使用してコンテナ内のルート パスワードを変更する方法
>>: HTML フレーム、Iframe、フレームセットの違い
0. 概要Zabbix は非常に強力なオープンソースの監視ツールです。以下では、Zabbix がテー...
MySQL5.6 SSLファイルの作成方法公式ドキュメント: https://dev.mysql.c...
一般的に、データ テーブル内の列を ID 列として設定すると、ID 列の表示値を手動で ID 列に挿...
1. csvファイルをインポートする次のコマンドを使用します。 1.mysql> infile...
textarea の形式は保存時にデータベースに保存できますが、表示時には /n と相互に変換できな...
この記事では、ソシュールの言語哲学などの理論に基づいて、CSS の class 属性は不要であると主...
以下の記事を読んだ後、プロジェクトをサーバーにデプロイできます。Tomcat、JDK、MySQL な...
ソフトウェアバージョンウィンドウズ: ウィンドウズ10 MySQL: mysql-8.0.17-wi...
1. エフェクトHTMLを送信する <div id="送信ボタン">...
純粋な CSS を使用して、マウスが行の上を通過するときに行の背景色を変更し、その行にフォーカスがあ...
序文最近プロジェクトに取り組んでいたとき、UI デザインのフォント サイズは 10 ピクセルでした。...
HTTP ステータス コードは、Web サーバーの HTTP 応答ステータスを示すために使用される ...
10 日間のチュートリアルでは、最も理解しやすい言語を使用し、最も基本的なことから始めて、誰もが W...
テーブル内の min-width と max-width プロパティの設定 <テーブル>...
Zhihu Discovery コラムのタイトル画像は、通常、以下のように表示されます。明らかに、グ...