{"componentChunkName":"component---src-templates-tags-js","path":"/tags/es-6/","result":{"data":{"site":{"siteMetadata":{"title":"Bottlehs Tech Blog"}},"allMarkdownRemark":{"totalCount":12,"nodes":[{"excerpt":"ES6 Map & Set Map과 Set은 Java와 같은 다른 프로그래밍 언어에서도 자주 사용하는 데이터 구조이다. Map은 키와 값으로 이루어진 데이터 구조이고, Set…","fields":{"slug":"/javascript/es6-map-set/"},"frontmatter":{"date":"2020년 12월 13일","title":"ES6 Map & Set","description":"Map과 Set은 Java와 같은 다른 프로그래밍 언어에서도 자주 사용하는 데이터 구조이다. Map은 키와 값으로 이루어진 데이터 구조이고, Set은 중복 없는 키-값으로 이루어진다. 기존 자바스크립트에서는 배열과 객체로 해당 기능을 구현할 수 있었지만, 입력값의 목록이나 특정값 찾기를 수행하기 위해서는 별도의 과정이 필요하다."}},{"excerpt":"ES6 객체 표현식 ES6에서는 더욱 동적이고 간단하게 객체를 생성하고 할당하는 표현식을 제공한다. 만약, 객체의 속성을 변수명과 같은 속성명으로 설정하려면 이를 간단하게 표현할 수 있다. 예를 들어, 아래 코드1과 같은 객체가 있다면, 코드…","fields":{"slug":"/javascript/es6-객체-표현식/"},"frontmatter":{"date":"2020년 12월 13일","title":"ES6 객체 표현식","description":"ES6에서는 더욱 동적이고 간단하게 객체를 생성하고 할당하는 표현식을 제공한다. 만약, 객체의 속성을 변수명과 같은 속성명으로 설정하려면 이를 간단하게 표현할 수 있다."}},{"excerpt":"ES6 임포트(import)와 익스포트(export) 모듈 모듈 프로그래밍은 각 프로그램 파일을 모듈 단위로 분리하여, 이를 구조화할 수 있는 장점이 있다. ES…","fields":{"slug":"/javascript/es6-임포트-import-와-익스포트-export-모듈/"},"frontmatter":{"date":"2020년 12월 10일","title":"ES6 임포트(import)와 익스포트(export) 모듈","description":"모듈 프로그래밍은 각 프로그램 파일을 모듈 단위로 분리하여, 이를 구조화할 수 있는 장점이 있다. ES5 이전의 자바스크립트는 모듈을 지원하지 않았기에 다양한 방식을 사용해 이를 구현해왔다. ES6부터 import, export 구문을 활용하면, 한 모듈이 특정 변수를 익스포트(export)하고 다른 모듈이 이를 임포트(import)하여 계층 관계를 만들 수 있다."}},{"excerpt":"ES6 프라미스(Promise) 프라미스(Promise)는 비동기 호출이 일어났을 때 또는 해당 테스크가 완료했을 때, 이를 처리할 함수나 에러를 처리할 함수를 설정하는 모듈이다. 특히, 비동기 처리가 많이 일어나는 XMLHttpRequest…","fields":{"slug":"/javascript/es6-프라미스-promise/"},"frontmatter":{"date":"2020년 12월 7일","title":"ES6 프라미스(Promise)","description":"프라미스(Promise)는 비동기 호출이 일어났을 때 또는 해당 테스크가 완료했을 때, 이를 처리할 함수나 에러를 처리할 함수를 설정하는 모듈이다. 특히, 비동기 처리가 많이 일어나는 XMLHttpRequest 처리에 주로 사용되며, 반환값이 연계적으로 처리가 가능하기에 순차적인 호출을 보장한다."}},{"excerpt":"ES6 For ... Of 루프 기존 자바스크립트에서는 for, for..in 루프만 사용할 수 있었는데, for..of는 iterator 형태로 순환할 수 있는 기능을 제공한다. iterator…","fields":{"slug":"/javascript/es6-for-of-루프/"},"frontmatter":{"date":"2020년 11월 24일","title":"ES6 For ... Of 루프","description":"기존 자바스크립트에서는 for, for..in 루프만 사용할 수 있었는데, for..of는 iterator 형태로 순환할 수 있는 기능을 제공한다. iterator는 어떤 데이터 집합을 순서대로 접근할 때 사용된다. for..of 는 Symbol.iterator를 호출 하는데 배열과 문자열은 이 속성을 제공하고 있다. 즉, 배열을 순서대로 순회하며, 문자열은 문자를 하나씩 접근하게 된다. 또한, 사용자 정의 iterator을 커스텀 객체에 만들 수도 있다."}},{"excerpt":"ES6 Spread & Rest 연산자 ES6부터 가변 인자를 표현할  키워드가 추가 되었다. 기존에는 배열 값을 함수 임자로 넘기려면  내장 메서드나  를 통해 변수를 받아서, 이를 Array.prorotype.slice…","fields":{"slug":"/javascript/es6-spread-rest-연산자/"},"frontmatter":{"date":"2020년 11월 19일","title":"ES6 Spread & Rest 연산자","description":"ES6부터 가변 인자를 표현할 '...' 키워드가 추가 되었다. 기존에는 배열 값을 함수 임자로 넘기려면 apply() 내장 메서드나 argments 를 통해 변수를 받아서, 이를 Array.prorotype.slice() 함수로 잘라내야 했지만 '...' 키워드를 이용하면 여러 개의 인자를 넘길 수 있다. 이는 Spread 연산자라고 한다."}},{"excerpt":"ES6 디스트럭처링(Destructuring) 디스트럭처링(Destructuring)은 Object 객체를 개별 변수에 할당하는 것을 말한다. 이를 이용하면, JSON…","fields":{"slug":"/javascript/es6-디스트럭처링-destructuring/"},"frontmatter":{"date":"2020년 11월 18일","title":"ES6 디스트럭처링(Destructuring)","description":"디스트럭처링(Destructuring)은 Object 객체를 개별 변수에 할당하는 것을 말한다. 이를 이용하면, JSON 형태의 객체를 쉽게 매핑하여 변수에 할당할 수 있고, 반환값도 여러 개를 설정할 수 있다."}},{"excerpt":"ES6 템플릿 문자열 (template string) 템플릿 문자열(Template String…","fields":{"slug":"/javascript/es6-템플릿-문자열-template-string/"},"frontmatter":{"date":"2020년 11월 17일","title":"ES6 템플릿 문자열 (template string)","description":"템플릿 문자열(Template String)은 문자열을 생성하는 새롭게 도입된 리터럴이다. 문자열을 설정하기 위해 따옴표(`)를 이용한다. 기존에는 변수를 문자열 안에 삽입하기 위해 따옴표 사이에 그 변수를 넣어 합치는 작업이 필요했는데, 템플릿문자열을 이용하면 이를 간단하게 만들 수 있다."}},{"excerpt":"ES6 클래스 (Class) 기존에는 객체지향을 구현하려고 할 때 function을 사용하여 구현 했다. ES6에서는 class 키워드를 사용하여 객체지향을 구현 할수 있다. 기존에는 아래와 같이 객체지향을 구현 했다. new…","fields":{"slug":"/javascript/es6-클래스-class/"},"frontmatter":{"date":"2020년 11월 5일","title":"ES6 클래스 (Class)","description":"기존에는 객체지향을 구현하려고 할 때 function을 사용하여 구현 했다. ES6에서는 class 키워드를 사용하여 객체지향을 구현 할수 있다. ES6 클래스는 생성자와 상속을 더욱 간단하고 명확한 구문으로 다룰 수 있게 한다. 클래스 자신도 함수이며, 생성자를 가지고 함수를 생성하는 새로운 구문이다."}},{"excerpt":"ES6 화살표 함수 (arrow function expression) ES6에서는 익명함수를 표현하기 위해 화살표 함수(Arrow function) 표현식을 지원한다.\n기존에는 아래와 같이 함수를 선언 하였다. 위와 같은 함수를 ES…","fields":{"slug":"/javascript/es6-화살표-함수-arrow-function/"},"frontmatter":{"date":"2020년 10월 21일","title":"ES6 화살표 함수 (arrow function expression)","description":"ES6에서는 익명함수를 표현하기 위해 화살표 함수 (Arrow function) 표현식을 지원한다."}},{"excerpt":"ES6 let & cont 기존에는 var 키워드로 변수와 상수를 모두 정의 하였지만 ES6에서는 변수와 상수를 구분할수 있는 let 과 const 가 추가 되었다. let let…","fields":{"slug":"/javascript/es6-let-cont/"},"frontmatter":{"date":"2020년 10월 11일","title":"ES6 let & cont","description":"let, const 는 ES6 에 추가 되었다. let,const는 변수(let)와 상수(const)를 구분 하여 정의할때 사용 된다."}},{"excerpt":"2009년에 발표된 ES(ECMAScript 5)는 웹 어플리케이션 부터 소셜게임 까지 다양한 곳에서 활용이 되었다. 그 이후, 기존에 자바스크립트의 여러 문제점을 해결하고 개선한 ES6(ECMAScript 2015)이 201…","fields":{"slug":"/javascript/es6-vs-es5/"},"frontmatter":{"date":"2020년 10월 9일","title":"ES6 vs ES5","description":"기존 자바스크립트의 여러 문제점을 해결하고 개선한 ES6 (ECMA6) 에 대해 알아 본다"}}]}},"pageContext":{"tag":"ES6"}},"staticQueryHashes":["213619243","3262363727"]}