├── .gitignore ├── CH00.들어가며 ├── 24.ES6-compiler.html ├── 27.기본사용법.html ├── QnA.md └── 보충설명.md ├── CH01.문법맛보기 ├── 32.let 키워드.html ├── 37.const 키워드.html ├── 39.피라미터 기본값.html ├── 40.펼침 연산자(spread operator).html ├── 43.나머지 파라미터(rest parameter).html ├── 44.해체할당(destructuring assignment).html ├── 49.화살표 함수(arrow function).html ├── 51.강화된 객체 리터럴.html └── 보충설명.md ├── CH02.라이브러리 ├── 56.숫자.html ├── 62.수학연산.html ├── 65.문자열.html ├── 71.템플릿 문자열.html ├── 74.배열.html ├── 79.콜렉션(Collection).html ├── 86.객체.html ├── 보충설명(Collection).md ├── 보충설명(Number).md ├── 보충설명(Object).md └── 보충설명(String).md ├── CH03.이터레이터 ├── 104.꼬리 호출 최적화(tail call optimization).html ├── 92.ES6 심볼.html ├── 96.이터레이션 규약(iteration protocol).html ├── 98.제너레이터(generator).html └── 보충설명.md ├── CH04.비동기 프로그래밍 ├── 111.비동기 코드 작성.html ├── 114.비동기 코드 작성#콜백을 포함한 비동기 코드.html ├── 116.구원자, 프라미스#1.html ├── 127.구원자, 프라미스#2.html ├── 131.프라미스 기반의 자바스크립트 API.html ├── README.md ├── data.json ├── data_serv.js └── 보충설명.md ├── CH05.리플렉트 API 구현 ├── 136.Reflect 객체.html └── 보충설명.md ├── CH06.프록시 ├── 150.프록시.html └── 보충설명.md ├── CH07.클래스 답사 ├── 168.객체 지향 자바스크립트.html ├── 176.클래스 정의.html ├── 178.프로토타입 메소드.html ├── 182.정적메소드.html ├── 183.클래스의 상속 구현.html ├── 185.조합 메소드명.html └── 186.프로퍼티 속성.html ├── CH08.모듈러 프로그래밍 ├── 195.html ├── 196-AMD │ ├── index.html │ └── math.js ├── 197-CommonJS │ ├── index.js │ └── math.js ├── 198-만능모듈정의 │ ├── index.html │ ├── index.js │ └── math.js ├── 204-종합예제 │ ├── .babelrc │ ├── README.md │ ├── index.js │ ├── math.js │ ├── math_modules │ │ ├── logarithm.js │ │ └── trigonometry.js │ └── package.json ├── Dictionary.md ├── extend │ ├── app.js │ ├── foobar.js │ └── 기존사용법 │ │ ├── app.js │ │ └── foobar.js └── 보충설명.md └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | # https://git-scm.com/docs/gitignore 2 | # https://help.github.com/articles/ignoring-files 3 | # Example .gitignore files: https://github.com/github/gitignore 4 | /bower_components/ 5 | /node_modules/ 6 | node_modules -------------------------------------------------------------------------------- /CH00.들어가며/24.ES6-compiler.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /CH00.들어가며/27.기본사용법.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Learning ECMAScript 6 6 | 7 | 8 | 9 | 10 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /CH00.들어가며/QnA.md: -------------------------------------------------------------------------------- 1 | 1. `script type="module"` 은 왜 써야 하나요? 2 | 3 | bootstrap.js 의 System.loadScriptTypeModule()에서 `type="module"` 부분을 로드합니다. 4 | `type="module"` 을 쓰지 않으면 소스가 transpiling 되지 않습니다. (브라우져의 환경으로 구동됩니다.) 5 | 6 | -------------------------------------------------------------------------------- /CH00.들어가며/보충설명.md: -------------------------------------------------------------------------------- 1 | ## ES6 구동 환경 2 | 3 | ### ES6 지원 여부 확인 4 | 5 | [compatibility table](http://kangax.github.io/compat-table/es6/) 항목을 참고하세요. 6 | 7 |   8 | 9 | ### 폴리필(polyfill)과 트랜스파일러(transpiler) 10 | 11 | #### 폴리필(polyfill) 12 | 13 | 비호환 엔진에 없는 기능의 지원을 위해 삽입하는 소스코드나 플러그인 등을 말합니다. 14 | 15 | [폴리필목록](https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills#ecmascript-6-harmony)은 여기서 확인 가능합니다. 16 | 17 | ``` 18 | 21 | ``` 22 | 23 | html5shiv 의 경우 위와같이 간단히 설정이 가능합니다. 24 | 25 |   26 | 27 | #### 트랜스파일러(Transpiler) 28 | 29 | ES6가 동작하지 않는 환경에서 ES6(이상)의 소스가 동작하도록 ES6 소스코드를 ES5 소스코드로 변환 합니다. 주의 할점은 모든 ES6 소스코드가 동작하는 것은 아니라는 점입니다. 30 | 31 | 트랜스파일링(Transpiling)과 컴파일(Compile)이 다른 점은 컴파일은 다른 언어로 변경이 되는 것이며 트랜스파일링은 비슷한 수준의 추상화를 가진 언어로 변환하는 방법입니다. 32 | 33 | 지원목록과 사용방법은 [Transpiling ES6](https://css-tricks.com/transpiling-es6/)항목을 참고하세요. 34 | 35 | 참고 : [COMPILING VS TRANSPILING](https://www.stevefenton.co.uk/2012/11/compiling-vs-transpiling/) -------------------------------------------------------------------------------- /CH01.문법맛보기/32.let 키워드.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | let 키워드 6 | 7 | 8 |

let 키워드

9 | 10 | 11 | 12 | 13 | 14 | 15 | 102 | 103 | 104 | -------------------------------------------------------------------------------- /CH01.문법맛보기/37.const 키워드.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | const 키워드 5 | 6 | 7 |

const 키워드

8 | 9 | 10 | 11 | 12 | 13 | 14 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /CH01.문법맛보기/39.피라미터 기본값.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 파라미터 기본값 6 | 7 | 8 |

파라미터 기본값

9 | 10 | 11 | 12 | 13 | 14 | 15 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /CH01.문법맛보기/40.펼침 연산자(spread operator).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 펼침 연산자(spread operator) 6 | 7 | 8 |

펼침 연산자(spread operator)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /CH01.문법맛보기/43.나머지 파라미터(rest parameter).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 나머지 파리미터(rest parameter) 6 | 7 | 8 |

나머지 파리미터(rest parameter)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /CH01.문법맛보기/44.해체할당(destructuring assignment).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 해체할당(destructuring assignment) 6 | 7 | 8 |

해체할당(destructuring assignment)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 125 | 126 | 127 | -------------------------------------------------------------------------------- /CH01.문법맛보기/49.화살표 함수(arrow function).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 화살표 함수(arrow function) 6 | 7 | 8 |

화살표 함수(arrow function)

9 | 10 | 11 | 12 | 13 | 14 | 36 | 37 | 62 | 63 | 64 | -------------------------------------------------------------------------------- /CH01.문법맛보기/51.강화된 객체 리터럴.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 강화된 객체 리터럴 6 | 7 | 8 |

강화된 객체 리터럴

9 | 10 | 11 | 12 | 13 | 14 | 15 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /CH01.문법맛보기/보충설명.md: -------------------------------------------------------------------------------- 1 | 50페이지 - 화살표 함수 에서의 this 값 2 | 3 | type="module" 을 제거 하고 실행해야 함 4 | 기본 this는 Window 객체 5 | 6 | 객체 리터럴 에서의 this 7 | 8 | var object = { 9 | f1: function() { 10 | console.log(this); // f1 11 | var f2 = function() { console.log(this); } 12 | f2(); 13 | setTimeout(f2, 1000); 14 | } 15 | } 16 | object.f1(); 17 | 18 | 19 | Object // f1 20 | Window // 프로퍼티가 아니므로 Window 객체 21 | Window // 프로퍼티가 아니므로 Window 객체 22 | 23 | 24 | 25 | 화살표 함수 에서의 this 26 | 27 | var object = { 28 | f1: () => { 29 | console.log(this); 30 | var f2 = () => { console.log(this); } 31 | f2(); 32 | setTimeout(f2, 1000); 33 | } 34 | } 35 | object.f1(); 36 | 37 | 객체 리터럴로 저장하면 전역 스코프를 가르킨다.(Window) 38 | 39 | Window 40 | Window 41 | Window -------------------------------------------------------------------------------- /CH02.라이브러리/56.숫자.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 숫자 6 | 7 | 8 |

숫자

9 | 10 | 11 | 12 | 13 | 14 | 15 | 88 | 89 | 90 | -------------------------------------------------------------------------------- /CH02.라이브러리/62.수학연산.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 수학연산 6 | 7 | 8 |

수학연산

9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 64 | 65 | 66 | -------------------------------------------------------------------------------- /CH02.라이브러리/65.문자열.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 문자열 6 | 7 | 8 |

문자열

9 | 10 | 11 | 12 | 13 | 14 | 15 | 86 | 87 | 88 | -------------------------------------------------------------------------------- /CH02.라이브러리/71.템플릿 문자열.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 템플릿 문자열 6 | 7 | 8 |

템플릿 문자열

9 | 10 | 11 | 12 | 13 | 14 | 15 | 83 | 84 | 85 | -------------------------------------------------------------------------------- /CH02.라이브러리/74.배열.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 배열 6 | 7 | 8 |

배열

9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 105 | 106 | 107 | 108 | 109 | 110 | -------------------------------------------------------------------------------- /CH02.라이브러리/79.콜렉션(Collection).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 콜렉션(Collection) 6 | 7 | 8 |

콜렉션(Collection)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 97 | 98 | 99 | 100 | -------------------------------------------------------------------------------- /CH02.라이브러리/86.객체.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 객체 6 | 7 | 8 |

객체

9 | 10 | 11 | 12 | 13 | 14 | 15 | 66 | 67 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /CH02.라이브러리/보충설명(Collection).md: -------------------------------------------------------------------------------- 1 | iterable 2 | 멤버를 차례로 반환 할 수 있는 객체 3 | 4 | 5 | 6 | // 배열버퍼 (ArrayBuffer) 7 | let buffer = new ArrayBuffer(80); // 80바이트 640비트 8 | let view = new DataView(buffer); 9 | view.setInt32(8, 22, false); // 저장바이트, 저장 할 수, endian 플래그(false 는 big endian) 10 | var number = view.getInt32(8, false); 11 | console.log(number); // 22 12 | 13 | 14 | 15 | // 타입화 배열 (typed array) 16 | var buffer = new ArrayBuffer(80); // 80바이트 640비트 17 | var typed_array = new Float64Array(buffer); 18 | typed_array[4] = 11; 19 | 20 | console.log(typed_array.length); // 64비트로 만들었기 때문에 10 21 | console.log(typed_array[4]); // 11 22 | 23 | 24 | 25 | // 세트 (set) 26 | let set = new Set("안녕하세요!!!"); // 뒤쪽 !! 는 삭제 27 | set.add(12); 28 | console.log(...set); // 안 녕 하 세 요 ! 12 29 | console.log(set.has("!")); // true 30 | console.log(set.size); // 7 31 | 32 | set.delete(12); // // 안 녕 하 세 요 ! 33 | console.log(...set); 34 | 35 | set.clear(); 36 | -------------------------------------------------------------------------------- /CH02.라이브러리/보충설명(Number).md: -------------------------------------------------------------------------------- 1 | ## ES6 - Number 2 | ECMA Script 6 길들이기 도서 스터디에서 설명이 부족했던 부분을 보충 설명합니다. 3 | 4 | #### Number.isSafeInteger(*number*) Method 5 | 6 | 기본적으로 자바스크립트의 숫자는 -(2^53 - 1) 부터 +(2^53-1) 숫자로 표현하면 -9007199254740991부터 9007199254740991 로 저장됩니다. (Safe Integer) 7 | 8 | Number.MAX_SAFE_INTEGER // 9007199254740991 9 | Math.pow(2, 53) - 1 // 9007199254740991 10 | 11 | Number.isSafeInteger(*number*) 메소드는 숫자들이 Safe Integer 범위내에 있는지 확인합니다. 12 | 13 | Number.MAX_SAFE_INTEGER + 1 === Number.MAX_SAFE_INTEGER + 2 // true 14 | 15 | 예제를 보면 둘다 Safe Intefer 범위를 벗어나기 때문에 true가 반환됩니다. 16 | 17 | console.log(Number.isSafeInteger(156)); // true 18 | console.log(Number.isSafeInteger('1212')); // false 19 | console.log(Number.isSafeInteger(Number.MAX_SAFE_INTEGER)); // true 20 | console.log(Number.isSafeInteger(Number.MAX_SAFE_INTEGER + 1)); // false 21 | console.log(Number.isSafeInteger(Number.MIN_SAFE_INTEGER)); // true 22 | console.log(Number.isSafeInteger(Number.MIN_SAFE_INTEGER - 1)); // false 23 | 결과로 확인하는게 가장 확실 하겠죠. 24 | 25 |   26 | 27 | #### Number.EPSILON Property 28 | 29 | 자바스크립트의 부동 소수점 연산은 0.1 같은 실수를 이진 부동 소수점(floating point) 방식으로 표현합니다. 30 | 31 | console.log(0.1 + 0.2 == 0.3); // false 32 | console.log(0.9 - 0.8 == 0.1); // false 33 | console.log(0.1 + 0.2); // 0.30000000000000004 34 | console.log(0.9 - 0.8); // 0.09999999999999998 35 | 0.1 + 0.2 == 0.3 이 false 입니다. 결과가 조금 당황스럽지 않으신가요? 36 | 자바스크립트에서는 0.1 + 0.2 연산은 0.3으로 저장되지 않고 0.30000000000000004 의 부동 소수점 형태로 저장됩니다. 37 | 이러한 오차 문제를 해결 하기 위해 자바스크립트에서는 에러 한계치(margin of error) 값을 저장하고 있습니다. 이 프로퍼티가 Number.EPSILON 입니다. 38 | 39 | console.log(Number.EPSILON); //2.220446049250313e-16 40 | 41 | Number.EPSILON은 2^-52 (2의 -52승) 의 아주 작은 숫자를 나타냅니다. 두 수의 차이(-)가 Number.EPSILON 보다 작다면 `같다`라고 판단 할 수 있습니다. 42 | 43 | console.log(0.1 + 0.2 == 0.3); // false 44 | console.log((0.1 + 0.2) - 0.3 < Number.EPSILON); // true 45 | 46 | 부동 소수점이나 반올림 문제에 관해 궁금하신 분들은 [부동소수점 타입 표현의 한계](http://dmrl.kangwon.ac.kr/lecture/1501/programming/Data/%EB%B6%80%EB%8F%99%EC%86%8C%EC%88%98%EC%A0%90_%ED%83%80%EC%9E%85_%ED%91%9C%ED%98%84_%ED%95%9C%EA%B3%84.html)를 참고하세요. 47 | 48 |   49 | 50 | ## 수학연산 51 | 52 | #### 삼각 연산 53 | console.log(Math.sinh(0)); // 하이퍼볼릭 사인값 54 | console.log(Math.cosh(0)); // 하이퍼볼릭 코사인 값 55 | console.log(Math.tanh(0)); // 하이퍼볼릭 탄젠트 값 56 | console.log(Math.asinh(0)); // 역 하이퍼볼릭 사인 값 57 | console.log(Math.acosh(1)); // 역 하이퍼볼릭 코사인 값 58 | console.log(Math.atanh(0)); // 역 하이퍼볼릭 탄젠트 값 59 | console.log(Math.hypot(2, 2, 1)); // 피타고라스 정리 60 | 61 | 하이퍼볼릭시리즈(hyperbolic)는 삼각함수에서 유추된 쌍곡선함수들 입니다. 62 | 63 | 하이퍼볼릭 시리즈의 자세한 내용은 [위키피디아의 하이퍼볼릭 사인](https://ko.wikipedia.org/wiki/%EC%8C%8D%EA%B3%A1%EC%84%A0%ED%95%A8%EC%88%98) 에서 확인하시기 바랍니다. 64 | 65 | 66 | 67 | #### 산술 연산 68 | 69 | console.log(Math.log2(16)) ; // 2를 밑으로한로그 70 | console.log(Math.log10(1000)); // 10을 밑으로한로그 71 | console.log(Math.log1p(0)); // log(1 + value) 와 동일 72 | console.log(Math.expm1(0)); // Math.log1p(0)의 역 73 | console.log(Math.cbrt(8)); // 세제곱근 값 74 | 75 | 로그함수에 대한 자세한 [로그 함수](https://namu.wiki/w/%EB%A1%9C%EA%B7%B8%ED%95%A8%EC%88%98)를 확인해주세요. 76 | 77 |   78 | 79 | #### Math.emul(*number1*, *number2*) Method 80 | 81 | 자바스크립트는 기본적으로 64비트 배열정밀도(double-precision) 정수형태로 숫자를 표현합니다. 82 | 83 | 32비트 곱셈을 사용하면 C언어의 32비트 연산 처럼 32비트 레지스터를 이용한 빠른 연산을 수행합니다. 84 | 자바스크립트에서 32비트 곱셈을 수행하는 방법으로는 유일 합니다. `32비트로 결과를 리턴합니다.` 85 | 86 | console.log(Math.imul(5, 3)); //32비트 정수 곱셈 87 | console.log(Math.imul(590, 5000000)); // 32비트 정수 곱셈 88 | console.log(590 * 5000000) // 기본 자바스크립트 부동 소수점 곱셈 89 | 90 | 기본적인 곱셈과 결과는 같지만 32비트를 넘는 결과 값이라면 하위 비트가 소실 됩니다. 91 | 92 | 15 93 | -1344967296 // 하위비트 소실 94 | 2950000000 95 | 96 | 참고 : [MDN](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Math/imul) 97 | 98 |   99 | 100 | #### Math.clz32(*number*) Method 101 | 102 | 인자를 32비트(이진수)로 변환한 후 값이 셋팅되지 않은 앞쪽 0비트의 수를 리턴합니다. 103 | (전치 제로 비트 : leading zero bit) 반환 104 | 105 | console.log(Math.clz32(7)); 106 | console.log(Math.clz32(1000)); 107 | console.log(Math.clz32(295000000)); 108 | 109 | 결과는 다음 과 같습니다. (22인 경우의 이진코드만 적어봐습니다.) 110 | 111 | 29 112 | 22 // 0000 0000 0000 0000 0000 0011 1110 1000 113 | 3 114 | -------------------------------------------------------------------------------- /CH02.라이브러리/보충설명(Object).md: -------------------------------------------------------------------------------- 1 | __proto__ 프로퍼티 2 | 3 | // ES5 이전 4 | var x = {x: 12}; 5 | var y = Object.create(x, {y: {value: 13}}); // value는 키워드 6 | 7 | console.log(y.x); 8 | console.log(y.y); 9 | 10 | // ES6 이후 11 | let a = {a: 12, __proto__: {b: 13}}; 12 | console.log(a.a); 13 | console.log(a.b); 14 | 15 | Enumerable : 해당 프로퍼티가 Enum으로서 사용될 수 있는가에 대한 여부를 지정한다. 16 | 17 | 18 | 19 | Object.assign(targetObj, sourceObjs...) 메소드 20 | 21 | let x = {x: 12}; 22 | let y = {y: 13, __proto__: x}; 23 | let z = {z: 14, b() {return 2;}, q: {}}; 24 | 25 | Object.defineProperty(z, "z", {enumerable: false}); 26 | 27 | let m = {}; 28 | 29 | Object.assign(m, y, z); // 소스의 setter, getter를 호출한다. 30 | 31 | console.log(m.y); 32 | console.log(m.z); // enumerable 이 false라 접근이 불가능하다. 33 | console.log(m.b); 34 | console.log(m.x); // undefined, [[prototype]] 프로퍼티는 복사하지 않는다. 35 | console.log(m.q == z.q); // true 36 | -------------------------------------------------------------------------------- /CH02.라이브러리/보충설명(String).md: -------------------------------------------------------------------------------- 1 | http://ujinbot.blogspot.kr/2013/10/blog-post.html 2 | 3 | https://mathiasbynens.be/notes/javascript-escapes#unicode-code-point 4 | 5 | 6 | 7 | codePointAt(index) Method 8 | 9 | 모든 UTF-16 문자에 대한 아스트랄 코드 포인트(16 진수 값이 4 개 이상인 코드 포인트)를 비롯한 코드 포인트 값을 반환합니다. 10 | 11 | index가 0 보다 작거나 문자열의 크기보다 큰 경우 반환 값은 undefined입니다. 12 | 13 | https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/codePointAt 14 | 15 | console.log("\uD83D\uDE91".codePointAt(1)); 16 | console.log("\u{1F691}".codePointAt(1)); 17 | console.log("hello".codePointAt(2)); 18 | 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /CH03.이터레이터/104.꼬리 호출 최적화(tail call optimization).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 꼬리 호출 최적화 (tail call optimization) 6 | 7 | 8 |

꼬리 호출 최적화

9 | 10 | 11 | 12 | 13 | 14 | 15 | 69 | 70 | 71 | -------------------------------------------------------------------------------- /CH03.이터레이터/92.ES6 심볼.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | ES6 심볼 6 | 7 | 8 |

ES6 심볼

9 | 10 | 11 | 12 | 13 | 14 | 15 | 87 | 88 | 89 | -------------------------------------------------------------------------------- /CH03.이터레이터/96.이터레이션 규약(iteration protocol).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 이터레이션 규약(iteration protocol) 6 | 7 | 8 |

이터레이션 규약(iteration protocol)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 61 | 62 | 63 | -------------------------------------------------------------------------------- /CH03.이터레이터/98.제너레이터(generator).html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 제너레이터 (generator) 6 | 7 | 8 |

제너레이터 (generator)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 143 | 144 | 145 | -------------------------------------------------------------------------------- /CH03.이터레이터/보충설명.md: -------------------------------------------------------------------------------- 1 | ### 알려진심볼: 상용심볼 (well-known symbols) 2 | 3 | #### 반복 심볼 4 | 5 | - [`Symbol.iterator`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/iterator) 6 | 7 | 객체의 기본 반복자(iterator)를 반환하는 메소드. `for...of에서 사용됨`. 8 | 9 | #### 정규표현식 심볼 10 | 11 | - [`Symbol.match`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/match) 12 | 13 | 문자열과 매치(match)되는 메소드, 또한 객체가 정규식으로서 사용되는지 확인하는데도 사용. [`String.prototype.match()`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/match)에서 사용됨. 14 | 15 | - [`Symbol.replace`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/replace) 16 | 17 | 문자열 중 매치되는 일부 문자열을 대체하는 메소드. [`String.prototype.replace()`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/replace)에서 사용됨. 18 | 19 | - [`Symbol.search`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/search) 20 | 21 | 정규식과 매치되는 문자열의 인덱스(index)를 반환하는 메소드. [`String.prototype.search()`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/search)에서 사용됨. 22 | 23 | - [`Symbol.split`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/split) 24 | 25 | 문자열을 정규식과 매치되는 인덱스들에서 나누는 메소드. [`String.prototype.split()`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/split)에서 사용됨. 26 | 27 | #### 그 외 심볼들 28 | 29 | - [`Symbol.hasInstance`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance) 30 | 31 | 생성자 객체가 어떤 객체를 자신의 인스턴스(instance)로 인식하는지 확인하는데 사용하는 메소드. [`instanceof`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/instanceof)에서 사용됨. 32 | 33 | - [`Symbol.isConcatSpreadable`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/isConcatSpreadable) 34 | 35 | *어떤 객체가 자신의 배열 원소들로 단순화(flatten)되어야 하는지 나타내는 불리언(Boolean) 값(불명확)*. [`Array.prototype.concat()`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)에서 사용됨. 36 | 37 | - [`Symbol.unscopables`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/unscopables) 38 | 39 | 속성 값들을 나타내는 문자열 배열 값. These are excluded from the `with` environment bindings of the associated objects. 40 | 41 | - [`Symbol.species`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/species) 42 | 43 | 파생(derived) 객체를 생성하는데 사용되는 생성자 함수. 44 | 45 | - [`Symbol.toPrimitive`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/toPrimitive) 46 | 47 | 객체를 기본형 값으로 변환하는 메소드. 48 | 49 | - [`Symbol.toStringTag`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol/toStringTag) 50 | 51 | 객체의 기본 설명(description)에 사용되는 문자열 값. [`Object.prototype.toString()`](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/toString)에서 사용됨. 52 | 53 | 54 | 55 | 56 | 참조 : 57 | 58 | https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Symbol 59 | 60 | 61 | 62 | 63 | 64 | 이터레이터 (Itertator) : 모든 컬렉션(Collection)으로 부터 정보를 얻을 수 있는 인터페이스 65 | 66 | 67 | 68 | #### for .. in 루프 69 | 70 | 71 | 72 | ``` 73 | var o = {a:1, b:2, c:3}; 74 | 75 | function show_props(obj, objName) { 76 | var result = ""; 77 | 78 | for (var prop in obj) { 79 | result += objName + "." + prop + " = " + obj[prop] + "\n"; 80 | } 81 | 82 | return result; 83 | } 84 | ``` -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/111.비동기 코드 작성.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 비동기 코드 작성 6 | 7 | 8 |

비동기 코드 작성

9 | 10 | 11 | 12 | 13 | 14 | 15 | 149 | 150 | 151 | -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/114.비동기 코드 작성#콜백을 포함한 비동기 코드.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 비동기 코드 작성 6 | 7 | 8 |

비동기 코드 작성#콜백을 포함한 비동기 코드

9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 70 | 71 | 72 | -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/116.구원자, 프라미스#1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 구원자, 프라미스 #1 6 | 7 | 8 |

구원자, 프라미스

9 | 10 | 11 | 12 | 13 | 14 | 15 | 207 | 208 | 209 | -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/127.구원자, 프라미스#2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 구원자, 프라미스 6 | 7 | 8 |

구원자, 프라미스 #2

9 | 10 | 11 | 12 | 13 | 14 | 15 | 159 | 160 | 161 | -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/131.프라미스 기반의 자바스크립트 API.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 프라미스 기반의 자바스크립트 API 6 | 7 | 8 |

프라미스 기반의 자바스크립트 API

9 | 10 | 11 | 12 | 13 | 14 | 15 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/README.md: -------------------------------------------------------------------------------- 1 | 예제를 실행하기 위해서는 node.js가 기본적으로 설치되어있어야 합니다. 2 | 3 | 4 | 5 | 1. 해당파일을 실행합니다. 6 | 7 | $ node data_serv.js 8 | 9 | 2. cross domain 처리를 위해 아래 크롬플러그인을 설치한후 예제를 실행합니다. 10 | 11 | https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?utm_source=chrome-ntp-icon -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/data.json: -------------------------------------------------------------------------------- 1 | { 2 | "Name": "수지", 3 | "Profession": "연예인", 4 | "Age": "25" 5 | } -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/data_serv.js: -------------------------------------------------------------------------------- 1 | var http = require('http'); 2 | http.createServer(function(request, response) { 3 | response.writeHead(200, {"Content-Type": "application/json; charset=UTF-8"}); 4 | var json = { 5 | "Name": "수지", 6 | "Profession": "연예인", 7 | "Age": "25" 8 | }; 9 | response.write(JSON.stringify(json)); 10 | response.end(); 11 | }).listen(8888); // http://127.0.0.1:8888 12 | -------------------------------------------------------------------------------- /CH04.비동기 프로그래밍/보충설명.md: -------------------------------------------------------------------------------- 1 | 프라미즈(Promise) 참고 2 | 3 | [구글 스토어 [리얼타임] JavaScript Promise 무료 이북](https://play.google.com/store/books/details/azu_%EB%A6%AC%EC%96%BC%ED%83%80%EC%9E%84_JavaScript_Promise?id=gfTJCQAAQBAJ) 4 | 5 | -------------------------------------------------------------------------------- /CH05.리플렉트 API 구현/136.Reflect 객체.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Reflect 객체 6 | 7 | 8 |

Reflect 객체

9 | 10 | 11 | 12 | 13 | 14 | 15 | 246 | 247 | 248 | -------------------------------------------------------------------------------- /CH05.리플렉트 API 구현/보충설명.md: -------------------------------------------------------------------------------- 1 | Reflect 객체 2 | 3 | `Reflect`는 자바스크립트 작업을 중간에서 가로챌 수 있는 `built-in` 객체다. `method`들은` proxy handler`들과 같다. `Reflect`는 함수 객체가 아니므로 생성자(`constructor`)로 사용될 수 없다. 4 | 5 | [MDN](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Reflect) 6 | 7 | 8 | 9 | ### 객체속성 10 | 11 | writable: 이 속성이 true 면 할당 연산자로 값을 변경 할 수 있다. 기본값은 false다. 12 | 13 | configurable: 이 속성이 true면 프로퍼티 속성을 변경/삭제 할 수 있다. 14 | 15 | enumerable: 이 속성이 true 면 프로퍼티를 for…in 루프나 Object.keys() 메소드에 열거 할 수 있다. 16 | 17 | 18 | 19 | ##### Reflect.apply(function, this, args); 20 | 21 | *function-name*.prototype.apply() 와 같다. 22 | 23 | 24 | 25 | ##### Reflect.construct(constructor, args, prototype) 26 | 27 | 인자 prototype 을 constructor 의 프로토타입으로 사용 28 | 29 | 30 | 31 | ##### Reflect.defineProperty(object, property, desciption) 32 | 33 | 34 | 35 | ##### Reflect.defineProperty(), Object.defineProperty(), Object.defineProperties(), Object.create() 로 추가된 함수는 writable, enumerable, configurable 모두 true로 설정된다. 36 | 37 | 객체에 동일 프로퍼티가 있다면 덮어쓴다. 38 | 39 | 서술자로 지정하지 않으면 유지된다. 40 | 41 | 42 | 43 | ##### Reflect.get(object, property, this) Method 44 | 45 | var name = Reflect.get(obj, "name", {__name__: "민호"}); 46 | 47 | {__name__: "민호"} this 에 직접 셋팅 48 | 49 | 50 | 51 | ##### Reflect.set(object, property, value, this) 메소드 52 | 53 | Reflect.set(obj1, "name", "수지", obj2); 54 | 55 | "name", "수지" 를 우선한다. 56 | 57 | 58 | 59 | ##### Reflect.getOwnPropertyDescriptor(object, property) 메소드 60 | 61 | 설정된 Descriptor 를 확인한다. 62 | 63 | 64 | 65 | ##### Reflect.getPrototypeOf(object) 메소드 66 | 67 | var obj1 = { 68 | __proto__: { // 프로토타입에 값 설정 69 | name: "수지" 70 | } 71 | }; 72 | 73 | var obj2 = Reflect.getPrototypeOf(obj1); // obj1의 프로토 타입을 obj2 에 저장 74 | console.log(obj2.name); 75 | 76 | 77 | 78 | ##### Reflect.setPropertyOf(object, prototype) 메소드 79 | 80 | 프로토타입에 값 설정 81 | 82 | 83 | 84 | ##### Refelct.has(object, property) 메소드 85 | 86 | 프로퍼티 존재 여부 확인 87 | 88 | 89 | 90 | ##### Reflect.isExtensible(object) 메소드 91 | 92 | Object.preventExtensions(), Object.freeze(), Object.seal() 로 객체 확장이 불가능하도록 만들 수 있다. 93 | 94 | 95 | 96 | ##### Reflect.preventExtensions(object) 메소드 97 | 98 | 확장이 불가능 하도록 막는다. 99 | 100 | 101 | 102 | ##### Reflect.ownKeys(object) 메소드 103 | 104 | 키추출 105 | 106 | 해당 객체의 Prototype 의 프로퍼티는 무시한다. -------------------------------------------------------------------------------- /CH06.프록시/150.프록시.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 프록시 6 | 7 | 8 |

프록시

9 | 10 | 11 | 12 | 13 | 14 | 15 | 295 | 296 | 297 | -------------------------------------------------------------------------------- /CH06.프록시/보충설명.md: -------------------------------------------------------------------------------- 1 | ### 프록시 2 | 3 | 객체 기본동작에 사용자 임의의 로직을 넣는다. 4 | 5 | 프록시에서 데이터가 변경되어도 모든 값이 변경된다. 6 | 7 | 8 | 9 | #### 트랩 10 | 11 | 로직에 트랩을 심어 가로챈다. 12 | 13 | 트랩 내부의 this는 handler 를 가르킨다. 14 | 15 | (주의 : Reflect 를 사용해서 객체를 조작) 16 | 17 | 18 | 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /CH07.클래스 답사/168.객체 지향 자바스크립트.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 객체 지향 자바스크립트 5 | 6 | 7 | 8 |

객체 지향 자바스크립트

9 | 10 | 11 | 12 | 13 | 14 | 15 | 147 | 148 | 149 | -------------------------------------------------------------------------------- /CH07.클래스 답사/176.클래스 정의.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 클래스 정의 5 | 6 | 7 | 8 |

클래스 정의

9 | 10 | 11 | 12 | 13 | 14 | 15 | 70 | 71 | 72 | -------------------------------------------------------------------------------- /CH07.클래스 답사/178.프로토타입 메소드.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 프로토타입 메소드 5 | 6 | 7 | 8 |

프로토타입 메소드

9 | 10 | 11 | 12 | 13 | 14 | 15 | 104 | 105 | 106 | -------------------------------------------------------------------------------- /CH07.클래스 답사/182.정적메소드.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 정적 메소드 6 | 7 | 8 |

정적 메소드

9 | 10 | 11 | 12 | 13 | 14 | 15 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /CH07.클래스 답사/183.클래스의 상속 구현.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 클래스의 상속 구현 6 | 7 | 8 |

클래스의 상속 구현

9 | 10 | 11 | 12 | 13 | 14 | 15 | 61 | 62 | 63 | -------------------------------------------------------------------------------- /CH07.클래스 답사/185.조합 메소드명.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 조합 메소드명 6 | 7 | 8 |

조합 메소드명

9 | 10 | 11 | 12 | 13 | 14 | 15 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /CH07.클래스 답사/186.프로퍼티 속성.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 프로퍼티 속성 6 | 7 | 8 |

프로퍼티 속성

9 | 10 | 11 | 12 | 13 | 14 | 15 | 87 | 88 | 130 | 131 | 132 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/195.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 즉시 실행 함수 표현식 (IIFE) 6 | 7 | 8 |

즉시 실행 함수 표현식 (IIFE)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/196-AMD/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 비동기 모듈 정의 (Asynchronous Module Definition:AMD) 6 | 7 | 8 |

비동기 모듈 정의 (Asynchronous Module Definition:AMD)

9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/196-AMD/math.js: -------------------------------------------------------------------------------- 1 | define(function() { 2 | var sum = function(x, y) { 3 | return x + y; 4 | } 5 | var sub = function(x, y) { 6 | return x - y; 7 | } 8 | var math = { 9 | findSum: function(a, b) { 10 | return sum(a, b); 11 | }, 12 | findSub: function(a, b) { 13 | return sub(a, b); 14 | } 15 | } 16 | return math; 17 | }); 18 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/197-CommonJS/index.js: -------------------------------------------------------------------------------- 1 | var math = require("./math").math; 2 | 3 | console.log(math.findSum(1, 2)); 4 | console.log(math.findSub(1, 2)); 5 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/197-CommonJS/math.js: -------------------------------------------------------------------------------- 1 | var sum = function(x, y) { 2 | return x + y; 3 | } 4 | 5 | var sub = function(x, y) { 6 | return x - y; 7 | } 8 | 9 | var math = { 10 | findSum: function(a, b) { 11 | return sum(a, b); 12 | }, 13 | findSub: function(a, b) { 14 | return sub(a, b); 15 | } 16 | } 17 | 18 | exports.math = math; 19 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/198-만능모듈정의/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 만능 모듈 정의 6 | 7 | 8 |

만능 모듈 정의

9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/198-만능모듈정의/index.js: -------------------------------------------------------------------------------- 1 | var math = require("./math"); 2 | 3 | console.log(math.findSum(1, 2)); 4 | console.log(math.findSub(1, 2)); 5 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/198-만능모듈정의/math.js: -------------------------------------------------------------------------------- 1 | // 만능 모듈 정의 2 | (function (root, factory) { 3 | // 환경파악 4 | if (typeof define === 'function' && define.amd) { 5 | define([], factory); 6 | } else if (typeof exports === 'object') { 7 | module.exports = factory(); 8 | } else { 9 | root.returnExports = factory(); 10 | } 11 | }(this, function() { 12 | // 모듈정의 13 | var sum = function(x, y) { 14 | return x + y; 15 | } 16 | var sub = function(x, y) { 17 | return x - y; 18 | } 19 | var math = { 20 | findSum: function(a, b) { 21 | return sum(a, b); 22 | }, 23 | findSub: function(a, b) { 24 | return sub(a, b); 25 | } 26 | } 27 | return math; 28 | })); 29 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/204-종합예제/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | "node6" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/204-종합예제/README.md: -------------------------------------------------------------------------------- 1 | 1. babel 설치 2 | 3 | $npm install 4 | 5 | 6 | 7 | 2. .babelrc 파일 생성 8 | 9 | { 10 | "presets": [ 11 | "node6" 12 | ] 13 | } 14 | 15 | 16 | 17 | 3. 실행 18 | 19 | ./node_modules/babel-cli/bin/babel-node.js ./index.js -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/204-종합예제/index.js: -------------------------------------------------------------------------------- 1 | import math from "./math"; 2 | 3 | console.log(math.trigonometry.getSin(3)); 4 | console.log(math.logarithm.getLN2(3)); 5 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/204-종합예제/math.js: -------------------------------------------------------------------------------- 1 | import * as logarithm from "./math_modules/logarithm"; 2 | import * as trigonometry from "./math_modules/trigonometry"; 3 | 4 | export default { 5 | logarithm: logarithm, 6 | trigonometry: trigonometry 7 | } 8 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/204-종합예제/math_modules/logarithm.js: -------------------------------------------------------------------------------- 1 | var LN2 = Math.LN2; 2 | var N10 = Math.LN10; 3 | 4 | function getLN2() { 5 | return LN2; 6 | } 7 | 8 | function getLN10() { 9 | return LN10; 10 | } 11 | 12 | export {getLN2, getLN10}; 13 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/204-종합예제/math_modules/trigonometry.js: -------------------------------------------------------------------------------- 1 | var cos = Math.cos; 2 | var sin = Math.sin; 3 | 4 | function getSin(value) { 5 | return sin(value); 6 | } 7 | 8 | function getCos(value) { 9 | return cos(value); 10 | } 11 | 12 | export {getCos, getSin}; 13 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/204-종합예제/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "204", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "author": "", 10 | "license": "ISC", 11 | "dependencies": { 12 | "babel-cli": "^6.24.1", 13 | "babel-preset-node6": "^11.0.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/Dictionary.md: -------------------------------------------------------------------------------- 1 | ### Dictionary 2 | 3 | 소스 실행방법 파일 형태로 실행하신다면 `#-*- coding: utf-8 -*-`를 최상단에 넣어 주세요. 4 | 5 | 6 | 7 | #### 기본 사용방법 8 | 9 | 기본적으로 `key: value` 형태로 요소를 선언합니다. 10 | 11 | ```python 12 | d = {'a': 0, 'b': 1, 'c': 2} 13 | d['a'] 14 | d['b'] = 1024 15 | d['c'] 16 | len(d) # 컬렉션의 크기를 반환합니다. 17 | d # {'a': 0, 'c': 2, 'b': 1024} 18 | del d['c'] # 요소를 삭제합니다. 19 | d # {'a': 0, 'b': 1024} 20 | d.get('b') # 1024 21 | # d['z'] # KeyError: 'z' 22 | d.get('z') # 요소가 없어도 에러가 발생하지 않습니다. 23 | ``` 24 | 25 | 26 | 27 | #### 키의 요건 28 | 29 | 키는 불변(immutable) 값이어야 합니다. 대부분의 자료형은 키로 가능합니다. 30 | 31 | ```python 32 | data['k'] = 'my key' 33 | data[2] = 7 34 | data[('a', 'b', 'c')] = 'tuple key' # 튜플도 키가 될 수 있습니다. 35 | ``` 36 | 37 | 함수도 값으로 가능합니다. 38 | 39 | ```python 40 | def add(a, b): 41 | return a+b 42 | 43 | def sub(a, b): 44 | return a-b 45 | 46 | action = {0: add, 1: sub} 47 | action[0](4, 5) 48 | action[1](4, 5) 49 | ``` 50 | 51 | 해시(hash) 타입이 아닌 객체는 키가 될 수 없습니다. 52 | 53 | ```python 54 | data[['a', 'b', 'c']] = 'list key' # TypeError: unhashable type: 'list' 55 | data[{'a', 'b', 'c'}] = 'dictionary key' # TypeError: unhashable type: 'set' 56 | ``` 57 | 58 | hashable 타입의 객체인지는 객체의 `__hash__` 속성으로 확인 가능합니다. 59 | 60 | ```python 61 | 'str'.__hash__ 62 | ('a', 'b', 'c').__hash__ # None 63 | ['a', 'b', 'c'].__hash__ # None 64 | ``` 65 | 66 | 67 | 68 | #### dict 메서드 사용 69 | 70 | dict 메서드를 사용해서 딕셔너리를 생성합니다. 3가지 방법모두 같은 결과를 반환합니다. 71 | 72 | ```python 73 | dict(a=1, b=2) # {'a': 2, 'b': 1} 74 | dict([('a', 1), ('b', 2)]) # {'a': 2, 'b': 1} 75 | dict({'a': 1, 'b': 2}) # {'a': 2, 'b': 1} 76 | ``` 77 | 78 | 79 | 80 | ##### 시퀀스 자료형 키와 값을 합성하여 딕셔너리를 생성하는 방법 81 | 82 | ```python 83 | keys = ['a', 'b', 'c'] 84 | values = (1, 2, 3) # 튜플, 리스트 모두 사용가능 85 | zip(keys, values) # keys와 values를 합한 튜플 리스트 반환 [('one', 1), ('two', 2), ('three', 3)] 86 | dict(zip(keys, values)) # 새로운 딕셔너리 생성 {'three': 3, 'two': 2, 'one': 1} 87 | ``` 88 | 89 | 90 | 91 | #### 다양한 딕셔너리 메서드 92 | 93 | ```python 94 | d = {'a': 0, 'b': 1} 95 | d.keys() # 키 리스트를 반환 ['a', 'b'] 96 | d.values() # 값 리스트를 반환 [0, 1] 97 | d.items() # 키, 값형태의 리스트를 반환 [('a', 0), ('b', 1)] 98 | 'a' in d # 딕셔너리의 요소 포함 여부를 반환합니다. True 99 | ``` 100 | 101 | 102 | 103 | ##### copy메서드로 새로운 객체 생성 104 | 105 | ```python 106 | d = {'a': 0, 'b': 1} 107 | ref = d # 레퍼런스 복사 108 | copy = d.copy() # 사전 복사, 별도의 사전 객체 생성성 109 | d['a'] = 9 110 | d['c'] = 8 111 | d # {'a': 9, 'c': 8, 'b': 1} 112 | ref # {'a': 9, 'c': 8, 'b': 1} 113 | copy # 새로운 딕셔너리 객체 {'a': 1234, 'b': 1} 114 | ``` 115 | 116 | get 메서드에 ('x', 3) 두번째 인자를 넣어주면 x 가 없을 경우 3을 반환합니다. 117 | 118 | setdefault 로 값을 지정해주면 키가 없을 경우 새로운 키를 딕셔너리에 넣고 값을 설정합니다. 119 | 120 | popitem 메서드는 처음 아이템을 꺼내고 딕셔너리에서 삭제합니다. 121 | 122 | pop메서드는 지정된 값을 꺼내고 딕셔너리에서 삭제합니다. 123 | 124 | 125 | ```python 126 | d = {'a': 0, 'b': 1} 127 | d.get('a') 128 | d.get('e') # 값이 없을 경우 None 리턴 129 | d.get('x', 3) # x 가 없는 경우 3을 리턴한다. 130 | 131 | d.setdefault('z', 99) # 'z' 키가 없다면 99로 저장 {'a': 0, 'b': 1, 'z': 99} 132 | d.popitem() # 'a' 아이템을 꺼낸다. {'b': 1, 'z': 99} 133 | d.pop('b') # 'b' {'z': 99} 134 | ``` 135 | 136 | update 메서드를 통해 딕셔너리 속에 다른 딕셔너리(컬렉션)를 추가하는것이 가능합니다. 137 | 138 | clear 를 하게 되면 딕셔너리가 초기화 됩니다. {} 139 | 140 | ```python 141 | items = {'a': 0, 'b': 1} 142 | new_items = {'test': 1234} 143 | new_items.update(items) # new_items에 items 가 추가 됩니다. 144 | new_items # {'test': 1234, 'a': 0, 'b': 1} 145 | items.clear() 146 | ``` 147 | 148 | 149 | 150 | #### 전역/지역 심볼 데이터 151 | 152 | ```python 153 | a = 1 154 | b = 100 155 | name = 'jamie' 156 | dic = {'a': 'Good', 'b': 'Not Good'} 157 | print globals() # 심볼데이터(딕셔너리) 전체를 얻습니다. 158 | print locals() # 심볼데이터(딕셔너리) 전체를 얻습니다. globals()와 큰차이가 없습니다. 159 | ``` 160 | 161 | {'a': 1, 'b': 100, 'name': 'jamie', '__builtins__': , '__file__': '/Users/jamie/Documents/temp_workspace/python/test.py', '__package__': None, '__name__': '__main__', 'dic': {'a': 'Good', 'b': 'Not Good'}, '__doc__': None} 162 | 163 | 164 | ##### 함수 내부의 심볼 데이터 조회 165 | 166 | ```python 167 | def f(): 168 | pass 169 | 170 | f.a = 1 171 | f.b = 2 172 | print f.__dict__ # {'a': 1, 'b': 2} 173 | ``` 174 | 175 | 176 | 177 | #### 반복문을 사용한 딕셔너리 순회 방법 178 | 179 | ```python 180 | D = {'a': 1, 'b': 2, 'c': 3} 181 | for key in D.keys(): 182 | print key, D[key] 183 | 184 | for key in D: 185 | print key, D[key] 186 | 187 | for key, value in D.items(): 188 | print key, value 189 | ``` 190 | 191 | 192 | 193 | #### 딕셔너리 정렬 194 | 195 | ##### 키 정렬 196 | 197 | ```python 198 | d = {'b': 2, 'c': 3, 'a': 1} 199 | items = d.items() 200 | items.sort() # 알파벳 순서로 정렬 201 | print items # [('a', 1), ('b', 2), ('c', 3)] 202 | ``` 203 | 204 | 205 | 206 | ##### 값 정렬 207 | 208 | ```python 209 | d = {'three': 3, 'two': 2, 'one': 1} 210 | items = d.items() 211 | items.sort(key=lambda item: item[1]) 212 | print items # [('one', 1), ('two', 2), ('three', 3)] 213 | ``` 214 | 215 | 216 | 217 | ##### for in 루프에 sorted 메서드를 사용한 정렬 218 | 219 | ```python 220 | d = {'three': 3, 'two': 2, 'one': 1} 221 | for key, value in sorted(d.items(), key=lambda item: item[1]): 222 | print key, value 223 | 224 | # one 1 225 | # two 2 226 | # three 3 227 | ``` 228 | 229 | 230 | 231 | #### Reference 232 | 233 | 1. [열혈강의 파이썬](http://www.yes24.com/24/goods/1783933?scode=032&OzSrank=1) -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/extend/app.js: -------------------------------------------------------------------------------- 1 | const {foo, bar} = require ( './foobar'); 2 | console.log (foo (), bar ()); 3 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/extend/foobar.js: -------------------------------------------------------------------------------- 1 | function foo () { 2 | return 'bar'; 3 | } 4 | function bar () { 5 | return 'foo'; 6 | } 7 | module.exports.foo = foo; 8 | module.exports.bar = bar; 9 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/extend/기존사용법/app.js: -------------------------------------------------------------------------------- 1 | // 구형 node에서 에러 2 | 3 | import {foo, bar} from 'foobar'; 4 | console.log(foo()); 5 | console.log(bar()); 6 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/extend/기존사용법/foobar.js: -------------------------------------------------------------------------------- 1 | export function foo() { 2 | return 'bar'; 3 | } 4 | export function bar() { 5 | return 'foo'; 6 | } 7 | -------------------------------------------------------------------------------- /CH08.모듈러 프로그래밍/보충설명.md: -------------------------------------------------------------------------------- 1 | #### export, import 2 | 3 | [export](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/export) 4 | 5 | [import](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/import) 6 | 7 | 8 | 9 | #### An Update on ES6 Modules in Node.js 10 | 11 | https://medium.com/the-node-js-collection/an-update-on-es6-modules-in-node-js-42c958b890c 12 | 13 | 14 | 15 | - export 16 | 17 | module.exports.foo = foo; 18 | - import 19 | 20 | const {foo, bar} = require ( './foobar'); -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Learning ECMAScript 6 2 | Learning ECMAScript 6 3 | 4 | ### ECMAScript 6 길들이기 도서의 소스와 책을 기반으로 설명이 추가된 저장소입니다. 5 | --------------------------------------------------------------------------------