FrontEnd
-
03. 화살표 함수(Arrow Function)FrontEnd/ES6 2021. 9. 4. 10:40
화살표 함수(Arrow Function)는 함수를 정의할 때 function 키워드를 사용하지 않고 =>로 대체하는 것입니다. 흔히 콜백 함수의 문법을 간결화할 때 사용합니다. ES5 ES6 var sum = function(a, b) { return a + b; }; var sum = (a, b) => { return a + b; } var arr = ["a", "b", "c"]; arr.forEach(function(value) { console.log(value); // a, b, c }); arr.forEach(value => console.log(value));
-
02. const & letFrontEnd/ES6 2021. 9. 4. 10:35
const & let은 새로운 변수 선언 방식입니다. ES5는 Hoisting으로 인해 변수의 유효범위(Scope)가 {}에 상관 없이 설정되지만, ES6는 {} 단위로 변수의 유효범위(Scope)가 설정됩니다. 1. const const는 한번 선언한 값에 대해서 변경할 수 없는 상수입니다. 하지만, 객체나 배열의 내부는 변경할 수 있습니다. 아래 코드의 obj 객체의 num이란 속성 추가가 가능하며, arr 배열에 요소를 추가(push)하거나 빼낼(pop) 수 있습니다. 2. let let은 값 변경이 가능한 변수입니다. 다만, 한번 선언한 값에 대해서 다시 선언할 수 없습니다. 3. ES5 Hoisting Hoisting(끌어 올리기)이란 js해석기가 코드의 라인 순서와 관계 없이 함수선언식과 변수..
-
01. ECMAScript 6(ES6)FrontEnd/ES6 2021. 9. 4. 08:45
1. ECMAScript ECMAScript는 ECMA International에 의해 제정된 ECMA-262 기술 규격에 의해 정의된 표준화된 스크립트 프로그래밍 언어입니다. ECMAScript는 스크립트 언어가 준수해야 하는 규칙, 세부 사항 및 지침을 제공합니다. [전문] 2. JavaScript ECMAScript 사양을 준수하는 범용 스크립트 프로그래밍 언어. 3. ECMAScript 6(ES6) ECMA-262 표준의 제 6판이며, ES5(2009년) 이후 2015년에 첫 메이저 업데이트가 승인되었습니다. 그러므로 ES6, ES2015, ECMAScript 2015는 동의어입니다. ES5에 비해 문법이 간결해졌으며 최신 Front End Framework인 React, Angular, Vue에..
-
WebpackFrontEnd/Webpack 2021. 8. 16. 20:21
1. NPM(Node Package Manager) > NPM은 자바스크립트 프로그래밍 언어를 위한 패키지 관리자로 명령어로 자바스크립트 라이브러리를 설치하고 관리할 수 있다. NPM은 Node.js를 설치하면 같이 설치된다. > Node.js는 내장 HTTP 서버 라이브러리를 포함하고 있어 웹 서버에서 아파치 등의 별도 소프트웨어 없이 자바스크립트를 실행할 수 소프트웨어 플랫폼이다. > NPM 장점 1) package.json을 통해 라이브러리와 의존성을 관리한다. 2) 라이브러리를 편리하게 설치할 수 있다. 명령어 내용 node -v npm -v node 버전 확인 npm 버전 확인 > 실행이 안될 경우 Select Default Shell 변경 npm init -y 초기화(기본값으로 package...