ホームページ  >  記事  >  ウェブフロントエンド  >  クラス配列をスライスを使用して配列に変換する方法

クラス配列をスライスを使用して配列に変換する方法

yulia
yuliaオリジナル
2018-09-14 16:03:512159ブラウズ

この記事は 2 つの部分に分かれています。最初の部分 は、slice() の使用方法について説明し、2 番目の部分は、 スライスを使用してクラス配列を配列に変換する方法について説明します。必要な場合は参考にしていただければ幸いです。 パート 1:

公式ドキュメントには、スライスは配列をインターセプトして選択するために使用され、1 つまたは 2 つのパラメーターを渡すことができます。戻り値は新しい配列であり、影響を受けません。元の配列。

最初に新しい Array 配列 str

  var str = new Array();
        str[0] = 1;
        str[1] = 2;
        str[2] = 3;
        str[3] = 4;
        str[4] = 5;
を作成します。戻り値は選択された新しい配列であり、元の配列は変更されません。

これがパラメーターの場合、配列の開始位置 (添え字) と配列の最後までの選択場所になります。

var strs = str.slice(2);
console.log(strs);      // [3, 4, 5]
console.log(str);       // [1, 2, 3, 4, 5]

2 つのパラメーターが渡された場合、選択は最初のパラメーター (添え字) から始まり 2 番目のパラメーター (添え字) で終わりますが、2 番目のパラメーターは含まれません

var strs = str.slice(2,4);
console.log(strs);      // [3, 4]

負の数値が渡されると、配列の最後から数えて、-1 は最後の要素を参照し、-2 は最後から 2 番目の要素を参照し、以下同様になります。

var strs = str.slice(-2);
console.log(strs);      // [4, 5]

2 つの負の数値が渡される場合、上記と同じですが、すべて配列の末尾から始まります。

var strs = str.slice(-4,-1);
console.log(strs);      // [2, 3, 4]

2 つのパラメーターが渡され、2 番目のパラメーターが最初のパラメーターより小さい場合、結果は空の配列になります (負の数についても同様です)。

var strs = str.slice(-1,1);      
console.log(strs);      // [ ]

さて、以上がスライス関数の使い方です。

しかし、実際にはクラス配列を配列に変換するために使われるのが一般的です。

これは、クラス配列を取得するために以前に書いた HTML コードの文字列です。

    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>

結果は次のとおりです。

var NodeList = document.querySelectorAll("div");
console.log(NodeList);      //NodeList(10) [div, div, div, div, div, div, div, div, div, div]
NodeList = [].slice.call(NodeList);
console.log(NodeList)       //(10) [div, div, div, div, div, div, div, div, div, div]

最初の行は、次の文字列を取得することです。 class array

2 行目は、コンソールにクラス配列を出力します。

3 行目は、クラス配列 (受け入れる変数を使用する必要があります) を変換するか、Array.prototype.slice.call(NodeList) を変換します。

4 行目は、変換された配列をコンソールに出力します。
習ったかな?まだ覚えたかはわかりませんが、自分でも何回か入力しました(笑)。

以上がクラス配列をスライスを使用して配列に変換する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。