일반함수와 화살표함수(Arrow Function) 의 차이

일반함수와 화살표함수의 차이를 적어보고자 한다.

 

화살표함수는 항상 익명이다.

따라서 항상 변수명을 선언해주어야 원하는대로 사용이 가능하다.

var test = () => { console.log('test') };
test();

위와 같이 선언이 가능하다.

function 선언문과 비교했을때 정말 깔끔하고 예쁘게 생겼다.

다만 앞서 올린 글과같이 함수 자체가 호이스팅 되지는 않기 때문에 함수가 할당 된 이후에만 해당 함수를 사용할 수 있다.

 

일반함수와 화살표함수의 차이는 깔끔한 것도 있지만, 가장 큰 차이점은 this이다.

일반함수가 실행될 때 this가 새로 정의되지만, 화살표함수는 this를 새로 정의 하지 않는다.

function test_func(){
  this.test = 'hi';
  setTimeout(() => console.log(this.test), 1000);
}
test_func(); // hi

function test_func(){
  this.test = 'hi';
  setTimeout(function(){console.log(this.test);}, 1000);
}
test_func(); // undefined