화살표 기능이란 무엇입니까? -2 부

암시적 반환

JavaScript에서 return undefined 문이 함수에서 생략되면 암시적return이 발생합니다. 이 문맥에서 암시적이라는 단어는 암시적이지만 직접적으로 언급되지 않은 것을 가리킵니다. 즉, 결과가 return undefined이므로 undefined가 없습니다.

예시:

const sum = (a, b) => {
   a + b;
}

sum(2, 5); // undefined

위의 예에서 sum(2,5)는 함수 본문에 undefined 키워드가 없기 때문에 return를 반환합니다.

예시:

// implicit return
const sum = (a, b) => a + b;

sum(2, 5); // 7

화살표 함수의 길이가 한 줄이면 return 키워드와 중괄호가 필요하지 않습니다.

//without implicit return
const canVote = age => {
   return age >= 18;
}

다음을 통해 암시적 반환을 활용해 보겠습니다.

중괄호 제거

return 키워드 제거

const canVote = age => age >= 18;

이것은 이 함수를 작성하는 가장 명확하고 짧은 접근 방식입니다.

암시적 반환을 사용하는 배열 메서드

이제 화살표 함수와 암시적 반환을 사용하여 콜백을 만드는 방법을 살펴보겠습니다.

배열.필터()

//without implicit return
const ages = [10, 15, 21 45];

const agesAboveTwentyOne = ages.filter(function(age) {
   return age > 21;
});
console.log(agesAboveTwentyOne); //[21, 45]


//with implicit return
const agesAboveTwentyOne = ages.filter(age => age > 21);

ages가 21보다 큰 경우 age를 필터링합니다.

배열.찾기()

//without implicit return
const furBabies = ['Dutches', 'Monty', 'Benny', 'Lucky', 'Chili'];

const findNames = furBabies.find(function(furBaby) {
   return furBaby === 'Benny';
});
console.log(findNames); // 'Benny'


//with implicit return
const findNames = furBabies.find(furBaby => furBaby === 'Benny');

furBabies 배열에서 furBaby 문자열과 동일한 'Benny'를 찾습니다.

배열.맵()

//Without implicit return
const numbers = [2, 6, 8, 10];

const tripled = numbers.map(function(number){
  return number * 3;
});
console.log(tripled); //[6, 18, 24, 30]


//with implicit return
const tripled = numbers.map(number => number *3);

모든 numbers에 3을 곱한 number 배열을 기반으로 새 배열을 만듭니다.

아래 댓글 섹션에서 의견을 공유해 주세요. 당신의 생각을 듣고 싶습니다. 아니면 들러서 '👋'라고 말해주세요.