Array Method

1. array.at()

: 해당 인덱스의 요소를 반환

array.at("index")

const arr = ["a", "b", "c", "d"];
let index= 3;

arr.at(index); // c
arr.at(-1); // d

array[array.length - 1] === array.at(-1)
array의 마지막 요소를 찾을 때 축약해서 유용하게 쓸 수 있겠다.

2. array.concat()

: 기존 배열에 더해서 하나의 배열로 합쳐준다. (배열 + 배열 / 배열 + 값 )

array.concat("array/value")

const arr = ["a", "b", "c", "d"];

arr.concat(1,2,3,4,["안","녕"]); // ['a', 'b', 'c', 'd', 1, 2, 3, 4, '안', '녕']
→ 배열을 다 풀어서 하나의 배열로 합쳐준다 (기존의 배열은 변경되지 않는다)

3. array.copyWithin()

: 배열의 일부를 복사해서 해당 인덱스에 복사한 값을 덮어쓴다. → 복사 및 대입을 한번에!
array.copyWithin(복사 값 넣을 위치(필수),복사를 시작할 인덱스,복사를 끝낼 인덱스(본인 이전까지 복사함 주의))

array.copyWithin("index")

const arr = ["a", "b", "c", "d"];

arr.copyWithin(-1); // ['a', 'b', 'c', 'a']
→ 복사값 넣을 인덱스만 주면, 복사 시작 기본은 0번이 됨.

arr.copyWithin(2, 0) // ['a', 'b', 'a', 'b']
→ 복사 끝날 인덱스를 안정해주면, 최대한 배열의 끝까지 복사함.

arr.copyWithin(1, 0, 4) // ['a', 'a', 'b', 'c']

4. array.entries()

: Iterator 객체를 반환한다! (for of문 등으로 풀어서 사용해야함)
array에도 사용하지만 Object.entries()로 객체에도 많이 사용함.

1) Array

1. 개념

const arr = ["a", "b", "c", "d"];

const iterator = arr.entries(); // Array Iterator {}

* 반환된 Iterator는 스텝을 가지고있음.
Iterator.next(); // {value: Array(2), done: false}
→ 여기서 value값에 들어있는 array는 [0, 'a']이며, [index,value]의 구조로 되어있다.

이후로도 next()를 호출할때마다 한스텝씩 값을 불러온다. 

Iterator.next().value //  [1, 'b'] // done: false
Iterator.next().value // [2, 'c'] // done: false
Iterator.next() // {value: Array(2), done: true}
value는 [3, 'd']을 가지며 배열의 마지막 요소이기 때문에 done이 true로 바뀜!!
더이상 요소가 없는데 또다시 
Iterator.next() 호출하면, undefined 뜸.

2. 사용 예제

• for of

const arr = ["a", "b", "c", "d"];
const obj = {};
for (const [i,value] of arr.entries()) {
	obj[`${i}`] = value
}

obj // {0: 'a', 1: 'b', 2: 'c', 3: 'd'}

2) Object.entries()

1. 개념

const obj1 = {
	name : "bora",
    age : 30,
    cat : "ddubi",
}

Object.entries(obj1); // [['name', 'bora'], ['age', 30], ['cat', 'ddubi']]
→ object의 각 키값, 밸류값을 하나의 배열로 순차적으로 뱉어서 만들어진 하나의 배열이 리턴된다.

2. 사용 예제

• for of

for (const [key,value] of Object.entries(obj1)){
    console.log(`${key} : ${value}`)
}
// 	name : "bora"
//  age : 30
//  cat : ddubi

• for each

Object.entries(obj1).forEach(([key,value])=>{
    console.log(`key : ${key} value : ${value}`)
})

// 	key : name value : bora
//  key : age value : 30
//  key : cat value : ddubi

5. array.every()

: 배열 안의 모든 요소가 주어진 판별 함수를 통과하는지 테스트 → 불리언값 반환

[1, 2, 3, 4, 5].every((item)=>item < 8); // true

• 한 배열 안에 다른 배열의 모든 요소가 있는지 확인

const arr1 = ["a", "b", "c", "d"];
const arr2 = ["a", "b"];
const arr3 = ["a", "e"];

// arr2의 모든 요소가 arr1에 포함되어있나요?
arr2.every((item)=> arr1.includes(item)) // true
// arr3의 모든 요소가 arr1에 포함되어있나요?
arr3.every((item)=> arr1.includes(item) // false

• 배열을 수정하면서 테스트 하고 싶다면?

array.every((item, index, array) => {
	여기서 array 요소 추가 . 수정 . 삭제 모두가능
  	return 끝내고싶은 조건
})

1. 수정하는 경우
let arr = [1, 2, 3, 4];
arr.every((item, i, arr) => {
    arr[`${i}`] -= 1
      console.log(`${arr}[${i}] / ${item}회`)
    return item < 3
})
// 인덱스 0,1,2번까지만 돌면서 1씩 빼준다.
// 0,2,3,4[0] / 1회
// 0,1,3,4[1] / 2회
// 0,1,2,4[2] / 3회

2. 추가하는 경우
let arr = [1, 2, 3, 4];
arr.every((item, i, arr) => {
    arr.push(`${i}`)
    return item < 3
})
// 인덱스 0,1,2번까지만 돌면서 결과로 arr = [1, 2, 3, 4, 0, 1, 2]를 얻을 수 있다. 

3. 삭제하는경우
let arr = [1, 2, 3, 4];
arr.every((item, i, arr) => {
    arr.pop()
    console.log(`${arr}[${i}] / ${item}회`)
    return item < 4
})
// 1,2,3[0] / 1회
// 1,2[1] / 2회
// 기존요소가 pop 되면서 2회만 돈다. 

6. array.some()

: 배열 안의 요소가 주어진 판별 함수를 하나라도 통과하는지 테스트 → 불린값 반환

=> 사용방법은 every랑 똑같다!

7. array.forEach()

: 주어진 함수를 배열 요소 각각에 대해 실행
undefined를 반환할 수 있기 때문에 메서드 체인의 중간에 사용할 수 없다.

const arr = ["a", "b", "c", "d"];
 
arr.forEach((item)=>console.log(item))

8. Array.from()

: 유사배열 객체 / 반복가능한 객체를 얕은 복사하여 새로운 Array 객체를 생성

Array.from(복사기준객체, 맵핑조건)

Array.from("abcd");
// ["a", "b", "c", "d"]

Array.from([1,2,3], (item,i)=>item+i);
// [1, 3, 5]

→ 위처럼 맵핑조건 부분은 map함수와도 유사하다.
= Array.from(obj).map(item, 조건식)