[한입 크기로 잘라 먹는 리액트] 함수표현식 & 화살표 함수

SunYerim·2023년 3월 20일
0
post-thumbnail

강의를 듣다가 이건 정리해두는 게 좋겠다 싶은 생각에 ..!

Javascript 기본편 - 함수표현식&화살표함수

함수 표현식(선언식)

let hello = function() {
  return "안녕하세요 여러분";
}; // 함수 표현식 

function helloFunc(){
  return "안녕하세요 여러분";
} // 함수 선언식

const helloText = hello();
console.log(helloText); //안녕하세요 여러분
  • 함수 표현식: 함수를 이름이 없도록 만들어서(무명함수) 변수에 담아서 활용하는 방식
console.log(helloB()); // 안녕하세요 여러분

let helloA = function () {
	return "안녕하세요 여러분";
}; //함수 표현식

function helloB(){
  return "안녕하세요 여러분";
}; // 함수 선언식

-이때, 1번라인에서 실행을 했으나(선언 전 실행), 7번라인에 선언이 되어있음
=> 호이스팅

console.log(helloB()); // 안녕하세요 여러분
console.log(helloA()); // TypeError: helloA is not a function => 실행 안 됨.

let helloA = function () {
	return "안녕하세요 여러분";
}; //함수 표현식

function helloB(){
  return "안녕하세요 여러분";
}; // 함수 선언식

함수 선언식은 호이스팅이 이루어져서 사용 가능하나, 함수 표현식은 호이스팅 적용이 안 됨! 함수 표현식은 호이스팅의 대상이 되지 않는다.

화살표 함수

let helloA = () => {
  return "안녕하세요 여러분";
};
or
let helloA = () => "안녕하세요 여러분"; // (하나만 return할 경우, 함수 표현식 ) 

화살표 함수 또한 호이스팅의 대상이 아니므로 순서를 잘 지켜서 코딩을 해줘야한다.

profile
내 안에 있는 힘을 믿어라.

0개의 댓글