このslice()メソッドは、配列の一部のコピーを新しい配列オブジェクトに返します。このオブジェクトはからから選択さstart れendます。注意として、元の配列は変更されません。

また、新しい要素が配列の1つに追加されても、他の配列は影響を受けません。

パラメータは何ですか？

slice()メソッドのパラメーターは、開始インデックスと終了インデックスです。

始める

配列の一部のコピーを開始するのはゼロベースのインデックスです。未定義の場合、デフォルト値は0です。start 配列のインデックス範囲よりも大きい場合、slice()メソッドは空の配列を返します。

また、のstart場合、負のインデックスを使用することもできます。slice(-1)配列の最後の要素を抽出します。Pythonに似ています

終わり

このパラメーターはオプションです。slice()関数にパラメーターが1つしかない場合は、ですstart。省略した場合、slice()メソッドはシーケンスの最後まで抽出します。

シーケンスの長さよりも大きいslice場合は、省略された場合に備えて、シーケンスの最後まで抽出します。

抽出を終了する前のインデックスです。包括的ではありません。したがって、インデックスの最後の要素は配列のコピーに含まれません。たとえばslice(1,3)、2番目と3番目の要素を抽出します。

y = [1, 2, 3, 4, 5, 6]
y.slice(2, -2) // will return [3, 4]

1.配列をコピーします

最初の機能は、関数の基本的な機能ですslice()。パラメータのない配列は、元の配列をコピーします。配列内のいくつかの要素を更新したい場合があります。

ただし、元の配列の要素を保護したい場合があります。したがって、元の配列の浅いコピーを作成できます。

const midtermGrades = updatedGrades.slice();

このslice()メソッドの2番目の使用例は、nで始まるサブ配列をコピーすることです。たとえば、試験で80ポイント以上を獲得した学生を分析しているとします。生徒のインデックスは10から始まることがわかりました。したがって、成功した生徒のインデックスをコピーできます。

const successfulStudents = allStudents.slice(10);

const unsatisfactoryStudents = allStudents.slice(-10);

slice()メソッドを使用して、配列のように見えるオブジェクトを配列に変換できます。たとえば、次のように関数を作成します。

4.NodeListを配列に変換します

NodeListオブジェクトは、ドキュメントから抽出されたノードのコレクションです。querySelectorAll()メソッドを使用して、NodeListオブジェクトを返すことができます。たとえば<p>、HTMLドキュメント内のすべてのノードを選択できます。を使用してslice()、選択したNodeListを配列に変換できます。

var p = document.querySelectorAll(‘p’);
var pNodes = Array.prototype.slice.call(p);

関数を使用して置換関数を作成できますslice()。

結論

JavaScriptの組み込み関数のユースケースを学ぶことは、コーディングスキルの向上に役立ちます。あなたはそれを必要なときにあなたの知識を使うことができます。関数をエレガントに実装できます。

slice()便利な組み込み関数でもあります。使い方がわかれば、必要な問題が発生したときに使えます。を使用して配列のコピーを簡単に取得できますslice().

結論としてslice()、この記事のユースケースは次のとおりです。

• 配列のコピー
• nから始まるサブ配列の構築
• 配列のようなオブジェクトを配列に変換する
• NodeListを配列に変換する
• 文字列内の特定のインデックスを置き換える