일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 프로미스
- BETA
- 스프레드 문법
- Ref로 DOM 다루기
- 이터러블
- 배열
- Set과 Map
- 제너레이터
- Ref로 값 참조하기
- DEEPDIVE
- 싸피
- await
- js
- 브라우저의 렌더링 과정
- 표현식과 문
- 에러 처리
- 클로저
- Deep Dive
- 디스트럭처링 할당
- 데이터 타입
- ES6 함수의 추가 기능
- async
- 개발 환경 구축
- Strict Mode
- 코어JS
- Escape Hatches
- 비동기 프로그래밍
- 모듈
- REACT
- rest api
- Today
- Total
목록Deep Dive (24)
코딩을 쉽게 해보자
크롬, 사파리, 파이어폭스, 엣지와 같은 에버그린 브라우저의 ES6 지원율은 약 98%로 거의 대부분의 ES6 사양을 지원한다. 하지만 IE 11의 ES6 지원율은 약 11%다. 구형 브라우저에서 문제 없이 동작시키기 위한 개발 환경을 구축하는 것이 필요하다. 대부분의 프로젝트가 모듈을 사용하므로 모듈 로더도 필요하다. ES6 모듈(ESM)은 대부분의 모던 브라우저에서 사용할 수 있다. 하지만 다음과 같은 이유로 아직까지는 ESM보다는 별도의 모듈 로더를 사용하는 것이 일반적이다. IE를 포함한 구형 브라우저는 ESM 지원 X ESM을 사용하더라도 트랜스파일링이나 번들링이 필요한 것은 변함 X ESM이 아직 지원하지 않는 기능(bare import 등)이 있고 점차 해결되고는 있지만 아직 몇가지 이슈가 ..
1. 모듈의 일반적 의미 애플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드 조각 일반적으로 모듈은 기능을 기준으로 파일 단위를 분리한다. 이때 모듈이 성립하려면 모듈은 자신만의 파일 스코프(모듈 스코프)를 가질 수 있어야 한다. 모듈은 애플리케이션이나 다른 모듈에 의해 재사용되어야 의미가 있다. 따라서 모듈은 공개가 필요한 자산에 한정하여 명시적으로 선택적 공개가 가능하다. 이를 export라 한다. 모듈 사용자는 모듈이 공개(export)한 자산 중 일부 또는 전체를 선택해 자신의 스코프 내로 불러들여 재사용할 수 있다. 이를 import라 한다. 2. 자바스크립트와 모듈 모든 JS 파일은 하나의 전역을 공유한다. 따라서 분리된 JS 파일들의 전역 변수가 중복되는 등의 문제가 발생할 수 있다...
1. 에러 처리의 필요성 발생한 에러에 대해 대처하지 않고 방치하면 프로그램은 강제 종료된다. try ... catch 문을 사용해 발생한 에러에 적절하게 대응하면 프로그램이 강제 종료되지 않고 계속해서 코드를 실행시킬 수 있다. 직접적으로 에러를 발생하지는 않는 예외적인 상황이 발생할 수도 있다. 예외적인 상황에 적절하게 대응하지 않으면 에러로 이어질 가능성이 크다. 이에 따라 언제나 에러나 예외적인 상황이 발생할 수 있다는 것을 전제하고 이에 대응하는 코드를 작성하는 것이 중요하다. 2. try ... catch ... finally 문 반환하는 값을 if 문이나 단축 평가 또는 옵셔널 체이닝 연산자를 통해 확인해서 처리하는 방법 try ... catch ... finall 문 일반적으로 2번째 방법..
1. 제너레이터란? ES6에서 도입된 제너레이터는 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수다. 일반 함수와의 차이는 제너레이터 함수는 함수 호출자에게 함수 실행의 제어권을 양도할 수 있다. 제너레이터 함수는 함수 호출자의 함수의 상태를 주고받을 수 있다. 제너레이터 함수를 호출하면 제너레이터 객체를 반환한다. 2. 제너레이터 함수의 정의 function* 키워드로 선언 하나 이상의 yield 표현식을 포함 이것을 제외하면 일반 함수를 정의하는 방법과 같다. // 제너레이터 함수 선언문 function* genDecFunc() { yield 1; } // 제너레이터 함수 표현식 const genExpFunc = function* () { yield 1; }; // 제너..