JavaScript配列の一般的なメソッドの例のまとめ

一般的な配列メソッド
concat() メソッド
join() メソッド
pop() メソッド
push() メソッド
逆() メソッド
shift() メソッド
スライス() メソッド
sort() メソッド
splice() メソッド
toSource() メソッド
toString() メソッド
toLocaleString() メソッド
unshift() メソッド
valueOf() メソッド

はじめに: 実際の開発では、フロントエンドエンジニアはページのレイアウトやスタイルを書くだけでなく、バックエンドから返されるデータを処理する必要があります。返されるデータの多くはJSON形式で、一般的にはオブジェクトまたは配列が返されます。以下では、開発で使いやすいように、よく使われる配列の使い方をまとめます。

一般的な配列メソッド

concat() メソッド

concat() メソッドは、2 つ以上の配列を連結するために使用されます。

このメソッドは既存の配列を変更せず、連結された配列のコピーを返すだけです。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
var arr2 = 新しい配列(3)
arr2[0] = "ジェームズ"
arr2[1] = "アンドリュー"
arr2[2] = "マーティン"
 
var arr3 = 新しい配列(2)
arr3[0] = "ウィリアム"
arr3[1] = "フランクリン"
 
ドキュメントの書き込み(arr.concat(arr2,arr3))
//ジョージ、ジョン、トーマス、ジェームズ、アンドリュー、マーティン、ウィリアム、フランクリン

join() メソッド

join() メソッドは、配列内のすべての要素を文字列に格納するために使用されます。

要素は指定された区切り文字で区切られます。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr.join("."))
//ジョージ・ジョン・トーマス

pop() メソッド

pop() メソッドは、配列の最後の要素を削除して返すために使用されます。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
ドキュメントを書き込みます
 
//ジョージ、ジョン、トーマス
 
ドキュメントの書き込み(arr.pop())
 
//トーマス
 
ドキュメントを書き込みます
//ジョージ、ジョン

push() メソッド

push() メソッドは、配列の末尾に 1 つ以上の要素を追加し、新しい長さを返します。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr + "<br />")//ジョージ、ジョン、トーマス
document.write(arr.push("ジェームズ") + "<br />")
 
document.write(arr)//ジョージ、ジョン、トーマス、ジェームズ

逆() メソッド

Reverse() メソッドは、配列内の要素の順序を逆にするために使用されます。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr + "<br />")//ジョージ、ジョン、トーマス
 
document.write(arr.reverse()) //トーマス、ジョン、ジョージ

shift() メソッド

shift() メソッドは、配列の最初の要素を削除し、最初の要素の値を返すために使用されます。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr + "<br />")//ジョージ、ジョン、トーマス
document.write(arr.shift() + "<br />")//ジョージ
document.write(arr)//ジョン、トーマス

slice() メソッド

slice() メソッドは、既存の配列から選択された要素を返します。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr + "<br />")//ジョージ、ジョン、トーマス
document.write(arr.slice(1) + "<br />")//ジョン、トーマス
document.write(arr) //ジョージ、ジョン、トーマス

sort() メソッド

sort() メソッドは、配列の要素を並べ替えるために使用されます。

関数 sortNumber(a,b)
{
a - b を返す
}
 
var arr = 新しい配列(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"
 
document.write(arr + "<br />")//10,5,40,25,1000,1
document.write(arr.sort(sortNumber))//1,5,10,25,40,1000

splice() メソッド

splice() メソッドは、配列に要素を追加したり、配列から要素を削除したりして、削除された要素を返します。

var arr = 新しい配列(6)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
arr[3] = "ジェームズ"
arr[4] = "アンドリュー"
arr[5] = "マーティン"
 
document.write(arr + "<br />")//ジョージ、ジョン、トーマス、ジェームズ、アンドリュー、マーティン
arr.splice(2,0,"ウィリアム")
document.write(arr + "<br />")//ジョージ、ジョン、ウィリアム、トーマス、ジェームズ、アンドリュー、マーティン

toSource() メソッド

toSource() メソッドはオブジェクトのソースコードを表します。

このプリミティブ値は、Array オブジェクトから派生したすべてのオブジェクトに継承されます。

toSource() メソッドは通常、JavaScript によってバックグラウンドで自動的に呼び出され、コード内に明示的に表示されません。

関数 従業員(名前,職業,生年月日)
{
this.name=名前;
this.job=ジョブ;
this.born=生まれた;
}
 
var bill = new employee("ビル・ゲイツ","エンジニア",1985);
 
document.write(bill.toSource()); //({name:"ビル・ゲイツ", job:"エンジニア", born:1985})

toString() メソッド

toString() メソッドは配列を文字列に変換し、結果を返します。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr.toString()) //ジョージ、ジョン、トーマス

toLocaleString() メソッド

配列をローカル文字列に変換します。

var arr = 新しい配列(3)
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr.toLocaleString()) //ジョージ、ジョン、トーマス

unshift() メソッド

unshift() メソッドは、配列の先頭に 1 つ以上の要素を追加し、新しい長さを返します。

var arr = 新しい配列()
arr[0] = "ジョージ"
arr[1] = "ジョン"
arr[2] = "トーマス"
 
document.write(arr + "<br />")//ジョージ、ジョン、トーマス
document.write(arr.unshift("ウィリアム") + "<br />")
document.write(arr) // ウィリアム、ジョージ、ジョン、トーマス

valueOf() メソッド

valueOf() メソッドは、Array オブジェクトのプリミティブ値を返します。

このプリミティブ値は、Array オブジェクトから派生したすべてのオブジェクトに継承されます。

valueOf() メソッドは通常、JavaScript によってバックグラウンドで自動的に呼び出され、コード内に明示的に表示されません。

配列オブジェクト.valueOf()

まとめると（マークされた配列メソッドはより一般的に使用されており、習得する必要があります）

他にも便利でよく使われる配列メソッドがあると思われる場合は、メッセージを残して私に連絡してください。例えば、reduceメソッドなど！

var 結果 = [
    {
        科目: '数学'、
        スコア: 10
    },
    {
        件名: '中国語'、
        スコア: 20
    },
    {
        件名: '英語'、
        スコア: 30
    }
];
 
var sum = result.reduce(function(prev, cur) {
    cur.score + prev を返します。
}, 0);
コンソール.log(合計) //60

さて、今回の話はこれで終わりです。知れば知るほど、知らないことが増えていきます！

JavaScript 配列の一般的なメソッドの例に関するこの記事はこれで終わりです。JavaScript 配列に関するより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: