Looping Arrays: forEach

예전에 The for-of Loop 를 통해서 array를 loop해주는걸
배웠는데 오늘은 forEach를 이용해서 loop해주는것을 배웠다.

const movements = [200, 450, -400, 3000, -650, -130, 70, 1300];

for (const movement of movements) {
  if (movement > 0) {
    console.log(`You deposited ${movement}`);
  } else {
    console.log(`You withdrew ${Math.abs(movement)}`);
  }
}

console.log('----FOREACH ----');
movements.forEach(function (movement) {
  if (movement > 0) {
    console.log(`You deposited ${movement}`);
  } else {
    console.log(`You withdrew ${Math.abs(movement)}`);
  }
});

첫번째는 for of loop를 이용한거고
두번째는 forEach loop를 이용했다.
유데미 선생님 말로는 foreach가 더 클린한 코드라고 한다.
foreach는 콜백함수를 저렇게 써주는게 특징이다.
여기서 콜백함수는 function(movement)이다ㅎㅎ

각각 index도 뽑아주고 싶을 때는 아래와 같이 하면 된다.

for (const [i, movement] of movements.entries()) {
  if (movement > 0) {
    console.log(`Movement ${i + 1}: You deposited ${movement}`);
  } else {
    console.log(`Movement ${i + 1} :You withdrew ${Math.abs(movement)}`);
  }
}

console.log('----FOREACH ----');
movements.forEach(function (mov, i, arr) {
  if (mov > 0) {
    console.log(`Movement ${i + 1} : You deposited ${mov}`);
  } else {
    console.log(`Movement ${i + 1} : You withdrew ${Math.abs(mov)}`);
  }
});

둘이 다른점은 forof는 먼저 인덱스가 나오고 그다음에 current element가 나온다.

for (const [i, movement] of movements.entries())

반대로 forEach는
먼저 current element가 나오고 그다음에 index 그리고 후에 array또 써준다.

movements.forEach(function (mov, i, arr)

둘의 또 다른점은
forEach는 you cannot breakout..
그래서 continue랑 break구문이 forEach loop에서는 적용되지 않는다.

3/25

for each는 for of가 나온뒤로 그렇게 예전만큼은 잘 안쓴다고 하는데
그래도 쓰긴 쓰나봄ㅎㅎ
아래의 예시가 더 쉬운것 같으니 한 번 살펴보자

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20];

numbers.forEach(function (el) {
    if (el % 2 === 0) {
        console.log(el)
    }
})

for each로 짝수인 숫자들만 빼준거..
짝수인 element들이 나온다 ㅎㅎ

const movies = [
    {
        title: 'Amadeus',
        score: 99
    },
    {
        title: 'Stand By Me',
        score: 85
    },
    {
        title: 'Parasite',
        score: 95
    },
    {
        title: 'Alien',
        score: 90
    }
]

movies.forEach(function (movie) {
    console.log(`${movie.title} - ${movie.score}/100`)
})