본문 바로가기

javascript12

자바스크립트 ES6 개발 환경 - 걸프(gulp), 바벨(babel) / macOS 10.15 자바스크립트 ES5는 현재 최신 브라우저라면 거의 모든 기능을 지원하고 있습니다. 하지만 ES6 제대로 지원하는 브라우저는 많지 않습니다. 아래는 kangax의 github페이지에서 브라우저별 es6문법 호환 비교표입니다. 많은 브라우저들이 ES6 문법을 일부 지원하고 있는 것을 볼 수 있지만 아직까지 완벽하게 지원되지 않는 것 같습니다. 때문에 ES6를 선택하고 개발하고자 한다면 트랜스컴파일이라는 작업을 해줘야 합니다. ES6코드를 ES5로 말이죠. 이번 글에서는 그중에서도 babel과 gulp라는 툴의 사용법을 간단히 적어보려 합니다. Gulp (걸프): 반복적인 개발 작업을 자동화하는 빌드 도구 babel(바벨): ES6코드를 ES5코드로 변환해주는 트랜스컴파일러 그전에 우선 npm부터 설치 하여야.. 2020. 3. 22.
Javascript ES6 문법 - 변수 선언 var, let, const 차이 ES6 이전의 Javascript에서는 var키워드가 변수 선언방법의 유일한 방법이였습니다. 하지만 ES6에서는 var, let, const라는 키워드를 통해 변수를 선언 할 수 있습니다. ES6에서 var로 변수 선언하기 ES6에서 var로 변수를 선언하면 재 할당과 재 선언이 가능해집니다. var 변수의 유효 범위는 전역범위에서는 전역적으로 유효하며, 함수 안에서는 해당 함수에서만 유효합니다. 하지만 이러한 특성은 혼동을 주며 버그의 원인이 되기도 합니다. var변수의 선언은 코드가 실행되기 전에 처리되므로 어느 곳에서 선언을 하던 맨위에서 선언 하는 것과 같은 효과를 나타냅니다. 이러한 동작을 'Hoisting'이라 부릅니다. var x = 1; function faaa(){ var x = 5; c.. 2020. 3. 13.
ECMAScript 6 알아보기 ES6 ECMAScript 6? ECMAScript 6는 ES6라고 흔히 알려져 있으며 ECMAScript 2015라고도 불립니다. ECMAScript 2015 Edition이라고 하죠. 그렇다는 이야기는 2016버전도 있고 2017버전도 있고.. ES6, ES7 .. 계속 있다는 이야기 입니다. 하지만 현재 ES6 스팩도 제대로 구현된 웹브라우저는 없다고 하네요. 보통 ES5를 호환 하고 있습니다. ES6에는 다양한 기능들이 추가 되었는데요. 상수, let 키워드, 화살표 함수, Templte literals등 좀 더 복잡해진 애플리케이션을 만드는데 유용한 기능들이 추가 되었습니다. https://www.taniarascia.com/es6-syntax-and-feature-overview/ ES6 Syntax.. 2020. 3. 11.