[JS] 함수 선언 방법 및 호출 시기

1. 함수 선언문 (Function Declaration)

함수 선언문이 정의되기 전에 해당 함수 호출 가능

• 선언 전후에 호출 가능

export default function Test() {

  sayHi();
  
  //함수 선언문
  function sayHi() {
	console.log("hi");
  }
  
}
new Test();

2. 화살표 함수 (Arrow Function)

선언 이후 호출해야 한다

export default function Test() {

  const sayHi = () => {
    console.log("hi");
  }

  sayHi();
  
}
new Test();

3. 함수 표현식 (Function Expression)

함수 표현식에 도달한 이후부터 해당 함수 호출 가능

• 선언 이후 호출 가능

export default function Test() {
  
  //함수 표현식
  let sayHi = function() {
	console.log("Bye");
  }
  
  sayHi();
  
}
new Test();

4. this.function

this를 붙인 함수를 생성할 수 있다

• 호출할 때는 this.함수명 으로 호출해야한다
• 함수 표현식이므로 선언 이후 호출 가능

export default function Test() {

  //this가 붙은 함수 표현식
  this.sayHi = function () {
    console.log("hi");
  }

  this.sayHi();
  
}
new Test();

선언 시기 비교 예시

참고

export default function Test() {
  plsayHiay();				//2번 함수가 실행된다

  //1번 함수
  this.sayHi = function () {
    console.log("hi");
  }

  this.sayHi();				//1번 함수가 실행된다

  sayHi();				//2번 함수가 실행된다

  //2번 함수
  function sayHi() {
    console.log('bonjour');
  }
  
}
new Test();
//hi
//bonjour
//hi

5. 클래스 내에서 함수 선언

export default class Test {
  sayHi() {
    console.log("hi");
  }
}

let = new Test();
a.sayHi();
//hi