본문 바로가기
Interactive Web/Fast Campus

패스트캠퍼스 환급챌린지 27일차 미션 (2월 27일) : 인터랙티브 웹 강의 후기

by 박철준 2024. 2. 27.

서론

함수의 고급 개념을 이해하는 것은 JavaScript를 더 깊이 있게 다루는 데 필수적이다. 특히, 함수의 실행 타이밍을 결정하는 호출 스케줄링과 함수 내부에서의 this 키워드 사용은 복잡한 웹 애플리케이션을 개발할 때 매우 중요한 부분이다. 오늘은 이 두 주제에 대해 공부하면서, 각각의 개념을 어떻게 이해하고 적용할 수 있는지에 대한 내용을 다루고자 한다.

본론

환급 챌린지 조건에 의해 최소 두 개의 강의를 들어야 한다. 다음 두 강의를 나누어 간략히 내용과 후기를 적으려 한다.

  • 첫 번째 강의: 함수 - 호출 스케줄링
  • 두 번째 강의: 함수 - this

첫 번째 강의: 함수 - 호출 스케줄링

호출 스케줄링은 특정 작업을 나중에 실행할 수 있도록 예약하는 것이다. 이 강의에서는 setTimeout과 setInterval을 사용하여 함수의 실행을 예약하는 방법에 대해 배웠다. 이벤트 리스너와 함께 사용할 때, 이들은 비동기 이벤트 처리에 있어 매우 유용하다. 예를 들어, 사용자의 액션에 따라 일정 시간 후에 함수를 실행하거나 중지하는 방법을 배울 수 있다. 다음은 강의에서 배운 호출 스케줄링의 예제 코드다.

이 코드는 2초마다 'Tick'을 출력하다가 사용자가 어디든 클릭하면 타이머를 취소하고 'Task canceled'을 출력한다.

두 번째 강의: 함수 - this

this 키워드는 함수가 호출되는 컨텍스트에 따라 다른 값을 참조한다. 강의에서는 일반 함수와 화살표 함수에서의 this 차이를 중점적으로 다뤘다. 일반 함수에서 this는 호출된 객체를 가리키지만, 화살표 함수에서는 상위 스코프의 this를 가리킨다. 이는 화살표 함수가 자신의 this를 생성하지 않기 때문이다. 다음은 this 사용의 예제 코드다.

이 예제는 this가 각 상황에서 어떻게 다르게 작동하는지 보여준다.

결론

호출 스케줄링과 함수 내의 this 사용은 JavaScript에서 매우 중요한 개념이다. 오늘 학습을 통해, 이 두 개념의 중요성과 활용법을 더 깊이 이해할 수 있었다. 앞으로 이 지식을 바탕으로 더욱 풍부하고 다양한 기능을 가진 웹 애플리케이션을 개발할 수 있을 것으로 기대한다. 복잡한 비동기 처리나 객체 지향 프로그래밍에서 this의 올바른 사용은 코드의 효율성과 가독성을 크게 향상시킬 것이다.

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다. https://bit.ly/48sS29N