함수 선언

foo() // 'FOOOOO' 
function foo() {
  console.log('FOOOOO')
}

함수 표현식

foo() // Uncaught TypeError: foo는 함수가 아닙니다
var foo = function() {
  console.log('FOOOOO')
}

전자는 함수 선언인 반면, 후자는 함수 표현식이다. 주요한 차이점은 함수 선언은 함수바디가 호이스트되지만, 함수 표현식의 바디는 호이스트되지 않는다(변수와 동일한 호이스팅 동작을 가짐). 함수 표현식을 정의하기 전에 호출하려고 하면 Uncaught TypeError : XXX is not function에러가 발생한다.

<aside> 💡 함수 선언보다 함수 표현식을 쓰는 습관을 들이자!!!! 이유는 var —> let,const 쓰는 것과 비슷함

</aside>

Arrow Function

var 예쁜함수 = () => {
//어쩌구
}

함수 Arrow Function 장점

  1. 여러가지 기능을 하는 코드를 한 단어로 묶고 싶을 때 (그리고 나중에 재사용할 때)
  2. 입출력기능을 만들 때 이럴 때 함수를 써야함.
var 두배만들기 = x => { return x * 2 }
console.log( 두배만들기(4) );
console.log( 두배만들기(8) );
  1. 파라미터가 하나라면 소괄호를 생략가능
var 두배만들기 = x => x * 2 ;
console.log( 두배만들기(4) );
console.log( 두배만들기(8) );
  1. 중괄호 안에 return 한줄 뿐이라면 중괄호와 return도 생략 가능
  2. arrow function을 쓰면 내부에서 this값을 쓸 때 밖에 있던 this값을 그대로 사용함
var 오브젝트1 = {
함수 : function(){ console.log(this) }
}
오브젝트1.함수()
=================================
오브젝트1
var 오브젝트1 = {
함수 : () => { console.log(this) }
}
오브젝트1.함수()
=====================
window -->this값은 함수를 만나면 항상 변하는데 arrow function 
					안에서는 변하지 않고 밖에 있던 this를 그대로 씁니다.