この例は、JavaScriptアレイの一般的な動作技術をまとめたものです。参照のためにそれを共有してください。詳細は次のとおりです。
序文
jqueryやアンダースコアなどのクラスライブラリで一般的に使用されるアレイ関連操作の使用には、$ .isarray、_.some、_。ネイティブJSアレイ操作のラッパーはもう少しありません。
ここでは、主にJavaScriptアレイ操作の一般的なAPIを要約します。誰もがプログラムの問題を解決することは非常に役立つと思います。
1。自然
JavaScriptの配列は特別なオブジェクトであり、オフセットを表すために使用されるインデックスはオブジェクトのプロパティであり、インデックスは整数である場合があります。ただし、JavaScriptオブジェクトの属性名は文字列である必要があるため、これらの数値インデックスは文字列型に内部的に変換されます。
2。操作
1配列タイプを決定します
次のようにコードをコピーします:var array0 = []; //リテラル
var array1 = new array(); //コンストラクター
//注:array.isarrayメソッドはIE6/7/8でサポートされていません
alert(array.isarray(array0));
//互換性を考慮して、使用できます
アラート(arrayのarray1インスタンス);
// または
alert(object.prototype.tostring.call(array1)=== '[object array]');
2アレイと文字列
非常にシンプル:配列から文字列に変換し、結合を使用します。文字列から配列に変換し、分割を使用します。
次のようにコードをコピーします:// join-配列から文字列に変換する
console.log(['hello'、 'world']。join( '、')); // こんにちは世界
//分割 - 分割を使用して、文字列から配列に変換します
console.log( 'hello world'.split(' ')); // ["こんにちは世界"]
3要素を見つけます
私は誰もがしばしば文字列タイプのインデックスを使用すると信じていますが、配列の指標を使用して要素を見つけることができることはめったにありません。
次のようにコードをコピーします。// indexof-要素を見つけます
console.log(['abc'、 'bcd'、 'cde']。indexof( 'bcd')); // 1
//
var objinarray = [
{
名前:「キング」、
パス:'123 '
}、
{
名前: 'king1'、
パス: '234'
}
];
console.log(objinarray.indexof({
名前:「キング」、
パス:'123 '
})); // -1
var elementofarray = objinarray [0];
console.log(objinarray.indexof(elementofarray)); // 0
上記から、オブジェクトを含む配列の場合、Indexofメソッドは、対応する検索結果を深い比較で取得するのではなく、対応する要素への参照のみを比較することがわかります。
4つの配列接続
concatを使用する場合、concatを使用した後に新しい配列が生成されることに注意してください。
コードコピーは次のとおりです。VARARRAY1= [1、2、3];
var array2 = [4、5、6];
var array3 = array1.concat(array2); //配列接続を実装した後、新しい配列が作成されます
console.log(array3);
リスト操作の5つのカテゴリ
要素を追加するには、それぞれPushとUnshiftを使用して、要素を削除するには、それぞれPopとShiftを使用できます。
次のようにコードをコピーします。// push/pop/shift/unshift
var array = [2、3、4、5];
//配列の最後に追加します
array.push(6);
console.log(array); // [2、3、4、5、6]
//配列ヘッダーに追加します
array.unshift(1);
console.log(array); // [1、2、3、4、5、6]
//最後の要素を削除します
var elementofpop = array.pop();
console.log(elementofpop); // 6
console.log(array); // [1、2、3、4、5]
//最初の要素を削除します
var elementofshift = array.shift();
console.log(elementofshift); // 1
console.log(array); // [2、3、4、5]
6スプライスメソッド
2つの主な用途:
array配列の中央から要素を追加および削除します
anigionorオリジナルの配列から新しい配列を取得します
もちろん、2つの用途は1つのガスで合成されます。目的1に焦点を当てたシナリオもあれば、目的2に焦点を当てているシナリオもあります。
配列の中央位置から要素を追加および削除します。スプライス法は、配列に要素を追加します。次のパラメーターが必要です。
①インデックスを開始します(つまり、要素の追加を開始したい場所)
削除する必要がある要素の数または抽出された要素の数(要素を追加するときにパラメーターは0に設定されます)
③配列に追加する要素
コードコピーは次のとおりです。varnums = [1、2、3、7、8、9];
nums.splice(3、0、4、5、6);
console.log(nums); // [1、2、3、4、5、6、7、8、9]
//その後、削除操作を実行するか、新しい配列を抽出します
var newnums = nums.splice(3、4);
console.log(nums); // [1、2、3、8、9]
console.log(newnums); // [4、5、6、7]
7ソート
メソッドを逆転およびソートするための主な紹介。アレイインバージョンは逆に使用されます。ソートメソッドは、単純なソートだけでなく、複雑なソートにも使用できます。
次のようにコードをコピーします。/配列を反転します
var array = [1、2、3、4、5];
array.Reverse();
console.log(array); // [5、4、3、2、1]
最初に、文字列要素の配列を並べ替えます
var arrayofnames = ["david"、 "mike"、 "cynthia"、 "clayton"、 "Bryan"、 "Raymond"];
arrayofnames.sort();
console.log(arrayofnames); // ["Bryan"、 "Clayton"、 "Cynthia"、 "David"、 "Mike"、 "Raymond"]]
数値要素の配列をソートします
次のようにコードをコピーします。
var nums = [3、1、2、100、4、200];
nums.sort();
console.log(nums); // [1、100、2、200、3、4]
ソートメソッドは辞書順序で要素を並べ替えるため、要素がすべて文字列型であると想定しているため、要素が数値タイプであっても、文字列型と見なされます。この時点で、メソッドを呼び出すときにサイズ比較関数を渡すことができます。ソートすると、sort()メソッドは、関数に基づいて配列内の2つの要素のサイズを比較し、それにより配列全体の順序を決定します。
次のようにコードをコピーします:var compare = function(num1、num2){
num1> num2を返します。
};
nums.sort(比較);
console.log(nums); // [1、2、3、4、100、200]
var objinarray = [
{
名前:「キング」、
パス:'123 '、
インデックス:2
}、
{
名前: 'king1'、
パス: '234'、
インデックス:1
}
];
//配列内のオブジェクト要素のインデックスに従って昇順
var compare = function(o1、o2){
O1.index> o2.indexを返します。
};
objinarray.sort(比較);
console.log(objinarray [0] .index <objinarray [1] .index); // 真実
8イテレータメソッド
主にforeachとすべて、一部、マップ、フィルターが含まれます
私は誰もがそれを行うことができると信じています、そして私は主に他の4つの方法を紹介します。
すべてのメソッドは、アレイ内の各要素に使用されるブールリターン値を持つ関数を受け入れます。関数がすべての要素に対してtrueを返す場合、メソッドはtrueを返します。
コードコピーは次のとおりです。varnums = [2、4、6、8];
//新しい配列を生成しないイテレーターメソッド
var iseven = function(num){
num%2 === 0を返します。
};
//すべてが偶数の場合、trueを返します
console.log(nums. Every(iseven)); // 真実
また、一部の方法では、ブールリターン値を持つ関数も受け入れます。関数がtrueを返す要素がある限り、メソッドはtrueを返します。
var iseven = function(num){
num%2 === 0を返します。
};
var nums1 = [1、2、3、4];
console.log(nums1.some(iseven)); // 真実
マップメソッドとフィルターメソッドの両方が新しい配列を生成できます。 MAPで返される新しい配列は、元の要素に関数を適用した結果です。のように:
次のようにコードをコピーします:var up = function(grad){
Return Grade += 5;
}
VARグレード= [72、65、81、92、85];
var newgrades = grades.ma
フィルターメソッドは、すべての方法に非常に似ており、ブールリターン値で関数を渡します。すべての()メソッドとは異なり、関数が配列内のすべての要素に適用され、結果がtrueである場合、メソッドは真実ではありませんが、関数が適用された後に結果が当てはまる要素を含む新しい配列を返します。
次のようにコードをコピーします:var iseven = function(num){
num%2 === 0を返します。
};
var isodd = function(num){
num%2!== 0を返します。
};
var nums = [];
for(var i = 0; i <20; i ++){
nums [i] = i + 1;
}
var evens = nums.filter(iseven);
console.log(evens); // [2、4、6、8、10、12、14、16、18、20]
var odds = nums.filter(isodd);
console.log(オッズ); // [1、3、5、7、9、11、13、15、17、19]
3。概要
上記には、いくつかの方法が低レベルのブラウザーではサポートされていないという問題もあり、互換性のある実装には他の方法を使用する必要があります。
これらは、誰もが考えるのが容易ではないかもしれない一般的な方法です。誰もがもっと注意を払うかもしれません。
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。