오늘 배운 것

• 일급객체
• 함수 선언식, 함수 표현식
• 함수 호이스팅
• 고차함수

일급 객체

자바스크립트에는 일부 특별한 대우를 받는 것들이 존재한다. 이런 것들을 '일급 객체'라고 하는데, 그중 하나가 함수이다.

즉, 자바스크립트에서 함수는 아래와 같이 특별하게 취급된다

• 변수에 할당할 수 있다
• 다른 함수의 인자로 전달될 수 있다
• 다른 함수의 결과로 리턴될 수 있다.

이는 함수를 데이터(string, number, boolean, array, object)를 다루듯이 할 수 있다는 것을 의미하며, 변수에 저장할 수 있기 때문에 배열의 요소나 객체의 속성값으로 저장하는 것도 가능하다.

함수 선언식, 함수 표현식

함수 선언식

일반적인 프로그래밍 언어에서의 함수 선언과 비슷한 형식이다

function func_name() {
let func_logic
return func_logic
}

함수 표현식

유연한 자바스크립트 언어의 특징을 활용한 선언 방식이다

let func_name = function(){
   let func_logic
   return func_logic
   }

함수 선언식과 표현식의 차이점

함수 선언식은 호이스팅의 영향을 받지만, 함수 표현식은 영향을 받지 않는다.
함수 표현식은 클로저로 사용하거나 콜백(다른 함수의 인자로 넘김)으로 사용할 수 있다.

함수 호이스팅

요약 : 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 스코프 최상단에 위치하도록 하는 것

호이스팅이란

자바스크립트는 함수가 실행되기 전에 변수를 모두 모아서 스코프 최상단에 선언한다.

• 자바스크립트 parser가 함수 실행 전 해당 함수를 훑는다
• 함수 안에 존재하는 변수와 함수선언에 대한 정보를 기억하고 있다가 실행시킨다.

주의할 점

• 실제로 코드가 끌어올려지는 것은 아니며, parser가 내부적으로 끌어올려서 처리
• 실제 메모리에서는 변화가 없음

호이스팅의 대상

• 함수 선언식
• var 변수,함수의 선언 (할당은 끌어올려지지 않는다)

고차함수

내장 고차함수

자바스크립트에는 기본적으로 내장되어있는 고차 함수들이 있다. 대표적으로 map, filter, reduce가 있다.

map

요약 : 배열의 각 요소가 특정 함수에 의해 다른 요소로 지정된다

let num = [1, 2, 3]
let result = num.map(function (el) {
  return el * 2
  });
return result;

map 함수는 입력받은 배열(위 예시에서는 num)의 각 요소들을 쪼개어 내장 익명 함수에 하나씩 인자로 던져주고, 내장 익명 함수의 연산을 거쳐 새로운 배열에 결과값을 저장한다.

filter

요약 : 배열의 각 요소가 특정 함수로 판별하여 true일 경우 따로 분류한다

let num = [1, 2, 3]
let result = num.filter(function (el) {
  return el % 2 !== 0
  })
return result;

filter 함수는 입력받은 배열(위 예시에서는 num)의 각 요소들을 쪼개어 내장 익명 함수에 하나씩 인자로 던져주고, 내장 익명 함수로 조건을 판별하여 true인 요소들만 새로운 배열에 결과값을 저장한다.

reduce

요약 : 배열의 각 요소를 특정 함수에 따라 원하는 하나의 형태로 응축한다

let num = [1, 2, 3]
let result = num.reduce(function (acc, cur, idx) {
  return acc + cur;
  return acc;
  }, 1)
return result;

reduce는 흔히 누산하는 함수라고 알고 있는 경우가 많은데, 오히려 반복문과 조건문이 결합된 형태에 더 가까운 성질을 가지고 있다. 위는 누산기로 썼을 때의 코드 예시이고, 아래는 반복문과 조건문의 결합된 형태로 사용했을 때의 예시이다.

return newArr.reduce(function (a, b){
  if(a.length <= b.length){
    return a ;
  } else {
    return b; 
  }
})