ch48-해설.md

Chapter48

📌문제1

true or false를 고르시오

export default를 할 때 const, let, var 키워드는 사용할 수 없다. 
default 키워드로 export 한 모듈을 import 할 때는 이름이 없기 때문에 아무 이름으로 import 해도 상관 없다.
모듈 내에서 var 키워드로 선언한 변수는 전역변수가 아니다. 

정답 및 해설

(1) true const, let, var 키워드를 사용할 수 없다. 
(2) true default 키워드로 export 할 때에는 이름이 없어서 아무 이름이나 사용해도 된다. 따라서 오타 체크가 되지 않기 때문에 주의해서 사용해야 한다. 
(3) true 모듈 스코프 안의 변수로 남게 된다. 

📌문제2

다음 중 오류가 발생하는 코드를 고르세요.

import { pi as PI, square as sq } from './lib.mjs';
export default x => x * x; // (2)
export default const foo = () => {}; // (3)

정답 및 해설

(3)
default 키워드를 사용하는 경우 var, let, const 키워드는 사용할 수 없습니다.

📌문제3

다음 보기의 true, false를 판단하시오.

(1) : 현재 Node.js는 CommonJS 사양을 따른다.
(2) : ES6에 추가된 import, export는 브라우저 환경에서 사용하기 적합하다

정답 및 해설

(1) : true
(2) : true

// CommonJS
// - Javascript Everywhere를 목적으로 한 자발적 워킹 그룹
// - 비동기적으로 로딩 가능한 서버환경에 적합
// - script 파일 로딩시 blocking이 발생하는 브라우저 환경에서는 성능저하 발생

// math.js
module.exports = {
  sum: function (a, b) { return a + b }
};

// sub.js
const math = require('./math.js');
module.exports = {
  plusTwo: function (a) { return math.sum(a, 2); }
}

// main.js
const plusTwo = require('./sub.js').plusTwo;
console.log(plusTwo(10));


// AMD (Asynchronous Module Definition)
// - CommonJS가 브라우저환경에서 비동기 모듈 로드에 대한 관심이 적은 것에 반감으로 분리된 집단
// - 브라우저 환경에서 비동기 네트워크 로딩 처리 가능

// math.js
define([], function () {
  function sum (a, b) { return a + b; }
  return {
    sum: sum
  }
});

// sub.js
define(['math'], function (math) {
  function plusTwo (a) {
    return math.sum(a, 2);
  }
  return {
    plusTwo: plusTwo
  }
});

// main.js
require(['sub'], function (sub) {
  console.log(sub.plusTwo(10));
});


// ES6 모듈 (ESM)
// - ES6에 추가된 사양으로 현재 대부분의 브라우저가 지원
// - Node.js 환경에서 사용하려면 package.json에 type: module 작성

// math.js
export function sum(a, b) { return a + b }

// sub.js
import { sum } from './math.js';
export default function (a) { return sum(a, 2) }

// main.js
import plusTwo from './sub.js';
console.log(plusTwo(10));

• 🔗ES2015+ 제대로 알아보기 - 3.비표준 모듈 시스템들 (CommonJS, AMD) (Youtube)

📌문제4

모듈사용의 장점에대해서 서술하시오.(2가지)

답안 작성

(1) : 코드의 단위를 명확히 분리하여 애플리케이션을 구성할 수 있게된다.
(2) : 재사용성이 좋아서 개발 효율성과 유지보수성을 높일 수 있다.
p.891