function add(a, b) {
    return a + b;
};

add(1, 2); // 3
const add = function(a, b) {
    return a + b;
};

add(1, 2); // 3
const add = (a, b) => {
    return a + b;
};

add(1, 2); // 3
// 매개변수가 하나뿐인 경우 소괄호 () 는 선택사항임.
const func = param => {...} // 괄호 생략한 서식

// 위 표현은 다음과 같이 해석됨.
const func = (param) => {...} // 소괄호 () 를 생략하지 않은 서식
const add = (a, b) => a + b; // return 키워드를 생략할 경우 중괄호 {} 는 반드시 생략해야 함.


// 위 표현은 다음과 같이 해석됨.
const add = (a, b) => { return a + b; };
const add = (a, b) => {
    const sum = a + b;
    console.log("Sum:", sum);
    
    // return 키워드를 생략할 수 없습니다.
    return sum;
};

const result = add(3, 5);
console.log("Result:", result); // 결과: Sum: 8, Result: 8
// 잘못된 사용: 중복된 매개변수 이름
const multiply = (x, y, x) => {
    return x * y;
};
const Person = (name) => {
    this.name = name;
};

const john = new Person("John"); // 에러 발생: Person is not a constructor
const Person = (name) => {
    this.name = name;
};

console.log(Person.hasOwnProperty("prototype")); // false
<!DOCTYPE html>
<html>
    <head>
        <title>Event Listener Example</title>
    </head>
    <body>
        <button id="myButton">Click Me</button>
        <script src="event.js"></script>
    </body>
</html>
const myButton = document.getElementById('myButton');

// 일반 함수를 사용한 이벤트 핸들러
myButton.addEventListener("click", function() {
    console.log("Clicked using normal function. This: " + this.textContent);
});

// 화살표 함수를 사용한 이벤트 핸들러
myButton.addEventListener("click", () => {
    console.log("Clicked using arrow function. This text: " + this.textContent);
});
function sumWithArguments() {
    let sum = 0;
    
    for (let i = 0; i < arguments.length; i++) {
        sum += arguments[i];
    }
    
    return sum;
}

const sumWithArrow = () => {
    let sum = 0;
    
    for (let i = 0; i < arguments.length; i++) {
        sum += arguments[i]; // 여기서 arguments를 사용하면 에러가 발생합니다.
    }
    
    return sum;
}

console.log(sumWithArguments(1, 2, 3, 4, 5)); // 출력: 15
console.log(sumWithArrow(1, 2, 3, 4, 5)); // 에러 발생: arguments is not defined
const myObj = {
    name: "홍길동",
    func: function() {
        console.log(this.name); // 출력: "홍길동"
        
        /* 일반 함수를 사용 */
        setTimeout(function() {
            console.log(this); // 출력: window 객체
            console.log(this.name); // error 출력되지 않음
        }, 1000);
        
        /* 일반 함수를 사용 */
        setTimeout(function() {
            console.log(this); // 출력: myObj 객체
            console.log(this.name); // 출력: "홍길동"
        }.bind(this), 1000); // bind() 함수로 this를 myObj 객체로 설정해야 하는 번거로움이 있음
    },
    arrow_func: function() {
        console.log(this.name); // 출력: "홍길동"
        
         /* 화살표 함수를 사용 */
        setTimeout(() => {
            console.log(this); // 출력: myObj 객체
            console.log(this.name); // 출력: "홍길동"
        }, 1000);
    } 
}

myObj.func();
myObj.arrow_func();

caniuse.com에서 더 자세한 정보를 확인해 보세요.