Javascriptの配列メソッドを徹底解説_基礎知識

JavaScript では、配列は Array コンストラクターを使用して作成することも、[] を使用して迅速に作成することもできます。これも推奨される方法です。 Array は Object から継承されたプロトタイプであり、typeof に対する特別な戻り値はなく、'object' のみを返します。

1. Array.prototype.slice メソッド
配列のスライス メソッドは通常、配列からスライスを抽出するために使用されます。ただし、「配列のような」オブジェクト (引数や HTMLCollection など) を実際の配列に変換する機能もあります。

コードをコピーします コードは次のとおりです:

var nodesArr = Array.prototype.slice.call(document.forms);
var argsArr = Array.prototype.slice.call(arguments);

配列のスライス メソッドになぜそのような機能があるのか​​、また JavaScript エンジンではどのように実装されているのかが気になります。兄弟メソッドのスライスにはそんな能力があるのでしょうか？

興味を持って、Google の V8 JavaScript エンジンのソース コードをローカルにダウンロードしてください。V8 ソース コードのダウンロード アドレス: https://github.com/v8/v8。

v8-master/src/array.js で「Array.prototype.slice」を探します:

コードをコピーします コードは次のとおりです:

関数 ArraySlice(start, end) {
CHECK_OBJECT_COERCIBLE(これ、「Array.prototype.slice」);
...
var result = [] // この文が鍵です
; if (end_i < start_i) return result;
if (UseSparseVariant(array, len, IS_ARRAY(array), end_i - start_i)) {
...
SparseSlice(array, start_i, end_i - start_i, len, result);
} else {
SimpleSlice(array, start_i, end_i - start_i, len, result);
}
...
結果を返します;

次に、SimpleSlice メソッドを使用して「クラス配列」を呼び出す必要があると推測し、ソース コード内で「SimpleSlice」を検索したところ、Array.prototype.splice ソースでも SimpleSlice メソッドが呼び出されていることがわかりました。コードを作成し、結果変数も空の配列に初期化されました。ただし、splice メソッドを使用して「配列のようなもの」を実際の配列に変換する場合は、開始位置パラメーターを 0 (つまり、

) として渡す必要があります。

コードをコピーします コードは次のとおりです:

var nodesArr = Array.prototype.splice.call(document.forms, 0);

その実装原理は、削除された配列項目から新しい配列を形成することであるためです。興味のある子供たちは、Array.prototype.splice のソース コード実装を見てみることができます。
さらに、slice は配列のクローンを作成することもできます:

コードをコピーします コードは次のとおりです:

var arr = [1, 2, 3];
var cloneArr = arr.slice(); // cloneArr: [1, 2, 3]

2. Array.prototype.push メソッド
配列はプッシュメソッドを使用してマージできます:

コードをコピーします コードは次のとおりです:

var arr1 = [1, 'str', {name: 'lang'}];
var arr2 = [2, 'ing'];
Array.prototype.push.apply(arr1, arr2);
// 返される結果: [1, "str", {name: 'lang'}, 2, "ing"]

3. Array.prototype.sort メソッド
まずコードを入力します:

コードをコピーします コードは次のとおりです:

var arr = ['1', '2', '10', '12'];
arr.sort();
// 返される結果: ["1", "10", "12", "2"]

上記の結果は通常、私たちが望むものではないため、数値で並べ替える方法:

コードをコピーします コードは次のとおりです:

arr.sort(function(a, b) {
a - b を返します;
})
// 返される結果: ["1", "2", "10", "12"]

ソートコンパレータ機能を使用すると、多くのコンパレータをカスタマイズして、パーソナライズされたソートを実現できます。

4. 長さ属性
配列の長さ属性は読み取り専用ではないため、たとえば、長さ属性を使用して配列を切り詰めることもできます。

コードをコピーします コードは次のとおりです:

var arr = [1, 2, 3, 4];
arr.length = 2;
// 配列: [1, 2]
arr.length = 0;
// 編曲: []

同時に、length 属性を大きくすると、配列の長さの値が増加し、未定義が新しい要素として使用されて埋められます。

コードをコピーします コードは次のとおりです:

var arr = [];
arr.length = 3;
// arr: [未定義、未定義、未定義]

もう朝早いので、今日はここまでです。今後新しい発見があればここに追記します。

以前は、ブログを書く習慣がありませんでした。いつもの要約を Youdao Cloud Notes に書き込むことに慣れていました。自分の意見を書き出すには、どのように書くかを考える必要があるとは思っていませんでした。他の人がよりよく理解できるようにそれらを表現すること。

間違った表現や誤解がある場合は、修正にご協力ください。

一般的に使用される JavaScript 配列メソッドもいくつか添付されています

concat() は 2 つ以上の配列を連結し、結果を返します。

join() は、配列のすべての要素を文字列に入れます。要素は指定された区切り文字で区切られます。
Pop() は配列
の最後の要素を削除して返します。 Push() は、1 つ以上の要素を配列の末尾に追加し、新しい長さを返します。
reverse() は、配列内の要素の順序を逆にします。
SHIFT() は配列
の最初の要素を削除して返します。 lice() は既存の配列から選択された要素を返します
sort() は配列
の要素を並べ替えます。 splice() は要素を削除し、新しい要素を配列に追加します。
toSource() はオブジェクトのソースコードを返します
toString() は配列を文字列に変換し、結果を返します。
toLocaleString() は、配列をローカル配列に変換し、結果を返します。
unshift() は、1 つ以上の要素を配列の先頭に追加し、新しい長さを返します。
valueOf() は配列オブジェクトの元の値を返します