▼▼TIL 9・Javascriptアレイ内蔵関数2

filter

splice & slice

shift & pop

unshift & push

1. filter

filter 함수配列から特定の条件を満たす値を抽出し、新しい配列を生成する.color = 'red'の条件を満たす배열 fruitColorRedが生成される.

const fruits = [
  
  { id: 1,
    name: 'apple',
    color: 'red' },
  
  { id: 2,
    name: 'banana',
    color: 'yellow' },
  
  { id: 3,
    name: 'melon',
    color: 'green' },
  
  { id: 4,
    name: 'orange',
    color: 'orange' },
  
  { id: 5,
    name: 'strawberry',
    color: 'red' },
];

const fruitColorRed = fruits.filter(fruit => fruit.color === 'red');
console.log(fruitColorRed);

結果

2. splice & slice

spliceは、配列から特定のアイテムを削除するために使用されます.sliceは、既存のシナリオに影響を与えることなく、特定のアイテムを削除し、新しいシナリオを作成します.

splice

配列の値が3のインデックスを検索し、3つのインデックスを順に削除します.

const numbers = [1, 2, 3, 4, 5, 3, 7];

const index = numbers.indexOf(3); // 값이 3인 배열의 index 찾기
numbers.splice(index, 3); // 그 index부터 순서대로 3개 제거
console.log(numbers);

結果[1, 2, 3, 7]なお、ここでindexOfは、値が3のindexのうち最も前のindex値を返す.

slice

const numbers = [1, 2, 3, 4, 5, 3, 7];

const sliced = numbers.slice(2, 5); // 2부터 시작해서 5전까지

console.log(sliced); // [3, 4, 5]
console.log(numbers); // [1, 2, 3, 4, 5, 3, 7] 원래 배열은 그대로

結果[3, 4, 5][1, 2, 3, 4, 5, 3, 7]

3. shift & pop

shiftは、アレイ内の最初の要素の抽出および除去である.pop銀アレイの最後の要素の抽出と除去

shift

最初の要素値の抽出と削除

const numbers = [1, 2, 3, 4, 5, 3, 7];

const value = numbers.shift();
console.log(value); // 1
console.log(numbers); // [2, 3, 4, 5, 3, 7]

結果1[2, 3, 4, 5, 3, 7]

pop

アレイ内の最後の要素の抽出と除去

const numbers = [1, 2, 3, 4, 5, 3, 7];

const value = numbers.pop();
console.log(value); // 7
console.log(numbers); // [1, 2, 3, 4, 5, 3]

結果7[1, 2, 3, 4, 5, 3]

4. unshift & push

unshift配列の先頭に値を追加push配列の末尾に値を追加

unshift

配列の先頭に値「5」を追加

const numbers = [1, 2, 3, 4, 5, 3, 7];

const value = numbers.unshift(5);
console.log(numbers);

結果[5, 1, 2, 3, 4, 5, 3, 7]

push

配列の最後に値「9」を追加

const numbers = [1, 2, 3, 4, 5, 3, 7];

const value = numbers.push(9);
console.log(numbers);

結果[1, 2, 3, 4, 5, 3, 7, 9]