ES6

ES6에 도입된 스프레드 문법 ... 은 하나로 뭉쳐있는 여러 값들의 집합을 펼처서 개별적인 값들의 목록으로 만든다. 스프레드 문법은 Array, String, Map, Set, DOM 컬렉션, arguments와 같이 for...of 문으로 순회할 수 있는 이터러블에 한정된다.// ...[1, 2, 3]은 [1, 2, 3]을 개별 요소로 분리한다(→ 1, 2, 3)console.log(...[1, 2, 3]); // 1 2 3// 문자열은 이터러블이다.console.log(...'Hello'); // H e l l o// Map과 Set은 이터러블이다.console.log(...new Map([['a', '1'], ['b', '2']])); // [ 'a', '1' ] [ 'b', '2' ]consol..
심벌이란?심벌은 ES6에 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이며, 다른 값과 중복되지 않는 유일무이한 값이므로 주로 이름 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용한다. 심벌 값의 생성Symbol 함수심벌 값은 Symbol 함수를 호출해 생성한다. 이때 생성된 심벌 값은 외부로 노출되지 않아 확인할 수 없으며, 다른 값과 절대 중복되지 않는 유일무이한 값이다.// Symbol 함수를 호출하여 유일무이한 심벌 값을 생성한다.const mySymbol = Symbol();console.log(typeof mySymbol); // symbol// 심벌 값은 외부로 노출되지 않아 확인할 수 없다.console.log(mySymbol); // Symbol() 심..
1. 함수의 구분ES6 이전까지 JS의 함수는 구분없이 다양한 목적으로 사용되었다. 일반적인 함수, new 연산자와 함께 생성자 함수, 객체에 바인딩되어 메서드로 호출할 수 있다. 이러한 사용법은 편리해 보이지만 실수를 유발할 수 있으며 성능적으로도 손해였다.var foo = function () { return 1;};// 일반적인 함수로서 호출foo(); // -> 1// 생성자 함수로서 호출new foo(); // -> foo {}// 메서드로서 호출var obj = { foo: foo };obj.foo(); // -> 1 ES6 이전의 모든 함수는 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있다. // 프로퍼티 f에 바인딩된 함수는 callable이며 constructo..
자바스크립트를 이용할 때 전역변수를 꼭 사용해야 하는 이유가 없다면 지역변수를 사용해야 한다. 왜 그런지는 이번 글에서 알아보자. 1 - 변수의 생명 주기 변수는 선언에 의해 생성되고 할당을 통해 값을 갖게된다. 그리고 생성이 되었으면 소멸하게 되는데 이를 생명 주기(Life cycle)를 갖는다고 한다. 변수에 생명 주기가 없다면 한번 선언된 변수는 프로그램이 종료되기 전까지 메모리 공간을 차지하게된다. 1-1. 지역 변수의 생명주기 변수는 선언된 위치에서 생성되고 소멸한다. 이를 봤을 때 전역 변수의 생명주기는 애플리케이션의 생명주기와 같다는 것을 알 수 있다. 하지만, 함수 내부(지역)에서 선언된 변수는 함수의 호출에는 생성되고 종료되면 소멸한다. function foo () { var x = "l..
모듈 module 이란? 모듈은 여러기능들에 관한 코드가 모여있는 하나의 파일로 다음과 같은 것들을 위해 사용한다. 유지 보수성 기능들이 모듈화가 잘 되어있다면, 의존성을 그만큼 줄일수 있기 때문에 어떤 기능을 개선한다던가 수정할 때 훨씬 편하게 할 수 있다. 네임스페이스화 JS에서 전역 변수는 전역 공간을 갖기에 코드가 만을수록 곂치는 네임스페이스가 많아질 수 있다. 그러나 모듈로 분리하면 모듈만의 네임 스페이스를 갖기에 문제가 해결된다. 재사용성 똑같은 코드를 반복하지 않고 모듈로 분리시켜 필요할 때마다 사용가능하다. CommonJS JS 공식 스펙이 브라우저만 지원했기에 SSR 및 데스크탑 어플리케이션을 지원하기위해 범용적인 언어로 쓰이기 위한 스펙을 모듈방식으로 정의한 것이 CommonJS 방식의..
58청춘
'ES6' 태그의 글 목록