ホームページ > 記事 > ウェブフロントエンド > JavaScriptの配列操作関数のメソッドを解説した詳細なサンプルコード
JavaScriptの配列操作関数のメソッドを解説した詳細なサンプルコード
- 黄舟オリジナル
- 2017-03-16 14:49:181288ブラウズ
1. concat() は 2 つ以上の array を連結します
このメソッドは既存の配列を変更せず、接続された配列のコピーのみを返します。
例:
1 <script type="text/javascript"> 2 var arr = [1, 2, 3]; 3 var arr1 = [11, 22, 33]; 4 document.write(arr.concat(4, 5, arr1)); 5 </script>
出力結果:
1,2,3,4,5,11,22,33
2. join()
配列のすべての要素をstringに入れます。要素は指定された区切り文字で区切られます。
例:
1 <script type="text/javascript"> 2 var arr = ['item 1', 'item 2', 'item 3']; 3 var list = '<ul><li>' + arr.join('</li><li>') + '</li></ul>'; 4 </script>
list result:
'ff6d136ddc5fdfeffaf53ff6ee95f18525edfb22a4f469ecb59f1190150159c6item 1bed06894275b65c1ab86501b08a632eb25edfb22a4f469ecb59f1190150159c6item 2bed06894275b65c1ab86501b08a632eb25edfb22a4f469ecb59f1190150159c6item 3bed06894275b65c1ab86501b08a632eb2c7124109f4af677fe5803048cc15dc5'
これが断然最速の方法です!システムが内部で何を行うかに関係なく、ネイティブ コード (join() など) を使用すると、通常は非ネイティブ コードよりもはるかに高速になります。 ——James Padolsey、james.padolsey.com
3. Pop() 削除して配列の最後の要素を返します
Pop() メソッドは配列の最後の要素を削除し、配列の長さを減らします。 1を引いて、削除された要素の値を返します。 配列がすでに空の場合、pop() は配列を変更せず、未定義の値を返します 例:1 <script type="text/javascript"> 2 var arr = ["George", "John", "Thomas"]; 3 document.write(arr + "<br/>"); 4 document.write(arr.pop() + "<br/>"); 5 document.write(arr); 6 </script>出力結果:
George,John,Thomas Thomas George,John4. Push() は 1 つ以上の要素を末尾に追加します。配列を返し、新しい長さを返します例:
1 <script type="text/javascript">
2 var arr = ["George", "John", "Thomas"];
3 document.write(arr + "<br/>");
4 document.write(arr.push("James") + "<br/>");
5 document.write(arr);
6 </script>出力結果: George,John,Thomas 4 George,John,Thomas,James5, unsh
ift() は、1 つ以上の要素を配列の先頭に追加し、新しい長さを返します
例:1 <script type="text/javascript">
2 var arr = ["George", "John", "Thomas"];
3 document.write(arr + "<br/>");
4 document.write(arr.unshift("James") + "<br/>");
5 document.write(arr);
6 </script>出力結果: George,John,Thomas 4 James,George,John,Thomas6. reverse() は配列内の要素の順序を反転します例:
1 <script type="text/javascript"> 2 var arr = ["George", "John", "Thomas"]; 3 document.write(arr + "<br/>"); 4 document.write(arr.reverse()); 5 </script>出力結果:
George,John,Thomas Thomas,John,George7.配列例:
1 <script type="text/javascript"> 2 var arr = ["George", "John", "Thomas"]; 3 document.write(arr + "<br/>"); 4 document.write(arr.shift() + "<br/>"); 5 document.write(arr); 6 </script>出力結果:
George,John,Thomas George John,Thomas8、slice(start,
end) は、既存の配列から選択された要素を返します
このメソッドは配列を変更するのではなく、 subarray例:1 <script type="text/javascript"> 2 var arr = ["George", "John", "Thomas"]; 3 document.write(arr + "<br/>"); 4 document.write(arr.slice(1) + "<br/>"); // 从第一个元素开始截取到 数组结尾 5 document.write(arr); 6 </script>出力結果:
George,John,Thomas John,Thomas George,John,Thomas9,
sort() 配列の要素
を配列への参照 でソートします。配列は元の配列でソートされ、コピーは生成されないことに注意してください
このメソッドのデフォルトは、文字エンコーディング (ASCII) の順にソートされます例:1 <script type="text/javascript"> 2 var arr = new Array(6); 3 arr[0] = "John"; 4 arr[1] = "George"; 5 arr[2] = "Thomas"; 6 document.write(arr + "<br/>"); 7 document.write(arr.sort()); 8 </script>出力結果:
John,George,Thomas George,John,Thomas別の例を見てみましょう例:
1 <script type="text/javascript"> 2 var arr = new Array(6); 3 arr[0] = 10 4 arr[1] = 5 5 arr[2] = 40 6 arr[3] = 25 7 arr[4] = 1000 8 arr[5] = 1 9 document.write(arr + "<br/>"); 10 document.write(arr.sort()); 11 </script>出力結果:
10,5,40,25,1000,1 1,10,1000,25,40,5数値の大きさでソートしたい場合は、デフォルトのソート方法を変更し、ソート規則を自分で指定する必要があります。
次のように:
1 <script type="text/javascript">
2 var arr = new Array(6);
3 arr[0] = 10
4 arr[1] = 5
5 arr[2] = 40
6 arr[3] = 25
7 arr[4] = 1000
8 arr[5] = 1
9 document.write(arr + "<br/>");
10 document.write(arr.sort(function (a, b) {return a - b;}));// 从大到小
11 </script> 出力結果: 10,5,40,25,1000,1 1,5,10,25,40,1000降順に並べ替えたい場合はどうすればよいですか? ソートルールを次のように変更します: function (a, b) {return b – a;}OKです10. splice()は要素を削除し、新しい要素をarrayに追加しますsplice()メソッドslide()メソッドの機能が異なります。 splice()メソッドは配列を直接変更します(1) 指定範囲の配列要素を削除します:
1 <script type="text/javascript"> 2 var arr = new Array(6); 3 arr[0] = "George"; 4 arr[1] = "John"; 5 arr[2] = "Thomas"; 6 arr[3] = "James"; 7 arr[4] = "Adrew"; 8 arr[5] = "Martin"; 9 10 document.write(arr + "<br/>"); 11 arr.splice(2, 3); // 删除第三个元素以后的三个数组元素(包含第三个元素) 12 document.write(arr); 13 </script>出力結果:
George,John,Thomas,James,Adrew,Martin George,John,Martin(2) 指定された範囲から開始しますsubscript 指定した要素を挿入(要素数制限なし):
1 <script type="text/javascript"> 2 var arr = new Array(6); 3 arr[0] = "George"; 4 arr[1] = "John"; 5 arr[2] = "Thomas"; 6 arr[3] = "James"; 7 arr[4] = "Adrew"; 8 arr[5] = "Martin"; 9 10 document.write(arr + "<br/>"); 11 arr.splice(2, 0, "William","JACK"); // 在第三个元素之前插入"William","JACK" 12 document.write(arr); 13 </script>出力結果:
George,John,Thomas,James,Adrew,Martin George,John,William,JACK,Thomas,James,Adrew,Martin(3) 指定範囲の配列要素を削除し、指定した要素に置き換えます(要素数制限なし) ):
1 <script type="text/javascript"> 2 var arr = new Array(6); 3 arr[0] = "George"; 4 arr[1] = "John"; 5 arr[2] = "Thomas"; 6 arr[3] = "James"; 7 arr[4] = "Adrew"; 8 arr[5] = "Martin"; 9 10 document.write(arr + "<br/>"); 11 arr.splice(2,3,"William","JACK"); // 删除第三个元素以后的三个数组元素(包含第三个元素)，并用"William","JACK"进行替换 12 document.write(arr); 13 </script>出力結果:
George,John,Thomas,James,Adrew,Martin George,John,William,JACK,Martin
以上がJavaScriptの配列操作関数のメソッドを解説した詳細なサンプルコードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。