[javascript] 객체 리터럴 최적화 방법

자바스크립트에서 객체 리터럴을 사용하는 것은 매우 흔한 일이지만, 이를 최적화하여 성능을 향상시키는 방법에 대해 알아봅시다.

1. 단축 속성명

객체 속성명이 변수명과 동일할 경우, 객체를 더 간결하게 작성할 수 있습니다.

let name = 'John';
let age = 30;

// 기존 방식
let person = { name: name, age: age };

// 최적화된 방식
let person = { name, age };

2. 메서드 축약

객체에 함수를 추가할 때, function 키워드를 생략하여 간결하게 작성할 수 있습니다.

// 기존 방식
let obj = {
  sayHello: function() {
    console.log('Hello');
  }
};

// 최적화된 방식
let obj = {
  sayHello() {
    console.log('Hello');
  }
};

3. 계산된 속성명

대괄호를 사용하여 동적으로 속성명을 계산하여 추가할 수 있습니다.

let propName = 'age';

// 기존 방식
let person = {};
person[propName] = 30;

// 최적화된 방식
let person = { [propName]: 30 };

4. Object.assign 활용

여러 객체를 병합할 때 Object.assign을 사용하여 성능을 최적화할 수 있습니다.

let obj1 = { a: 1 };
let obj2 = { b: 2 };

// 기존 방식
let merged = Object.assign({}, obj1, obj2);

// 최적화된 방식
let merged = { ...obj1, ...obj2 };

객체 리터럴을 최적화하는 방법은 코드의 가독성을 높이고 작성하는 데 필요한 양을 줄일 뿐만 아니라, 성능도 향상시킬 수 있습니다. 최신 자바스크립트 엔진은 이러한 최적화 기법을 지원하므로 안전하게 활용할 수 있습니다.

참고 문헌