ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScriptでよく使われる配列関数の使用例をまとめました。

JavaScriptでよく使われる配列関数の使用例をまとめました。

伊谢尔伦
リリース: 2017-07-25 11:52:29
オリジナル
1320 人が閲覧しました

一般的な配列関数

concat

既存の配列の後に配列を追加し、既存の配列に影響を与えずに新しい配列を返します:

var a = [123];
var b = "sunnycat";
var c =    ["www",21,"ido"];
var d = {x:3.14, y:"SK"};
var e = [1,2,3,4,[5,6,[7,8]]];
alert(a.concat(b));     // -> 123,sunnycat
alert(a);  //    -> 123
alert(b.concat(c, d));       // -> sunnycatwww,21,ido[object    Object]
alert(c.concat(b));     // -> www,21,ido,sunnycat
alert(e.concat(11,22,33).join(" #    "));       // -> 1 # 2 # 3    # 4 # 5,6,7,8 # 11 # 22 # 33
ログイン後にコピー

これは配列または文字列にのみ使用できることに注意してください。接続 (前の a) が数値、ブール値、またはオブジェクトの場合、文字列が配列に接続されると、その文字列は配列の最初の要素と結合されます。新しい要素を形成する一方、配列接続文字列は新しい要素を追加します (この点については私は全体像を知りません。詳細を知っている場合は開示してください)。配列とオブジェクトを含む配列の場合、それらは接続後もそのまま残ります。

join

指定された区切り文字を使用して配列を文字列に接続します:

var a = ['a','b','c','d','e','f','g'];
lert(a.join(","));   // -> a,b,c,d,e,f,g 相当于a.toString()
alert(a.join(" x "));  // -> a x b x c x d x e x f x g
ログイン後にコピー

これは理解しやすいですが、配列内に配列がある場合は変換されないことに注意してください。 be

var a =    ['a','b','c','d','e','f','g',[11,22,33]];
alert(a.join(" * "));  // -> a * b * c * d * e * f * g *    11,22,33
ログイン後にコピー

など、デフォルトの toString() の代わりに join で指定された文字列接続を使用します。 注: 配列内の配列は * で接続されていません。

pop

配列の最後の要素を削除し、要素

var a =    ["aa","bb","cc"];
document.write(a.pop());    // -> cc
document.write(a);        // -> aa, bb
ログイン後にコピー

注: 配列が空の場合は、未定義が返されます

push

配列の後に配列を追加し、配列の新しい長さを返します

var a =    ["aa","bb","cc"];
document.write(a.push("dd"));    // -> 4
document.write(a);        // -> aa,bb,cc,dd
document.write(a.push([1,2,3]));  // -> 5
document.write(a);        // -> aa,bb,cc,dd,1,2,3
ログイン後にコピー

concat との違いは、concat は影響を受けないことです。元の配列を直接変更して新しい配列を返しますが、push は元の配列を直接変更して配列の新しい長さを返します

sort

配列の並べ替え、最初に例を見てみましょう

var a = [11,2,3,33445,5654,654,"asd","b"];
alert(a.sort()); // -> 11,2,3,33445,5654,654,asd,b
ログイン後にコピー

結果は非常に驚くべきものでしょうか?はい、ソートは整数のサイズに基づいて行われませんが、最初の文字の ANSI コードを比較することにより、小さい方が最初にランク付けされます。同じ場合は、2 番目の文字を取得して再度比較します。整数値で比較したい場合は、

var a = [11,2,3,33445,5654,654];
a.sort(function(a,b) {
return a - b;
});
alert(a);  //    -> 2,3,11,654,5654,33445
ログイン後にコピー

sort() メソッドを使用します。これは、数値以外の場合はさらに判断が必要な単純な例です。ここでは詳細は説明しません。逆ソートと配列のソートは同じです。比較のために最初の文字の ASCII 値を取得します

var a = [11,3,5,66,4];
alert(a.reverse());  // -> 4,66,5,3,11
ログイン後にコピー

配列にも配列が含まれている場合は、オブジェクトとして扱われます。 、要素は抽出されません

var a = ['a','b','c','d','e','f','g',[4,11,33]];
alert(a.reverse());  // -> 4,11,33,g,f,e,d,c,b,a
alert(a.join(" * "));  // -> 4,11,33 * g * f * e * d * c * b * a
ログイン後にコピー
論理的には 11 の最後の行である必要があります。ここでは 4 ,11,33 が完全なオブジェクト比較とみなされ、最初にランク付けされます。理解できない場合は、 join() を使用して文字列を結合すると、より明確になります。

shift

配列の最初の要素を削除し、pop

var a =    ["aa","bb","cc"];
document.write(a.shift());   // -> aa
document.write(a);        // -> bb,cc
ログイン後にコピー

と同様に Element を返します。 注: 配列が空の場合は、未定義を返します。

unshift

shiftの逆で、配列の先頭に要素を追加し、配列の新しい長さを返します

var a =    ["aa","bb","cc"];
document.write(a.unshift(11));   // -> 4 注:IE下返回undefined
document.write(a);        // -> 11,aa,bb,cc
document.write(a.unshift([11,22]));   // -> 5
document.write(a);        // -> 11,22,11,aa,bb,cc
document.write(a.unshift("cat"));  // -> 6
document.write(a);        // -> cat,11,22,11,aa,bb,cc
ログイン後にコピー

IEではこのメソッドに注意してください。以下は、Microsoftのようなunknownを返します。 Firefox

slice

の配列の新しい長さを正しく使用して、配列フラグメント

var a = ['a','b','c','d','e','f','g'];
alert(a.slice(1,2));  // -> b
alert(a.slice(2));    // -> c,d,e,f,g
alert(a.slice(-4));   // -> d,e,f,g
alert(a.slice(-2,-6));    // -> 空
ログイン後にコピー

a.slice(1,2)を添字1から始めて添字2の間の番号まで返すことができます。添字 2 の要素は含まれないことに注意してください。パラメータが 1 つしかない場合、デフォルトでは下から 4 番目の要素が返されるため、最後から 4 番目の要素が返されます。最後から 2 行目から始まる行は逆方向にインターセプトされるため、当然前の要素は取得できないため、a.slice(-6,-2), b,c, に変更すると空の配列が返されます。 d, e

splice

配列からフラグメントの要素を削除し、削除された要素を返します

var a = [1,2,3,4,5,6,7,8,9];
document.write(a.splice(3,2));    // -> 4,5
document.write(a);        // -> 1,2,3,6,7,8,9
document.write(a.splice(4));  // -> 7,8,9 注:IE下返回空
document.write(a);        // -> 1,2,3,6
document.write(a.splice(0,1));    // -> 1
document.write(a);        // -> 2,3,6
document.write(a.splice(1,1,["aa","bb","cc"]));   // -> 3
document.write(a);        // -> 2,aa,bb,cc,6,7,8,9
document.write(a.splice(1,2,"ee").join("#")); // -> aa,bb,cc#6
document.write(a);        // -> 2,ee,7,8,9
document.write(a.splice(1,2,"cc","aa","tt").join("#"));  // -> ee#7
document.write(a);        // -> 2,cc,aa,tt,8,9
ログイン後にコピー

このメソッドの 2 番目のパラメータは、IE では必須であることに注意してください。入力されていない場合は、デフォルトで 0 になります。 a.splice (4) など、IE では空を返します。効果は a.splice(4,0) と同等です

toString

配列だけでなく、すべてのオブジェクトが文字列に変換できます。このメソッドを使用してください

var a =    [5,6,7,8,9,["A","BB"],100];
document.write(a.toString());    // -> 5,6,7,8,9,A,BB,100
var b = new Date()
document.write(b.toString());    // -> Sat Aug 8 17:08:32 UTC+0800    2009
var c = function(s){
alert(s);
}
document.write(c.toString());    // -> function(s){ alert(s); }
ログイン後にコピー

Boolean 値は true または false を返し、オブジェクトは [オブジェクト objectname] を返します。 join() メソッドと比較すると、join() は 1 次元配列のみを置き換えますが、toString() は全体を完全に平坦化します。同時に、このメソッドは 10 進数、2 進数、8 進数、および 16 進数の変換にも使用できます。例:

var a =    [5,6,7,8,9,"A","BB",100];
for(var i=0; i<a.length; i++){
document.write(a[i].toString()    + " 的二进制是 "    + a[i].toString(2) + " ,八进制是 " + a[i].toString(8) + " ,十六进制是 " + a[i].toString(16));  //    -> 4,5
}
ログイン後にコピー

出力結果:

5 的二进制是 101 ,八进制是 5 ,十六进制是 5
6 的二进制是 110 ,八进制是 6 ,十六进制是 6
7 的二进制是 111 ,八进制是 7 ,十六进制是 7
8 的二进制是 1000 ,八进制是 10 ,十六进制是 8
9 的二进制是 1001 ,八进制是 11 ,十六进制是 9
A 的二进制是 A ,八进制是 A ,十六进制是 A
BB 的二进制是 BB ,八进制是 BB ,十六进制是 BB
100 的二进制是 1100100 ,八进制是 144 ,十六进制是 64
ログイン後にコピー

変換のみを実行できます。配列全体が変換された場合は、配列を変更せずに返します

toLocaleString

主に Date オブジェクトで使用されるローカル形式の文字列を返します

var a = new Date();
document.write(a.toString());    // -> Sat Aug 8 17:28:36 UTC+0800    2009
document.write(a.toLocaleString());   // -> 2009年8月8日 17:28:36
document.write(a.toLocaleDateString());   // -> 2009年8月8日
ログイン後にコピー

違いは、toString() が標準形式を返し、toLocaleString であることです。 () はローカル形式の完全な日付を返します ([コントロール パネル]>[地域と言語のオプション] で、[時刻] および [長い日付] 形式を変更します)。toLocaleDateString() は toLocaleString() と同じです。時間が欠落していることを除いて

valueOf

は、異なるオブジェクトに従って返されます。異なる元の値は、出力に使用される場合はtoString()に似ていますが、toString()は文字列型を返し、valueOf()は元のオブジェクトの型

var a = [1,2,3,[4,5,6,[7,8,9]]];
var b = new Date();
var c = true;
var d = function(){
alert("sunnycat");
};
document.write(a.valueOf());    // -> 1,2,3,4,5,6,7,8,9
document.write(typeof (a.valueOf()));  // -> object
document.write(b.valueOf());    // -> 1249874470052
document.write(typeof(b.valueOf()));  // -> number
document.write(c.valueOf());    // -> true
document.write(typeof(c.valueOf()));  // -> boolean
document.write(d.valueOf());    // -> function () {    alert("sunnycat"); }
document.write(typeof(d.valueOf()));  // -> function
ログイン後にコピー
配列もオブジェクトであるため、 typeof (a.valueOf()) は object を返しますが、返されるオブジェクトは依然として多次元配列です

var a = [1,2,3,[4,5,6,[7,8,9]]];
var aa = a.valueOf();
document.write(aa[3][3][1]); // -> 8
ログイン後にコピー

Date オブジェクトは 1970 年 1 月 1 日からのミリ秒数を返します。また、Math オブジェクトと Error オブジェクトには valueOf メソッドがありません。

以上がJavaScriptでよく使われる配列関数の使用例をまとめました。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート