✨ 일반함수
- 함수 선언식
함수 선언식의 특징은 호이스팅 이 가능하다. 함수의 호이스팅이란 함수의 선언을 코드의 최상단으로 끌어올리는 것을 의미한다.
function main() {
console.log("hello")
}
//함수 호출시 console에는 "hello"가 출력됨
main()고로 main 함수는 호이스팅이 되기 때문에 함수를 코드상에서 선언하기 이전에 main() 함수를 호출할 수 있음.
//최상단에서 main 함수를 호출해도 console에는 "hello"가 출력됨
main()
function main() {
console.log("hello")
}💡 중요한 점
함수 선언식으로 함수를 선언할 때는 함수의 이름(main)을 필수적으로 넣어줘야 함. 그러므로 함수 선언식에서는 이름이 없는 함수인 익명함수는 만들 수가 없음. 익명함수를 만들기 위해서는 함수 표현식을 사용해야함
함수 표현식
함수를 하나의 표현식 안에서 정리하는 것을 함수 표현식이라고 부름.
함수 표현식과 함수 선언식은 문법적으로는 비슷함. 하지만 가장 큰 차이점은 함수 표현식은 익명함수 를 만들 수 있고 호이스팅이 불가능하다는 점.
함수 표현식 또한 function() 키워드를 사용해서 함수를 정의함. 하지만 함수 선언식과는 다르게 함수의 이름을 생략할 수 있음.
//이름이 없는 익명함수
function()
// 이름이 있는 named function
function main()아래 쓰인건 익명 함수이며, 익명 함수를 선언함과 동시에 함수를 main이라는 변수에 할당을 해줌. 그렇기 때문에 우리는 이 변수 이름을 함수 이름으로 써서 main() 같이 호출할 수 있음.
const main = function() }
console.log("hello")
}
main()요약
🔸 함수 선언식
- function 사용
- 호이스팅 O
- 익명함수 X
🔸 함수 표현식
- const 사용
- 호이스팅 X
- 익명함수 O
✨ 화살표함수
ES6 버전에서 등장한 문법. 기존의 함수 표현식을 훨씬 더 간결한 문법으로 작성하게 해줌
화살표 함수는 함수 표현식에서 했던 방법처럼 항상 익명함수 이므로 함수를 변수에 'mian' 할당을 해주면 우리가 원할 때 마다 함수를 호출할 수 있음.
const main = () => {
console.log("hello")
}
main()함수선언식 vs 화살표 함수
🌼 함수선언식
function add(a,b) {
return a+b
}
add()🌼 화살표함수
tip : 안에 코드가 한줄만 있으면 중괄호와 return 키워드 생략 가능
const add = (a,b) => {
return a+b
}
add()
//중괄호가 생략되면 return 키워드도 생략 가능
const add = (a,b) => a+b
add()매개변수
매개변수가 하나일 때만 (text)에서 소괄호를 생략할 수 있음
const print = text => console.log(text)
print("hi")매개변수가 두개일 때는 소괄호에 콤마로 묶어주기
const print = (text1, text2) => console.log(text)
print("hi")매개변수가 없을 때는 소괄호만 남겨두기
const print = () => console.log("hi")
print("hi")객체를 리턴할 때
객체를 리턴할 때는 소괄호로 한번 묶어주기
const getObject = () => ({ name:"철수" })
getObject()