JS 기초 : 함수 (feat.화살표 함수)

const a = 1;
const b = 2;
const sum = a + b;

두 값의 합을 return하는 함수를 작성해보자

function 사용하기

function addNum(n1, n2) {
  return n1 + n2;
}

const sum = addNum(1, 2);
console.log("두 값의 합은" + sum + "입니다.");

위의 출력문처럼 문자열을 조합할 때 '+'를 사용하는데 ES6 의 템플릿 리터럴 (Template Literal)이라는 문법을 사용하면 더 쉽게 사용할 수 있다.

템플릿 리터럴 (Template Literal)
변수들은 ${ } 로 감싸주고 문자열과 변수들은 ` 로 묶어주면 된다. 따라서 아래와 같이 작성할 수 있다.

console.log(`두 값의 합은 ${sum} 입니다.`);

화살표 함수 사용하기

function으로 작성한 코드를 아래와 같이 화살표 함수로 작성할 수 있다.

const addNum = (n1, n2) => {
  return n1 + n2;
};

console.log(addNum(1, 2));

또한 위의 함수처럼 함수의 기능이 짧다면 아래와 같이 더 줄일 수도 있다.

const add = (a,b)=>a+b;

const sum=add(1,2)

퀴즈 제작하고 풀어보기

아래의 함수와 동일한 기능을 하는 함수를 화살표 함수를 이용하여 작성하시오.

function addNum(num1,num2){
return num1+num2;
}

정답

/*정답 1*/
const addNum=(num1,num2)=>{
 return num1+num2;}

/*정답 2*/
const addNum=(num1,num2)=>num1+num2;