[js]配列内蔵関数

配列内蔵関数を整理します.

forEach

const array = [1, 5, 7, 8, 9];

function print(x) {
  console.log(x);
}

array.forEach(print);

矢印関数による簡略化

const array = [1, 5, 7, 8, 9];

array.forEach(x => console.log(x))

map

既存のアレイに特定の条件を追加して、新しいアレイを作成するときに容易に実行できる関数です.
既存の配列x 2の場合.

const array = [1, 5, 7, 8, 9];

const cal = n => n * 2 
const result = array.map(cal)
console.log(result)

// 더 간단하게도 가능
const result = array.map( n => n * 2)
console.log(result)

オブジェクト配列から何かを取得する場合

const ex = [
  {
    id: 1,
    text: "content1",
    done: true
  },

  { 
    id: 2, 
    text: "content2", 
    done: true },

  {
    id: 3,
    text: "content3",
    done: true
  },

  {
    id: 4,
    text: "content4",
    done: false
  }
];

const texts = ex.map(ex => ex.text)
console.log(texts)

indexOf

私が探しているものがどこのインデックスにあるか知ることができます.

const ex = ['korea','japan','uk']
const findex = ex.indexOf('uk');
console.log(findex)

findIndex

indexOfは、特定の値を知っている場合に、その値を入力することで、その値のインデックスを決定することができます.
値、オブジェクト、複雑さが分からない場合はfindの方が使いやすいです.
つまり、特定の条件で見つけたいときに使うのが良いということです.

const ex = [
  {
    id: 1,
    text: "content1",
    done: true
  },

  { 
    id: 2, 
    text: "content2", 
    done: true },

  {
    id: 3,
    text: "content3",
    done: true
  },

  {
    id: 4,
    text: "content4",
    done: false
  }
];

const findId = todos.findIndex(todo => todo.id === 3);
console.log(findId);

find

const todos = [
  {
    id: 1,
    text: "content1",
    done: true,
  },

  {
    id: 2,
    text: "content2",
    done: true,
  },

  {
    id: 3,
    text: "content3",
    done: true,
  },

  {
    id: 4,
    text: "content4",
    done: false,
  }
];

// done 이 false 를 찾으시오
const something = todos.find( something => something.done === false)
console.log(something)

filter

特定の条件で並べ替える

//todo에 있는 done 중에서 true 를 찾아 배열로 만들어줘!
const todos = [
  {
    id: 1,
    text: "content1",
    done: true,
  },

  {
    id: 2,
    text: "content2",
    done: true,
  },

  {
    id: 3,
    text: "content3",
    done: true,
  },

  {
    id: 4,
    text: "content4",
    done: false,
  }
];

const doneTrue = todos.filter(find => find.done === true)
console.log(doneTrue)

splice

整列splice(位置、抽出カウント、要素1、要素2...)

const array = [30, 40, 50]

// splice(index, 갯수)
// 즉 index 부터 몇개를 지우겠다.
array.splice(0,2)
console.log(array) // [50]

const array = ['딸기','사과']
array.splice(1,0,'바나나')
cosole.log(array) //["딸기", "바나나", "사과"]

const array = ['딸기','사과']
array.splice(1,1,'수박','바나나')
console.log(array) //["딸기", "수박", "바나나"]

slice

spliceと名前は似ていますが、全然違います.
まず基本的な配列には触れません.加えられたパラメータも異なります.

const array = [30, 40, 50]
// slice(처음, 나중) 
// 처음 index 부터 나중 -1 까지 자름, 기존 배열은 건들지 않음
const slice = array.slice(0,2)
console.log(slice)
console.log(array)

shift(unshift配列から追加)

const array = [30, 40, 50]

//배열의 첫번째값을 지운다.
const shift = array.shift()
console.log(shift) // 30
console.log(array) // [40, 50]

Pop(push配列の後ろから追加)

shiftの反対だと思う

const array = [30, 40, 50]

const pop = array.pop() // 뒤에를 뺀다.
console.log(pop) // [50]
console.log(pop) // [30,40]

concat

2つの配列を組み合わせます.既存のレイアウトに触らない.新しい配列を形成する.

const array = [30, 40, 50]
const array2 = [1, 2, 3]

const result = array.concat(array2) // 첫번째 함수. concat(두번째 함수)
console.log(result)

join

パラメータ条件を使用して、配列から値を取り出します.

const array = [30, 40, 50]

const result = array.join(' ')
console.log(result)

reduce

const array = [30, 40, 50];

// 우선 accumulator 는 누적값, 0 은 초기값 
const result = array.reduce((accumulator, current) => accumulator + current , 0)
console.log(result) //120

//index 는 배열의 index 값 / array 는 기존 array를 말한다.

const example = [30, 40, 50];

const result = example.reduce((accumulator, current, index, array) => {
  if(index === array.length - 1) {
    return (accumulator + current) / array.length
  }
  return accumulator + current
},0)
console.log(result) 

// example 원소의 갯수를 reduce로 구함
const exmple = ['a','a','a','a','a','b','c','d']

const result = exmple.reduce((acc,current) => {
  if(acc[current]) {
    acc[current] += 1
  }
  else {
    acc[current] =1
  }
  return acc
}, {})

console.log(result)