[JavaScript] Style Guide

HYl·2022년 3월 4일
0

메소드의 단축구문을 사용하세요

// bad
const atom = {
  value: 1,

  addValue: function (value) {
    return atom.value + value;
  },
};

// good
const atom = {
  value: 1,

  addValue(value) {
    return atom.value + value;
  },
};

hasOwnProperty, propertyIsEnumerable, isPrototypeOf와 같은 Object.prototype 메소드를 직접 호출하지 마세요.
=> 왜? 이러한 메소드들은 객체의 속성에 의해 가려질 수 있습니다. - { hasOwnProperty: false } - 또는, 객체가 null 객체(Object.create(null))일 수도 있습니다.

// bad
console.log(object.hasOwnProperty(key));

// good
console.log(Object.prototype.hasOwnProperty.call(object, key));

// best
const has = Object.prototype.hasOwnProperty; // 모듈스코프에서 한 번 캐시하세요.
console.log(has.call(object, key));
/* or */
import has from 'has'; // https://www.npmjs.com/package/has
console.log(has(object, key));

객체에 대해 얕은 복사를 할 때는 Object.assign대신 객체 전개 구문을 사용하세요. 특정 속성이 생략된 새로운 개체를 가져올 때는 객체 나머지 연산자(object rest operator)를 사용하세요.

// very bad
const original = { a: 1, b: 2 };
const copy = Object.assign(original, { c: 3 }); // `original`을 변조합니다 ಠ_ಠ
delete copy.a; // 그래서 이렇게 합니다 

// bad
const original = { a: 1, b: 2 };
const copy = Object.assign({}, original, { c: 3 }); // copy => { a: 1, b: 2, c: 3 }

// good
const original = { a: 1, b: 2 };
const copy = { ...original, c: 3 }; // copy => { a: 1, b: 2, c: 3 }

const { a, ...noA } = copy; // noA => { b: 2, c: 3 }

profile
꾸준히 새로운 것을 알아가는 것을 좋아합니다.

0개의 댓글