태그: ES6

바벨(Babel 7) 기본 사용법

개발자들이 실행 환경에 구애받지 않고 항상 최신 문법의 자바스크립트로 코딩할 수 있도록 도와주는 유용한 도구인 바벨(Babel)에 대해서 알아보겠습니다. 자바스크트 개발자의 딜레마자바스크립트 언어의 문법은 빠르게 진화하고 있지만 정작 자바스크립트 코드를 실행해주는 환경은 이를 받쳐주지 못하는 경우가 많습니다.예를 들어, 브라우저의 경우 종류가 워낙 다양해서

[자바스크립트] 비동기 처리 2부 - Promise

많은 분들이 자바스크립트 공부를 하시다가 프라미스(Promise)에 때문에 그만 두시곤 합니다.이번 포스트에서는 자바스크립트에서 비동기 처리를 위해 굉범위하게 사용되는 Promise에 대해서 알아보겠습니다. 콜백 함수를 통한 비동기 처리의 문제점ES6에서 Promise가 도입되어 지금처럼 널리 사용되기 이전에는 주로 콜백 함수를 다른 함수의 인자로 넘겨서

NodeJS로 ES6 코드 실행하기

ES6(ES2105) 이상의 최신 자바스크립트 문법으로 작성된 코드가 노드JS(NodeJS)에서 실행이 안 되는 경우가 종종있습니다. 이럴 경우 어쩔 수 없이 예전 자바스크립트 문법으로 코드를 재작성하기도 하는데요. 이번 포스트에서는 자바스크립트 Transpiler인 Babel을 이용하여 이 문제를 해결해보겠습니다. NodeJS에서 ES6 코드 실행 오류먼

자바스크립트 ES6 모듈 내보내기/불러오기 (import)

자바스크립트 개발을 하다보면 require나 import 키워드를 통해 외부 라이브러리를 불러오는 코드를 자주 보게 됩니다. require는 NodeJS에서 사용되고 있는 CommonJS 키워드이고, import는 ES6(ES2015)에서 새롭게 도입된 키워드입니다. 두 개의 키워드 모두 하나의 파일에서 다른 파일의 코드를 불러온다는 동일한 목적을 가지고

[ES2015] 기본 매개변수 (Default Parameters)

ES2015는 자바스크립트의 근간이 되는 함수에도 여러가지 변화를 가져왔습니다.이번 포스트에서는 그 중 기본 매개변수(Default Parameters)에 대해서 알아보도록 하겠습니다. 매개변수를 무시한 함수 호출다음과 같이 사용자의 아이디의 배열을 매개변수를 받아서 사용자의 상세 정보를 돌려주는 함수가 있다고 가정해봅시다. 1234function fi

[ES2015] const로 상수 선언하기

이번 포스트에서는 ES2015에서 let과 함께 자바스크립트에 추가된 const 사용법에 대해서 알아보도록 하겠습니다. let 사용법에 대해서는 아래 포스트들을 참고바라겠습니다. let으로 변수 선언하기 1 let으로 변수 선언하기 2 매직 넘버아래 코드에서 findUser 함수는 안자로 받은 id 값이 100보다 작은지 여부에 따라서 로직이 분기되어

[ES2015] let으로 변수 선언하기 2

이전 포스트에서 ES2015의 let 키워드에서 대해서 알아보았습니다.이번 포스트에서는 for 문에서 let이 어떻게 사용될 수 있는지 살펴보겠습니다. 예제 코드다음 코드는 사용자 아이디를 받아 가짜 사용자를 담든 후 콜백 함수를 호출하는 비동기 함수입니다.마치 DB 연동처럼 setTimeout 함수를 이용하여 1초의 지연을 주었습니다. 12345funct

[ES2015] let으로 변수 선언하기 1

본 포스트에서는 ES2015를 통해 자바스크립트에 추가된 let 키워드에 대해서 알아보도록 하겠습니다. 문제의 코드먼저 다음 예제 코드를 살펴보시죠. 1234567891011function findUser(id) { if (id > 0) { var successMsg = "사용자를 조회하였습니다."; console.log