OUR + YOUR SPACE

promise javascript에서 제공하는 비동기를 간편하게 처리하는 Object 정해진 기능을 수행하고 나서 결과가 정상이라면 처리된 결과값을 반환 문제발생시 에러 반환 state:pending 기능 수행중 -> fulfilled 수행완료 or rejected 거절 Producer 해당 기능을 수행하고 나서 원하는 데이터를 만드는 과정 Consumer 원하는 데이터를 소비하는 과정 //Immediatly resolved const myPromise = Promise.resolve('Foo'); myPromise.then(console.log); //결과값 Foo 형식 new Pomise((resolve, reject) => { }) resolve: 기능을 정상적으로 수행하다 마지막에 ..

Set, Map, WeakSet, WeakMap Set 중복이 허용되지 않으며 순서를 보장하는 값들로만 이루어진 리스트 배열과 다르게 인덱스 개념이 없고 값으로 삭제하고 포함 여부를 확인 .add: 객체에 주어진 값을 갖는 새로운 요소를 추가 .delete: value와 관련된 요소를 제거 .clear: 객체에서 모든 요소를 제거 .has:객체 내 주어진 값을 갖는 요소가 있는지를 확인 후 boolean을 반환 let myArray = [11,22,33,44,55]; let mySet = new Set(myArray); mySet.add('100'); console.log(mySet); // 결과값 Set { 11, 22, 33, 44, 55, '100' } mySet.add..

New String & Number Methods startsWith() 어떤 문자열이 특정 문자로 시작하는지 확인하여 결과를 true 혹은 false로 반환 대소문자를 구분 구문 str.startsWith(searchString, position) searchString 문자열의 시작 지점에서 탐색할 문자열 position searchString을 탐색할 위치. 기본값 0. 반환 문자열이 검색 문자열로 시작하면 true, 아니면 false. var str = 'To be, or not to be, that is the question.'; console.log(str.startsWith('To be')); // true console.log(str.startsWith(&#3..

Template Literals 기존 문자열 표기법 "문자열", '문자열' ES6 에서는 template Literals 문자열 표기법 도입 ``(백틱)을 이용하는 표기법 `${변수명}` 형태로 표기 가능 `${함수명}` 형태로도 표기 가능 ES5 문자 + 문자 형태로 연결 console.log('Hello \n' + 'world'); //결과값 //Hello //world let str1 = 'hi!' let str2 = 'kang' console.log(str1 + ' this is template literal test. ' + str2); // 결과값 hi! this is template literal test...

Classes 출처 https://www.youtube.com/watch?v=_DLhUBWsRtw&t=59s [드림코딩 by 엘리] 클래스란? 클래스는 서로 연관이 있는 속성 과 메서드가 묶여있는것 간혹 method 가 없는 class 가 있을수 있는데 이런 클래스를 data class라고 함 javascript 는 ES6 부터 지원 class Person { name; //속성(field) age; //속성(field) speak(); //행동(method) } class 는 붕어빵을 만드는 틀 다른 말로 하면 다른말로는 아이언 맨을 만드는 설계도라고 이해하면 쉬움 object 와 class의 구별 class 선언class Person { name; //속성(field) age; //속성(field) ..

Arrow Function 출처: https://www.youtube.com/watch?v=e_lU39U-5bQ [드림코딩 by 엘리] 함수 표현식을 간격하게 표기하는 방법 보다 짧아진 함수 및 바인딩하지 않은 this. always anonymous 항상 익명함수를 이용함 // 매개변수가 없을 경우 () => { ... } // 매개변수가 한 개인 경우, 소괄호를 생략할 수 있다. x => { ... } // 매개변수가 여러 개인 경우, 소괄호를 생략할 수 없다. (x, y) => { ... } // 한 줄인 경우 x => { return x * x } x => x * x // 함수 몸체가 한줄의 구문이라면 중괄호 및 return 생략 가능 () => { return a; } // 여러 줄인 경우 ()..

let, const 변수의 기본은 생성하고 초기화하여 사용한다. 변수의 초기화 하거나 생성할때 let, const, var를 이용한다. 기존에는 var로 변수를 선언했으나 지금은 var 보다는 const, let으로 선언을 한다. 변수는 가변적이기 때문에 변할 수 있다. javascript 는 위에서 아래로 순차적으로 실행한다. let a = 111; let b = a -5 ; console.log(b); # 결과값: 106 a = 6; console.log(b, a); # 결과값: 106, 6 var를 쓰지 않는 이유 let,const는 Block scope 이지만 var는 그렇지가 않다. Block scope 이란 코드를 블럭 안에 작성을 하면 블럭 밖에서는 블럭안을 볼 수가 없게 됨에 따라 코드의 ..

Babel 을 이용한 ES6 변환 1. node.js 설치 2. package.json 생성 npm init 실행 PS D:\study\es6> npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to guess sensible defaults. See `npm help json` for definitive documentation on these fields and exactly what they do. Use `npm install ` afterwards to install a package and save it as a dependen..

ES6 기본적 개요 ES6은 2009 년에 ES5가 표준화 된 이후 처음으로 업데이트된 버전 많은 변화가 이뤄졌으며 매우 중요한 업데이트로 여겨짐 ES6 = ES2015 특징 ES5의 일부 문제를 해결 이전 버전과의 호환성 제공 현대적인 구문 확장성 제공에 따른 대규모 어플리케이션 제작에 적합 표준 라이브러리의 새로운 기능 제공 최신의 Chrome 및 Firefox에서는 모든 기능을 사용가능하나 일부 브라우저에서는 사용 불가능 그래서 ES6 코드를 ES5 로 변환해주는 Compiler를 이용해야함 babel, traceur, closure