6 つの JS 配列の使用例のまとめ

jsを学ぶ過程で、js配列のメソッドをマスターする必要があります。ここでは、誰もが学び合えるように、js配列でよく使われるメソッドをまとめました。早速、本文に進みましょう。

1. js オブジェクトによって継承されるメソッド

Array は、オブジェクト Object

1.toString() の toString()、toLocaleString()、および valueOf() メソッドを継承する特別なオブジェクトです。 toString メソッドは、配列内の各値の文字列形式から連結された記号区切りの文字列を返します。これは、パラメーターなしで join() によって返される文字列と同じです

[1,2,3].toString()//'1,2,3'
['a','b','c'].toString()//'a,b,c'
[1,[2,3]].toString()//'1,2,3'

2.toLocaleString()

toLocaleString() toString() のローカライズされたバージョンです。通常の状況では、数値が 3 桁を超えると、自動的にフォーマットされ、日付もフォーマットできます

var a = 3333; a.toLocaleString()//3,333
var b = new Date; b.toLocaleString()//2018/7/13 下午3:43:39

3.valueOf()。 )

valueOf()は配列オブジェクトを扱うときに自分自身を返します

var a = [1,2,3]; a.valueOf()//[1,2,3];
a.valueOf() instanceOf() Array//true

2. jsの配列変換メソッド

1.join()

Array.join()はArray.split()の逆操作では、前者は配列をパラメータ単位 (デフォルトはカンマ) で文字列にマージするもので、後者は文字列を配列に切り分けるものです。配列とクラス配列をサポートしますが、オブジェクトはサポートしません

var a = [1,2,3,4,5]; a.join()//'1,2,3,4,5'
var b = [1,undefined,2,null,3]; b.join()//'1,,2,,3'
var c = Array.prototype; c.join.call('hello','-')//'h-e-l-l-o'
var d = {1:'a',2:'b',length:3}; d.join()//'a,b'
var e = {1:'a',2:'b'}; e.join()//''

3. jsの配列データ構造の操作方法配列のデータ構造は、スタック構造(last in、last out)とキュー構造(先入れ先出し)

スタック構造 (後入れ、後出し):

1.push()

push() は、最後に任意の数のパラメータを 1 つずつ追加し、元の配列、配列の長さを変更して

var a = [1,2]; a.push('11,22') - a//3 - [1,2,33,44]
var b = [3,4]; a.push([33.44]) - a//2 - [1,2,[33,44]]
Array.prototype.push.apply(a,b)//[1,2,3,4]
Array.prototype.push.call(a,b)//[1,2,[3,4]]

push() を返す オブジェクトにパラメーターを追加することもできます。追加後、オブジェクトは配列オブジェクトになります。新しく追加された要素のキーは配列のインデックスに対応し、オブジェクトには長さの属性があります

var c = {}; ,1)//{0 :1,length:1}

2.pop()

pop() は、配列内の最後の項目を削除し、配列の長さを返し、配列の長さを変更して変更します。元の配列

var a = [1,2,3]; a.pop() - a//3 - [1,2];
//如果数组本身是空数组，则返回undefined
var b = []; b.pop()//undefined

キュー構造 (Forward、forward out):

1.shift()

shift() は、配列内の最初の項目を削除し、削除された要素を返し、その後、その要素の長さを変更します。配列を変更する配列

var a = [1,2,3]; a.shift() - a//1 - [2,3];

2.unshift()

unshift()は、配列の開始位置にパラメータを追加して配列の長さを変更し、配列の長さを返して配列を変更します

var a = [1,2,3]; a.unshift(4,5) - a//5 - [1,2,3,4,5]

4. js配列ソートメソッド

1.reverse()

reverse() 配列の順序を反転し、元の配列を変更し、現在の配列を返すために使用されます

　var a = [1,2,4,3,5]; a.reverse()// [5,3,4,2,1];

2.sort( )

sort() はデフォルトで配列を昇順に変更し、sort はデフォルトで各配列項目を toString() に呼び出します

var a = [1,2,3,4,5]; a.sort() //[1,2,3,4,5]
var b = [1,2,12,13]; c.sort() //[1,12,13,2]
var c = [1,2,'1a','2b']; c.sort() //[1,'1a',2,'2b'];

配列に未定義が含まれる場合、未定義は最後までソートされます

var d = [1,3,undefined,2]; d.sort() //[1,2,3,undefined]

sort が指定されている場合パラメータ (パラメータは関数である必要があります); 関数の戻り値が正の数であるか、最初のパラメータから最初のパラメータを引いた場合 パラメータが 2 つある場合は正の順序になり、それ以外の場合は逆の順序になります。文字列が存在する場合は、それが最小になります。開始位置で並べます

function sortNumber(a,b){
　　return b-a
}
var e = [1,2,3]; e.sort(sortNumber)//[3,2,1]; 
var f = ['1a',1,'2b',2,3]; f.sort()//['1a','2b',3,2,1];

sortパラメーターが関数から返されるランダムな正または負の数値の場合、配列の順序はランダムになります

function sortRandom(a,b){
　　return Math.random()-0.5
}
var g = [1,2,3,4,5]; g.sort(sortRandom)//[2,1,5,4,3]（此为随机顺序）

3.concat()

concat()メソッドは現在の配列に基づいて新しい配列を作成し、元の配列に影響を与えることなく受け取ったパラメーターを最後に配置します

var a = [1,2]; b = [3,4]; a.concat - a//[1,2,3,4] - [1,2];五.创建子数组方法

4.slice()

slice() メソッドはパラメーターの最初の開始位置と 2 番目の終了位置をインターセプトします桁。そして新しい配列を作成します。パラメータがない場合は、すべてインターセプトされます

var a = [1,2,3,4,5];a.slice(2,4)//[3,4,5]
var a = [1,2,3,4,5];a.slice(2)//[3,4,5]
var a = [1,2,3,4,5];a.slice(-3)//[3,4,5] 
var a = [3,4,5];a.slice()//[3,4,5]

Five.js の配列削除メソッド

1.splice()

splice() は、位置に 3 つのパラメータを受け取ります。削除する番号には 2 番目のパラメータが必要です。パラメータが 1 つしかない場合、今後、新しい項目では 2 番目のパラメータはオプションになります。返されるのは削除された配列です

var a = [1,2,3]; a.splice(2,0,1)-a//[]-[1,2,1,3];
var b = [1,2,3]; a.splice(2,1,1)-a//[3]-[1,2,1];
var c = [1,2,3]; a.splice(2)-a//[1,2,3]-[]
var d = [1,2,3]; a.splice(2,1,4,5)-a//[3]-[1,2,4,5]

2.indexOf()

indexOf()は最初のパラメータが最初に出現する位置を返します。2番目のパラメータnが出現したときに返されるのは、n番目の前の要素です。要素は初めて出現するかどうかは計算されません

var a = ['a','b','c',a,2,3]; a.indexOf('a')//0
var a = ['a','b','c',a,2,3]; a.indexOf('a',1)//4
var a = ['a','b','c',1,2,3]; a.indexOf('a',-5)//0

3.lastIndexOf()

lastIndexOf()はindexOf()とは異なります:右から左に検索

var a = ['a','b','c',a,2,3]; a.indexOf('a')//4
var a = ['a','b','c',a,2,3]; a.indexOf('a'，1)//0
var a = ['a','b','c',a,2,3]; a.indexOf('a'，-1)//0

Six.jsの配列マージメソッド

1.reduce()

reduce() メソッド 最初のパラメーターは、指定された関数配列をループし、それをカスタム形式で結合して単一の値を生成することです。これは 4 つのパラメータ (初期変数、現在の変数、現在のインデックス、元の配列オブジェクト) を受け取ります。reduce の 2 番目のパラメータは、入力する初期値を指定します。

var a = [1,2,3,4,5];
a.reduce(function(x,y){return x+y}) // 15
a.reduce(function(x,y){return x+y},3)//18

2.reduceRight()

reduceRight()は、インデックス値が高いものから低いものまであるという点でreduce()とは異なります

a.reduce(function(x,y){console.log(x,y);return x+y},0)
// 5,4 9,3 12,2 14,1 15,0

Seven.jsの配列反復メソッド

1.map ()

map() は、関数配列の各項目に対して指定された関数を実行し、各関数呼び出しの結果を返して配列を形成します

var a = [1,2,3]; a.map(function(item,index,arr){return item*2})
//[2,4,6]
var b = ['aa','bb','cc'];
a.map(function(item,index,b){return this[item]})
//['aa','bb','cc'];

map()日常中多用于去解析对象中的属性

var c = {[name:1,value:2],[name:11,value:22]}
c.map(function(item){return item.name})//[1,11]

2.forEach()

forEach()给函数数组的每一项运行指定的函数(于map()对比不同于没有返回值)。forEach()可接受第二参数，用来改变this的指向。

var a = {
    name:'111'，
    arr:[1,2,3],
    value:function(){
        console.log(this);
        this.arr.forEach(function(){
        console.log(this);
        })
    }
}//循环外this指向value方法，循环内指向a对象
var b = {
　　name:'111'，
　　arr:[1,2,3],
　　value:function(){
　　　　console.log(this);
　　　　this.arr.forEach(function(){
　　　　　　console.log(this);
　　　　}，this)
　　}
}//全文的this全部都指向对象a

3.filter()

filter()给函数数组的每一项运行指定的函数，并返回制定规则返回True的项的数组。该方法多用于查询,第二个参数值指定this指向

var a = [1,2,3];a.filter(function(item){return item>1)//[2,3];

4.some()

filter()给函数数组的每一项运行指定的函数进行筛选，如果都返回false，则返回false。反之则返回true

a = [1,2,3,4,5];
a.some(function(item){return item === 3;})//true
a.some(function(item){return item === 6;})//false

5.every()

every()给函数数组的每一项运行指定的函数进行筛选，如果有返回false，则返回false。反之如果全部返回true，则返回true;空数组会返回true

a = [1,2,3,4,5];
a.every(function(item){return item === 3;})//false
a.every(function(item){return item < 6;})//true

相关推荐：

JS中数组重排序方法

js数组方法

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