article thumbnail image
Published 2022. 2. 15. 04:24

화살표함수 (익명함수일때만 사용이 가능하다.)

- 함수를 축약형으로 만들어줌

//() => {}  vs function () {}

const double = function (x) { 
  return x * 2
}
console.log('double:', double(7))
//매개변수가 하나일때
const doubleArrow = x => x * 2
console.log('doubleArrow:', doubleArrow(7))

매개변수가 두개이상이아니고 하나일경우엔 () 소괄호도 생략이 가능한다.

//매개변수가 두개일때
const doubleArrow = (x, y) => x * 2
console.log('doubleArrow:', doubleArrow(7))

화살표함수에는 숫자데이터 문자데이터 블린, null, undefinde, 배열등 모든 데이터들이 출력될 수 있는데

객체데이터는 {} 중괄호를 사용하는 데이터이기때문에 반드시 소괄호로 감싸고 사용해야한다.

 

이유는?

객체데이터를 만들땐 중괄호를 사용하는데.. 중괄호는 화살표함수에서 중간블럭을 만들때

사용되기때문에 기호가 중복된다.

그래서 화살표함수에서 중괄호{}는 객체테이터가 아니고 화살표함수의 블록으로 해석이 되기때문에.

const doubleArrow1 = x => '123' 
console.log(doubleArrow1())
const doubleArrow2 = x => 188
console.log(doubleArrow2()) 
const doubleArrow3 = x => null
console.log(doubleArrow3())
const doubleArrow4 = x => [1, 2, 3]
console.log(doubleArrow4())
const doubleArrow5 = x => ({ name: 'seo0'})
console.log(doubleArrow5())

 

 

화살표함수는 함수를 간단하게 만들어주고, 함수 표현식일때만 사용가능하다.
화살표함수에서 출력되는 데이터중 객체데이터는 ({})  소괄호로 감싸고 사용해야 한다.

'개발이야기 > JS' 카테고리의 다른 글

[JS] 호이스팅  (0) 2022.02.15
[JS] 즉시실행함수  (0) 2022.02.15
[JS] 함수 (간략하게 정리)  (0) 2022.02.15
[JS] Truthy & Falsy 형 변환 (Type conversion)  (0) 2022.02.11
[JS] 반복문 (for)  (0) 2022.02.11
복사했습니다!