JavaScript 화살표 함수 정리

description : JavaScript 화살표 함수 정리
author : 오션
email : shlim@repia.com
lastupdate : 2022-12-22 Thu

JavaScript 화살표 함수 정리

Syntax

param => expression
 
(param) => expression
 
(param1, paramN) => expression
 
param => {
    statements
}
 
(param1, paramN) => {
    statements
}

매개변수 내부에서 Rest parameters, default parameter, 그리고 destructuring을 사용하는 것이 지원되며, 항상 소괄호가 필요합니다.

(a, b, ...r) => expression
(a = 400, b = 20, c) => expression
([a, b] = [10, 20]) => expression
({a, b} = { a: 10, b: 20 }) => expression

화살표 함수 변환 과정

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>The filter() Method</title>
</head>
<body>
 
    <h1>JavaScript Arrays</h1>
    <h2>The filter() Method</h2>
 
    <p>Get every element in the array that has a value of 18 or more:</p>
 
    <p id="demo"></p>
 
    <script>
        const ages = [32, 33, 16, 40];
 
        const filtered = ages.filter(function(age){return age >= 18;});
        console.log(filtered);
 
        const filtered2 = ages.filter((age) => {return age >=18;});
        console.log(filtered2);
 
        const filtered3 = ages.filter((age) => age >= 18);
        console.log(filtered3);
 
        const filtered4 = ages.filter(age => age >= 18);
        console.log(filtered4);
 
        // 출력 결과 모두 동일
        // (3) [32, 33, 40]
        //  0: 32
        //  1: 33
        //  2: 40
        // length: 3
        // [[Prototype]]: Array(0)
 
    </script>
</body>
</html>

Ref Link

Arrow function expressions
JavaScript Array filter()
Array.prototype.filter()
jQuery - Traversal - Filter
[JavaScript]배열에서 특정 값의 개수

오션, Javascript, 화살표 함수 정리

문제를 잘 정의하는 것은 문제를 절반 해결한 것이다. - 2023.12

목차

JavaScript 화살표 함수 정리

JavaScript 화살표 함수 정리

Syntax

Ref Link

문제를 잘 정의하는 것은 문제를 절반 해결한 것이다. - 2023.12

사용자 도구

사이트 도구

목차

JavaScript 화살표 함수 정리

JavaScript 화살표 함수 정리

Syntax

Ref Link

문서 도구