[Javascript] 자바스크립트의 함수

1. 화살표 함수 (람다)

function add(a,b) {
  return a + b;
}

위 함수를 아래와 같이 표현 가능하다.

const add = (a, b) => {
  return a + b ;
}

이러한 모양 때문에 이것을 화살표 함수라고 한다.
{와 return이 서로 붙어 있으면 아래와 같이 작성 가능하다.

const add = (a, b) => a + b;

2. 일급 객체

1. 해당 타입이 변수에 할당될 수 있어야 한다.
2. 해당 타입이 함수의 인자로 넘어갈 수 있어야 한다.
3. 해당 타입이 함수의 반환값으로 반환될 수 있어야 한다.

위의 일급 객체에 포함되는 것은 다음과 같다.

숫자, 문자열, 불리언, null, undefined

const a = 1;
const b = 2;

function add(a,b) {
  return a + b;
}

const result = add(a,b)

이렇게 함수의 파라미터로도 사용될 수 있고, 변수로도 사용될 수 있다. 그리고 add 함수는 숫자에 반환하여 result에 값을 넣게 된다. 이렇게 숫자는 일급객체로 사용될 수 있는데, 자바스크립트는 특이하게 함수도 일급객체이다.

함수는 변수에 담을 수 있다.

const add = (x, y) => x + y;

위는 화살표 함수를 add라는 변수에 담은 것이다.

const add = function(x,y) {return x + y };

이렇게 함수를 add라는 변수에 담을 수 있는 것이다.
또한, 함수를 함수의 인자로 넘겨줄 수 있다.

function exec(fn){
  fn(1);
}

exec(console.log);
exec(alert);

또한, 함수는 함수의 반환값이 될 수 있다!
함수를 다른 함수의 인자로 넘기는 경우가 많음 Ex) addEventListener. 그래서 이 부분에 대해서 꼭 이해를 하고 넘어가야 한다.

이런 형태도 익숙해보도록 하자... addEventListenr에 바로 함수를 선언 시작한 것.

const button = document.querySelector('button');

button.addEventListener('click', () => {
  console.log('clicked');
});