ホームページ > 記事 > ウェブフロントエンド > JavaScriptの配列操作関数のメソッドを解説した詳細なサンプルコード
このメソッドは既存の配列を変更せず、接続された配列のコピーのみを返します。
例:
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
配列のすべての要素を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
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
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,
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,
参照 でソートします。配列は元の配列でソートされ、コピーは生成されないことに注意してください
このメソッドのデフォルトは、文字エンコーディング (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 サイトの他の関連記事を参照してください。