class의 get, set 부분에서 setter는 호출하는 것이 아니라 프로퍼티처럼 값을 할당하는 형식으로 사용하며 할당 시에 메소드가 호출된다. 사용 방법은 아래와 같다.

class Foo {
  constructor(arr = []) {
    this._arr = arr;
  }
	// 아래의 출력결과에 맞게끔 getter 메소드를 만드시오.
  // 아래의 출력결과에 맞게끔 setter 메소드를 만드시오.
	get firstElem () {
		return this._arr[0];
	}
	set firstElem (value) {
		this._arr[0] = value;
	}
}

const foo = new Foo([1, 2]);
foo.firstElem = 100;    //setter 호출 방법
console.log(foo.firstElem); // 100

모듈

모듈은 자바스크립트 분리를 위해 사용한다.

아래와 같이 스크립트 태그에 타입 어트리뷰트에 “module”로 지정하면 된다. 그리고 구분을 위해 파일 확장자에 mjs로 표기한다.

<!DOCTYPE html>
<html>
<body>
  <script type="module" src="foo.js"></script>
  <script type="module" src="bar.js"></script>
</body>
</html>

모듈의 특징은 모듈만의 각자의 스코프를 가진다. 그렇기에 직접 공개하지 않는 이상 다른 파일에서 변수나 함수 등 코드를 사용할 수 없다.

변수나 함수 등을 다른 모듈에서 사용할 땐 export를 사용한다.

// lib.mjs
// 변수의 공개
export const pi = Math.PI;

// 함수의 공개
export function square(x) {
  return x * x;
}

// 클래스의 공개
export class Person {
  constructor(name) {
    this.name = name;
  }
}

// 일일히 하나씩 선언 앞에 export를 붙이기 귀찮다면 
export { pi, square, Person };
// 이렇게 하나로 묶어서 공개할 수 도 있다.

그리고 이렇게 공개한 코드들을 가져와 사용하고 싶을 땐 import를 사용한다.

// app.mjs
// 같은 폴더 내의 lib.mjs 모듈을 로드.
// lib.mjs 모듈이 export한 식별자로 import한다.
// ES6 모듈의 파일 확장자를 생략할 수 없다.
import { pi, square, Person } from './lib.mjs';

console.log(pi);         // 3.141592653589793
console.log(square(10)); // 100
console.log(new Person('Lee')); // Person { name: 'Lee' }

// 아래와 같이 사용가능 하다.
import * as lib from './lib.mjs';
그리고 사용할 땐 지정한 이름의 프로퍼티로 사용한다.
lib.pi()
lib.square()
new lib.new Person('Lee')

// 그리고 각자 이름을 변경하여 사용할 수도 있다.
import { pi as PI, square as sq, Person as P } from './lib.mjs';
PI()
sq()
new P()