javaScript. forEach()문

Array.forEach()

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

 

 

 

SYNTAX

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

 

매개변수

callback 함수 : 각 요소에 대해 실행할 함수. 다음 세 가지 매개변수를 받습니다.

 

currentValue  처리할 현재 요소.

index Optional  처리할 현재 요소의 인덱스.

array Optional forEach()를 호출한 배열.

thisArg Optional  callback을 실행할 때 this로 사용할 값.

 

 

 

- forEach()는 주어진 callback을 배열에 있는 각 요소에 대해 오름차순으로 한 번씩 실행함.

- 요소 값 / 요소 인덱스 / 순회중인 배열 > 과 함께 콜백함수가 호출됨.

- thisArg를 forEach()에 제공한 경우 callback을 호출할 때 this의 값으로 쓰인다.

- forEach()는 map()과 reduce()와는 달리 undefined를 반환함

- forEach()는 배열을 변형하지 X / callback이 배열을 변형할 수는 있음

- forEach()는 중간에 멈출 수 없음. >> 예외 : for문 / every() / some() / find() / findIndex()

 

 

 

💡 javaScript this에 대한 포스팅은 아래 참고.

 

https://mywebproject.tistory.com/114

javascript) 자바스크립트 ' this '

 

 

자바스크립트 내에서 this는 '누가 나를 불렀느냐'를 뜻한다.

즉, 선언이 아닌 호출에 따라 값이 달라진다.

 

단독으로 쓴 this = global object

// 웹 브라우저에서는 window 객체가 전역 객체
console.log(this === window); // true

 

함수 안에서 this =  함수의 주인에게 바인딩 (=window객체)

 

엄격 모드) this 값은 실행 문맥에 진입하며 설정되는 값을 유지

-> this는 undefined로 남아있음

 

function f2(){
  "use strict"; // 엄격 모드 참고
  return this;
}

f2() === undefined; // true

- f2를 객체의 메서드 or 속성(예: window.f2())으로써가 아닌 직접 호출했기 때문에  this는 undefined임.

 

 

메서드에서의 this = 해당 메서드를 호출한 객체로 바인딩

 

f.bind(someObject)를 호출하면 f와 같은 본문(코드)과 범위를 가졌지만

this는 원본 함수를 가진 새로운 함수를 생성

>> 새 함수의 this는 호출 방식과 상관없이 영구적으로bind()의 첫 번째 매개변수로 고정

 

 

+) 화살표함수 (=>) 사용시

화살표 함수는 전역 컨텍스트에서 실행되더라도

this를 새로 정의하지 않고, 바로 바깥 함수나 클래스의 this를 쓸 수 있음.

 

>> 화살표 함수에서 this는 자신을 감싼 정적 범위 / 전역 코드에서는 전역 객체를 가리킴.

 

 

 

 

+) call / bind / apply 함수의 비교

 

javaScript. call() / bind() / apply()

 

 

 

 

 

REFERENCE

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

Array.prototype.forEach() - JavaScript | MDN