일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- JavaScript
- Interface
- useMemo
- 타스
- 고급타입
- Front-End
- TypeScript
- 자바스크립트
- lifting state up
- 배칭
- react router dom v6
- 렌더링
- mapped types
- TS
- state 최적화
- react rendering
- Next.js
- 프론트엔드
- react code splitting
- 렌더링 동작원리
- 상태 끌어올리기
- useCallback
- 리액트
- router dom
- rendering
- 리액트 코드분할
- 자동 배칭
- NextJS
- React
- 타입스크립트
- Today
- Total
목록프론트엔드/JavaScript (3)
서녕이네 개발단지

이번 포스팅은 자바스크립트의 '이벤트 루프'에 대해 포스팅하려고 한다. 이벤트 루프를 알아보기에 앞서 JavaScript의 특징부터 알아야 한다! JavaScript는 *싱글 스레드 언어라고 알려져 있다. *싱글 쓰레드란? - 여러 개의 작업이 있더라도 한 번에 하나의 작업만 수행할 수 있다. ❗️하지만 JavaScript를 사용해 보면 멀티 스레드처럼 동시에 여러 작업을 수행할 수 있다는 것을 알 수 있다. 그렇다면 JavaScript는 정말 싱글스레드 언어가 맞을까??😲 자세히 알아보자! JavaScript는 정말 싱글 쓰레드 언어일까? 그렇다! 정확하게 말하면 👉🏻 자바스크립트의 메인 스레드인 이벤트 루프가 싱글 스레드이기 때문에 자바스크립트를 싱글 스레드 언어라고 부른다. 하지만 이벤트 루프만 독..

화살표 함수란? 화살표함수는 ES6에서 새로 추가된 내용이다. 기존 함수 표현식과 비교하면 간결한 표현으로 간단하게 사용가능하다. 화살표 함수는 익명 함수로, 이름이 없는 함수, 즉시 실행이 필요할 경우 사용하는 함수이다. ❗️하지만 화살표 함수는 몇 가지 제한점이 있고 모든 상황에 사용할 수는 없다. - this, arguments나 super에 대한 자체 바인딩이 없고, methods로 사용해서는 안된다. (이 외에도 제한점이 많은데 자세한건 MDN 사이트에서 확인 가능하다.) 화살표 함수와 일반 함수의 차이? function fun() { // => 일반함수 ... } const arrow = () => { // => 화살표 함수 ... }; 차이점을 알아보기 전에 *바인딩에 대해 먼저 간단한 설명..

이번 포스팅은 검색어 조회 프로젝트를 하면서 알게 된 디바운스와 쓰로틀링을 포스팅하려고 한다. Throttle과 Debounce는 자주 사용 되는 이벤트나 함수들의 실행되는 빈도를 줄여서, 성능 상의 유리함을 가져오기 위한 개념이다. 둘은 비슷한 기능이지만 차이점이 있는데 이번 포스팅은 이들의 개념과 어떨 때 쓰이는지, 그리고 차이점에 대해 알아보려고 한다. Debounce(디바운스)란? 연이어 호출되는 함수들 중 마지막 함수(또는 제일 처음)만 호출하도록 하는 것 보통 검색어 기능에 자주 쓰인다. Debounce는 여러 번 발생하는 이벤트에서, 가장 마지막 이벤트 만을 실행되도록 만드는 개념이다. 👉🏻 예를 들어 ~ 입력이 끝난 500ms 동안 동일한 이벤트가 계속해서 발생 한다면, 입력이 끝날 때, ..