1. 함수선언식

function helloFunc() {
	return "안녕하세요 여러분"
}

2. 함수표현식

-> 함수를 변수에 담아서 활용하는 것
-> 함수를 값에 담는다.(?)

// 앞에 변수를 설정해두면 함수에 이름을 안 붙여줘도 된다.
//함수를 담고 있는 변수의 이름을 함수인것처럼 활용하면 된다.
let hello = function(){
  return "안녕하세요 여러분"
}

* 호이스팅

-> 함수선언식으로 만들어진 함수는 함수 실행전에 코드의 최상단으로 끌어올려지는 것을 의미한다.
-> 함수선언식은 호이스팅이 가능하지만 함수표현식은 불가능하다.

console.log(helloB())
// 콘솔창에 helloB의 "안녕하세요 여러분"이 출력된다. (호이스팅)
console.log(helloA())
//에러가 뜬다.

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

console.log(helloA())
// 콘솔창에 helloA의 "안녕하세요 여러분"이 출력된다.
// 함수표현식은 직접적으로 함수가 선언되기 전에는 접근이 불가능하다. 

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

3. 화살표함수

-> 함수표현식을 간략하게 쓴 것
-> 함수표현식을 간략하게 쓴 것이기에 화살표 함수도 호이스팅 대상이 아니다.

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

let hello = ()=>{
  return "안녕하세요 여러분"
} // 화살표 함수

let hello = ()=> "안녕하세요 여러분"
// 화살표 함수
//값만 리턴하는 경우

👤 JavaScript 화살표 함수 주의사항

✔ 화살표 함수의 경우 괄호()로 감싸진 부분이 return 된다(return문을 작성하지 않아도 return 됨).

const Button = () => (
    <button>Hello world</button>
)

✔ 중괄호{}로 감싸진 함수는 return문이 없다면 return 값을 반환하지 않는다.
✔ 중괄호{}를 사용하여 return 값을 반환하고자 하는 함수를 만드려면 return 문을 사용하여 코드를 작성해야한다.

const Button = () => {
    return <button>Hello world</button>
}