[JavaScript] 모듈

📔 모듈

• 애플리케이션을 기능 단위로 분할/정리
• 하나의 파일로 정의하는 것이 기본
• 모듈 안의 멤버는 기본적으로 비공개
• 모듈로서 외부에서 액세스할 수 있는 멤버에게 export 키워드를 부여

* 예시 (ib/Util.js) * 
const AUTHOR = 'YAMADA, Yoshihito';

export class Member { ... }

export class Area { ... }

• 다른 파일로 정의된 모듈을 가져 오는 것은 import 명령
  1) import { name, ... } from module
  2) import * as 모듈의별명 from module : 모듈 전체를 한꺼번에 가져옴
  3) import { name as 모듈의별명, name as 모듈의별명} from module : 모듈 안의 개별 요소에 별명 부여함
  4) export default class { : 모듈에 포함된 요소가 하나뿐이면 default 키워드를 사용하여 디폴트의 export를 선언

import { Member, Area } from './lib/Util';
var m = new Member('성룡', '김');
console.log(m.getName());         // 결과 : 김성룡

import * as app from './lib/Util';
var m = new app.Member('성룡', '김');
console.log(m.getName());         // 결과 : 김성룡

module './lib/Util';
var m = new MyMember('성룡', '김');
console.log(m.getName());         // 결과 : 김성룡
console.log(MyArea.getTriangle(10, 5));  // 결과 : 25

export default class {
	static getTriangle(base, height) {
    	return base * height / 2;
    };
}

---

📔 열거 가능한 객체 정의하기 - 반복자

• 객체 내용을 열거하기 위한 구조를 갖춘 객체
• Array, String, Map, Set 등의 내장 객체는 모두 디폴트로 반복자를 갖추고 있기 때문에 for ~ of 명령으로 내부의 요소를 열거 할 수 있다.

let data_ary = ['one', 'two', 'three'];
let data_str = '가나다라마';
let data_map = new Map[['MON', '월요일'], ['TUE', '화요일'], ['WED', '수요일']]);

for(let d of data_ary) {
	console.log(d);           // 결과 : one two three
}

for(let d of data_str) {
	console.log(d);         // 결과 : 가,나,다,라,마
}

for(let d of data_map) {
	console.log(`${key}:${value}1`); // 결과 : MON:월요일, TUE:화요일, WED:수요일
}

• 반복자는 두 개의 속성( value, done)을 반환하는 next() 메소드 사용하여 객체의 Iterator protocol을 구현한다.
• 자바스크립트에서 가장 일반적인 반복자는 배열 반복자로, 배열의 각 값을 순서대로 반환합니다.

let data_ary = ['one', 'two', 'three'];
let itr = data_ary[Symbol.iterator] ();]     ⓐ
let d;
while (d = itr.next()) { ⓑ
	if (d.done) { break; } ⓒ
    console.log(d.done);       // 결과 : false, false, false
    console.log(d.value);      // 결과 : one two three

ⓐ [Symbol.iterator] 메소드는 배열 내의 요소를 열거하기 위한 반복자(Iterator 객체)를 반환한다.
ⓑ 반복자는 배열의 다음의 요소를 꺼내기 위한 next 메소드를 갖는다

프로퍼티	개요
done	반복기가 끝에 도달했는가 = 다음의 요소가 없는가
value	다음 요소의 값

ⓒ done 프로퍼티가 true에 반환하기까지 while 루프로 반복함으로써 배열의 내용을 출력

---

📔 열거 가능한 객체를 더욱 간단하게 구현하기 - 발생자

- function*{...}으로 정의
- yield 명령으로 값을 반환

function* myGenerator() {
	yield '가나다라마';
    yield '바사아자차';
    yield '타카파하갸';
}

for(let t of myGenerator()) {
	console.log(t);
}                                // 결과 : 가나다라마, 바사아자차, 타카파하갸

🔹 yield
: return과 비슷한 명령 = 함수의 값을 호출자에게 반환한다.
: return은 그 자리엣 함수를 종료하는 반면, yield은 처리를 일시 중지할 뿐 즉, 다음에 호출될 때는 그 시점부터 처리를 재개할 수 있다.
: 메모리 소비를 관리하기 때문에 최소한으로 처리 할 수 있다.

---

📔 객체의 기본적인 동작을 사용자 정의하기 - Proxy 객체

• 프로퍼티의 설정/취득/삭제, for ~ of/for ~ in 명령에 의한 열거와 같이 객체의 기본 동작을 애플리케이션 독자적인 동작으로 교체하기 위한 객체
• Proxy를 이용하여 기존이 객체에 손을 대지 않고 구현 가능

new Proxy (target, handler)
       target : 조작을 끼워 넣어야 할 대상이 되는 객체
       handler : 타깃의 조작을 정의하기 위한 객체

let data = { red : '빨간색', yellow: '노란색' };
var proxy = new Proxy(data, {
	get(target, prop) {   ⓐ
    	return prop in target ? target[prop] : '?';
    }
});
console.log(proxy.red);         // 결과 : 빨간색
console.log(proxy.nothing);     // 결과 : ?

ⓐ target의 prop가 존재하고 있으면 그 값(target[prop])을 반환하고, 그렇지 않으면 ?를 반환한다.