callback 함수

아직 그렇게 deep 하게 들어갈것 아니라고 하셨지만 자세히 잘 설명해주셨다.

function a(x){
  console.log(x)
}

a('야') // 야

let names = ['a', 'ab', 'cbb', 'ada'];
names.forEach(a); // 'a' 'ab' 'cbb' 'ada'

위에는 일반적인 함수 a이다. 우리가 호출을 하면 바로 함수 a가 그 기능을 수행한다.
callback함수가 되는 경우는 names.forEach(a) 의 a인 경우이다.
forEach라는 method의 인자에 온 a의 주도권은 forEach에게 있다. 우리가 names.forEach(a)코드를 실행하였을 때 a는 바로 실행되지 않고 forEach라는 method가 실행되어야지만 a코드가 실행된다는 것이다.
따라서 names라는 배열의 요소들을 순회한 forEach의 기능이 먼저 수행되고 a함수의 호출을 받아 각 요소를 출력하는 결과가 나오는 것이다.

thisIsButton.addEventListener('click', function() {
  const password = document.getElementById('password').value;

위의 코드는 Event에 대해 배울 때 다루었던 코드이다.
주도권이 addEvenListener에게 있으며 function()을 callback 함수라 할 수 있다.
위의 function()은 addEvenListener의 click인자가 입력될 때 실행되는 함수이다.

forEach

forEach는 그냥 리턴값이 없는 for문 느낌이라 왜 사용하는지 이해가 안가서 질문을 하였다.
forEach는 일단 foreach() 인자로 callback 함수가 오고 배열의 각 요소들이 반복될 때callback 함수가 호출된다.
사실 forEach는 사용이 많이 된다고 한다...(오히려 멘토님 본인은 for문을 쓰지 않으신다고..)
forEach나 map method의 특징은 declare(선언적)이라는 것이다. 따라서 for문이 절차적인 특징을 가진 것에 비해 코드를 확인하기에 용이하다.(유지보수성도 좋다.)
또한 for문의 경우 array를 다룰 때 index밖에 다루지 못하지만 forEach의 경우 array의 요소와 index모두 다룰 수 있다.
ps 구글링을 하니까 for...of를 사용하면 value에 접근 가능하다. for문이 아예 value에 접근 못하는 것은 아니었다.(literable한 object에 대해서만 가능하기 떄문에 object의 value에는 접근하지 못한다.)

Scope

markdown이 하려던 말은 사실 맞았다. 아래 블록의 색깔을 pink로 설정할 경우 우리가 위 블록의 의도한 색깔이 파란색이었던게 오염되기 때문에 이런 지역 scope간의 동일명변수설정은 지양해야한다. 가장 아래에 있던 console.log때문에 오해를 한거 같다. 가장 밑에 출력이 에러가 나는 이유는 내가 생각했던 전역변수의 부재가 맞다.
맨 아래의 console.log가 불필요하게 들어가 있어서 충분히 혼동이 올 수 있다며 추후에 markdown을 수정 할거 같으시다고 말하셨다.
다른 function에서 동일한 변수명을 사용하는 것은 가능하다고 하셨다. 이 때는 아예 새로운 지역 scope에 변수를 선언하는 것이라 전역변수만 고려하면 된다.
되도록이면 전역변수는 지양하자!