출처 : https://www.youtube.com/watch?v=5kRgzyGRPrU&t=357s
✅함수 선언식
- function 키워드로 단독으로 함수를 선언한 것
function sum(num1,num2){
return num1+num2;
}
✅함수 표현식
- 변수에 함수를 할당한 것
const sum = function sum(num1,num2){
return num1+num2;}
✅화살표 함수(arrow function)
화살표함수는 sum 과 같은 식별자가 없어서 호출할 수가 없다.
화살표 함수를 호출하기 위해서는 함수 표현식 방법처럼 변수에다가 화살표 함수를 할당해줘야한다.
그래야, 화살표함수가 할당되어져있는 sum이라는 변수를 이용해서 올바르게 화살표함수를 호출할수있게된다.
const sum = (num1,num2)=>{
return num1 + num2;
}
const result = sum(10,20);
console.log(result);
✅화살표함수 특징
- return{} 을 생략할 수 있다.
const sum = (num1,num2) => num1+num2;
- parameter가 1개일 경우 소괄호를 생략할 수 있다. 생략하지 않아도된다.
const pow = x => x*x;
const result = pow(10); //10의 제곱
console.log(result); //100
- parameter가 1개도 없을 경우는 소괄호만 남겨둔다.
3.14가 잘 반환된다.
const printPie = () => 3.14;
const result = printPie();
console.log(result);
- 화살표함수가 내부적으로 객체를 반환하고 있다면, 소괄호로 한번 감싸줘야한다.
왜냐하면 return{} 과 겹칠때 헷갈릴수 있기 때문이다.
const getObject = () =>({
name:"철수",
age:20
})
const obj = getObject();
console.log(obj.name);
'프론트엔드 개발 > JavaScript' 카테고리의 다른 글
자바스크립트) 변수 const, let, var (1) | 2022.11.12 |
---|---|
Json server 로 mock 서버 만들기 (0) | 2022.11.07 |
JavaScript) 반복문 - Array.forEach &object.for in (0) | 2022.10.12 |
JavaScript) 함수 return (0) | 2022.10.10 |
JS) if/else, function 3,6,9게임 연습문제 (0) | 2022.10.07 |