본문 바로가기
Programming/WEB

[JS] javascript의 화살표 함수 (arrow function)

by 코딩의성지 2022. 1. 23.

이전에 js에서 함수 표현 방식에 대해 포스팅했었다.

https://devkingdom.tistory.com/306

 

[JS] javascript의 함수 선언문과 함수 표현식

오늘은 간단하게 js 에서 함수를 사용하는 두가지 방법에 대해 정리해두려고한다. 함수 선언문 어디서든 호출이 가능함, javascript 내부 알고리즘에 의해서 javascript 실행 전 초기화 단계에서 코드

devkingdom.tistory.com

 

오늘은 함수 표현식을 화살표 함수로 변경해 보는 방법을 포스팅할 예정이다.

 

 

자바를 공부해 보신 분들은 자바의 lambda식을 활용해본 적이 있을 것이다.

자바스크립트에서 람다식을 사용할 수 있는데 이를 화살표 함수라 부른다. 실무에서 굉장히 많이 쓰이니  잘 익혀두자.

 

let add = function(num1, num2) {
  return num1 + num2;
}

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

위의 코드는 num1과 num2를 더하는 add 함수를 함수 표현식으로 작성한 코드이다.

이를 화살표 함수(arrow function)으로 변경해보자.

 

let add = (num1, num2) => (
  num1 + num2 
);
  
console.log(add(1, 2));

여기서  bodyt에 return 문 딱 한 줄만 있다면 화살표 뒤의 ( ) 도 생략이 가능하다

let add = (num1, num2) => num1 + num2;
  
console.log(add(1, 2));

 

만약에 body 부에 여러줄이 있다면 ()를 생략할 수 없을 뿐만 아니라 {} , 중괄호를 사용해줘야한다.

let add = (num1, num2) => {
  const result = num1 + num2;
  return result;
} 
  
console.log(add(1, 2));

 

아래 코드를 보자.

let square = (num) => num*num;
  
console.log(square(2));

이 코드는 하나의 숫자를 입력하면 해당 숫자의 제곱을 리턴해주는 화살표 함수인데, 이때 파라미터가 하나라면 파라미터의 괄호도 생략이 가능하다.

let square = num => num*num;
  
console.log(square(2));

만약에 파라미터가 없다면 () 를 생략할수 없다.

let printHello = () => ('Hello!') 
  
console.log(printHello());
반응형

댓글