Javascript 문법 기록

14870 단어 JavaScriptJavaScript

키워드 위주로 잊지 않게 간단히 적어놓을 예정이다.
출처:
Object definProperty - MDN Web Docs
Symbol- MDN Web Docs
function* - MDN Web Docs
yield - MDN Web Docs
yield* - MDN Web Docs

Object definProperty

기존의 단순한 오브젝트 정의에서 고급진 기능을 활용할 수 있게 하는 정적 메서드이다.
단순한 값 설정 뿐만 아니라 재할당 및 삭제 할당 연산자 사용을 설정할 수 있고 enumerable 속성도 설정할 수 있다.

let obj = {};

//밑의 두 코드는 의미가 같다.
obj.a = 1;

Object.defineProperty(obj, "a", {
  value: 1,
  writable: true,
  configurable: true,
  enumerable: true
});

Setters and Getters

function Archiver() {
  var temperature = null;
  var archive = [];

  Object.defineProperty(this, 'temperature', {
    get: function() {
      console.log('get!');
      return temperature;
    },
    set: function(value) {
      temperature = value;
      archive.push({ val: temperature });
    }
  });

  this.getArchive = function() { return archive; };
}

var arc = new Archiver();
arc.temperature; // 'get!'
arc.temperature = 11;
arc.temperature = 13;
arc.getArchive(); // [{ val: 11 }, { val: 13 }]

Symbol

심볼은 겹치지 않는 유일한 키를 반환한다. 해당 심볼을 오브젝트의 키로 한다면 절대 겹치지 않는다.

Symbol(key)

지역 심볼키를 생성한다.

Symbol.for(key)

해당 메소드는 먼저 전역 심볼 레지스트리에서 해당 키로 존재하는 심볼을 찾는다. 만약 없다면 전역 심볼 레지시트리에 해당 키로 새로운 심볼을 만들어 준다.
다른 라이브러리의 전역 심볼들과의 충돌을 피하기 위해서 key를 생성할 때 prefix를 두는 것이 좋다.

Symbol.for('foo'); // 새로운 전역심볼 생성
Symbol.for('foo'); // 이미 만들어진 심볼을 검색

// 전역심볼은 서로 같고, 지역심볼은 아니다.
Symbol.for('bar') === Symbol.for('bar'); // true
Symbol('bar') === Symbol('bar'); // false

// 키는 설명하는데 쓰이기도 한다.
var sym = Symbol.for('mario');
sym.toString(); // "Symbol(mario)"

Generator

function*

Generator 객체를 반환하는 generator function을 의미한다.

yield

Generator function(fucntion*)을 중지하거나 재개하는데 사용되는 키워드이다.

function* foo(){
  var index = 0;
  while (index <= 2) // when index reaches 3,
                     // yield's done will be true
                     // and its value will be undefined;
    yield index++;
}

yield*

generator iterable 객체에 yield를 위임할 때 사용되는 표현식이다.

function* g1() {
  yield 2;
  yield 3;
  yield 4;
}

function* g2() {
  yield 1;
  yield* g1();
  yield 5;
}

var iterator = g2();

console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: 4, done: false }
console.log(iterator.next()); // { value: 5, done: false }
console.log(iterator.next()); // { value: undefined, done: true }

좋은 웹페이지 즐겨찾기