MDN -Array.prototype.forEach()

---

내가 너무 반복문을 써서,, 배열 메소드들을 좀 정리해서 공부해볼까 한다.
반복문이 익숙해서 쓰기 편한데 사실 쓸데없는 연산을 많이 해서 그런 부분을 줄여보려면
다양한 메소드를 많이 써보고 익혀야할 것 같다고 생각이 들었다.
(하지만 늘 생각만 하고 잘 안 한다.. 하지만 앞으로는 진짜 할 것이다!!🔥🔥)

forEach() 메서드는 주어진 함수를 배열 요소 각각에 대해 실행한다.

const array1 = ['a', 'b', 'c'];

array1.forEach(element => console.log(element));

// expected output: "a"
// expected output: "b"
// expected output: "c"

화살표 함수에도 익숙해져야겠다 흑흑..

1. forEach() 메소드 구문

arr.forEach(callback(currentvalue[, index[, array]])[, thisArg]);

• callback - 각 요소에 대해 실행할 함수.
  다음 세 가지 인수를 받는다.
  currentValue - 처리할 현재 요소.
  index (Optional) - 처리할 현재 요소의 인덱스.
  * array (Optional) - forEach()를 호출한 배열.
• thisArg (Optional)- callback을 실행할 때 this로 사용할 값.
  thisArg 매개변수를 forEach()에 제공한 경우 callback을 호출할 때 전달해 this의 값으로 쓰인다. 전달하지 않으면 undefined를 사용하며, 최종 this 값은 함수의 this를 결정하는 평소 규칙을 따른다.
  화살표 함수 식을 사용하여 함수 인수를 전달하는 경우 thisArg 매개변수는 화살표 함수가 this 값을 렉시컬(lexical, 정적) 바인딩하기에 생략될 수 있다.

반환 값은 undifined다.

---

• forEach()로 처리할 요소의 범위는 최초 callback 호출 전에 설정된다.
• ★forEach() 호출을 시작한 뒤 배열에 추가한 요소는 callback이 방문하지 않는다.
  ^ 이 부분에서 궁금한 점이 생겨서 밑에서 실험을 해 봤는데 새로 추가된 요소라도, forEach()가 도달하기 전에 최초 범위 안에 있다면 forEach()가 방문한다.
• 배열의 기존 요소값이 바뀐 경우, callback에 전달하는 값은 forEach()가 요소를 방문한 시점의 값을 사용한다.
• 방문하기 전에 삭제한 요소는 방문하지 않는다.
• map()과 reduce()와는 달리 undefined를 반환하기 때문에 메서드 체인의 중간에 사용할 수 없다.
• 대표적인 사용처는 메서드 체인 끝에서 부작용side effect을 실행하는 것이다. (뭔지 모름)
• forEach()는 배열을 변형하지 않는다. 그러나 callback이 변형할 수는 있다.
• 예외를 던지지 않고는 forEach()를 중간에 멈출 수 없다. 중간에 멈춰야 한다면 forEach()가 적절한 방법이 아닐 수 있다.

궁금한 거
최초 배열의 길이가 5였는데
하나를 추가해서 6개가 되었다가
마지막 인덱스에 도달하기 전에 앞의 인덱스가 삭제되면
새롭게 추가된 요소가 마지막 인덱스로 가는데 얘를 방문할까?

var arr = [1,2,3,4,5]

function check(element){
  console.log(element);
  console.log(this);
  if(element===2){
    this.push(6)
  }else if(element===3){
    this.splice(3,1)
  }
}

arr.forEach(check, arr); //this에 자기자신을 바인딩해줬다. 안 하면 window로 본다.

최조배열의 범위는 index 0부터 4로 5개
forEach가 돌고 있는 중간에 배열이 바뀐다.
중간에 6개로 늘어났다가 다시 5개로 줄어든다.
범위는 정해져 있으니까 새로 생긴 element가 forEach가 끝나기 전에
범위 안에 들어오면 forEach가 그 element도 방문한다.

---

주의 할 만한 경우
중간에 배열이 수정되면 forEach()가 요소를 건너뛰는 경우가 생길 수 있다.

dd