[JavaScript] 자바스크립트에서 this 기능(화살표함수) 사용하기

261_자바스크립트에서 this 기능(화살표함수) 사용하기 [적용] 클래스의 멤버 변수를 메소드 내부와 이벤트 리스터에서 참조하고 싶을 때 [문법] 구문 의미 () => {} 화살표 함수 정의 [내용] 자바스크립트에서 this는 실행하는 영역에 따라 참조하는 곳이 변한다. 화살표 함수를 사용하면 실행 영역에 상관없이 this의 참조가 변하지 않으므로 코드의 가독성이 좋아진다. 클릭 횟수를 계산하는 프로그램을 통해 조금 더 자세히 알아보자. 다음은 LikeCounter 클래스의 멤버 변수 ClickedCount를 사용해 클릭 횟수를 카운트하는 목적의 프로그램이다. 우선 정상 동작하지 않는 코드를 먼저 확인해 보자. JavaScript ERROR class LikeCounter { constructor() ..

2022.08.08

[JavaScript] 자바스크립트 화살표 함수(Arrow Function) 사용하기

011 _ 자바스크립트 화살표 함수(Arrow Function) 사용하기 [적용] 함수를 간략히 정의하고 싶을 때 this를 지정하고 싶을 때 [내용] function 외에도 화살표 함수를 사용하여 함수를 정의할 수 있다. 화살표 함수의 장점은 다음과 같다. 1. 함수를 간략히 기술할 수 있다. 2. this를 묶는 것이 가능하다 [문법] 구문 의미 (파라미터) => { 처리내용 } 함수를 정의 [예시1] 화살표 함수는 다음과 같이 정의하여 사용한다. JavaScript // 함수의 정의 const calcSum = (a, b, c) => { const result = a + b + c; return result; }; // 함수의 실행 calcSum(1, 2, 3); // 결과: 6 [예시2] 화살표 ..

2021.05.03