Array.slice と Array.splice: 混乱を解消する-jsチュートリアル-php.cn

Array.slice と Array.splice: 混乱を解消する

PHPz

リリース： 2024-08-09 14:33:07

オリジナル

311 人が閲覧しました

Array.slice vs. Array.splice: Clearing Up the Confusion

導入

JavaScript 開発者として、2 つの Array メソッドを完全に把握するのは少し難しいと感じることがよくあります

配列.スライス
配列.スプライス。

そこで、これらのメソッドを詳しく掘り下げ、明確な例を示して説明することにしました。

構文を書き直すと

配列.スライス

returns the deleted elements in a form of Array = Array.prototype.slice(startIndex, endIndex-1);

ログイン後にコピー

Array.splice (P は Permanent - 常に覚えておいてください)

JavaScript の splice メソッドは、既存の要素を削除または置換したり、新しい要素を所定の位置に追加したりすることで、配列の内容を変更します

要素の削除構文

returns the deleted elements in a form of Array = Array.prototype.splice(startIndex, endIndex-1); // permanent

ログイン後にコピー

要素の追加構文

array.splice(startIndex, 0, item1, item2, ..., itemX);

ログイン後にコピー

注:-

元の配列を変更し、削除された配列を返します。
追加操作として動作すると、何も削除されないため、[] が返されます。

いくつかの例を見てみましょう:-

Q1.演習 1 - スライスを使用して配列の一部を取得する: 1 ～ 10 の数値の配列を作成します。スライスメソッドを使用して、4 ～ 8 の数値を含む新しい配列を取得します。

const arr = Array.from(Array(10), (_, i) => i+1);
console.log('Array --> ', arr);
console.log('get a new array that includes numbers from 4 to 8 --> ', arr.slice(3, 8)); // Array.prototype.slice(startIndex, endIndex-1);

// [ 4, 5, 6, 7, 8 ]

ログイン後にコピー

Q2.演習 2 - スプライスを使用して配列から要素を削除する: フルーツの配列を作成します。 splice メソッドを使用して、配列から「リンゴ」と「バナナ」を削除します。

const fruits = ['apple', 'banana', 'orange', 'mango', 'kiwi'];

fruits.splice(0, 2)// permanent

console.log('splice method to remove "apple" and "banana" from the array. --> ', fruits);

// [ 'orange', 'mango', 'kiwi' ]

ログイン後にコピー

Q3.演習 3 - スプライスを使用して要素を配列に追加する: 色の配列を作成します。スプライスメソッドを使用して、「赤」の後に「ピンク」と「紫」を追加します。

const colors = ['red', 'green', 'blue'];

const y = colors.splice(1, 0, "pink", "purple"); /
console.log(y); // [] see above to see why.
console.log('splice method to add "pink" and "purple" after "red" --> ', colors)

// [ 'red', 'pink', 'purple', 'green', 'blue' ]

ログイン後にコピー

Q4.演習 4 - スライスとスプライスを併用する: 「a」から「e」までの文字の配列を作成します。最初の 3 文字の新しい配列を取得するには、slice を使用します。次に、元の配列でスプライスを使用してこれらの文字を削除します。

const letters = ['a', 'b', 'c', 'd', 'e'];
const newSlice = letters.slice(0, 3);
const x = letters.splice(0, 3);
console.log(x);
console.log('slice to get a new array of the first three letters --> ', newSlice) // [ 'a', 'b', 'c' ]

console.log('Then use splice on the original array to remove these letters --> ', letters)[ 'd', 'e' ]

ログイン後にコピー

ご質問やご不明な点がございましたら、お気軽にお問い合わせください。

以上がArray.slice と Array.splice: 混乱を解消するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。