자바스크립트 객체내부에서 키를 생략 가능한 경우

예제1

자바스크립트의 객체 내부에서 키값이 생략되는 경우를 크게 4가지로 예를 들면 아래와같다 (ES6 , 2015부터적용)

위의 예제에서 사용된건 아래의 1번과 3번이다


1. Computed Property Names (계산된 속성 이름): 객체를 생성할 때, 대괄호 [] 안에서 표현식을 사용하여 키를 동적으로 생성할 수 있습니다.

const dynamicKey = "age";
const person = {
  name: "John",
  [dynamicKey]: 30, // 계산된 속성 이름
};

2. Shorthand Property Names (축약된 속성 이름): 객체를 생성할 때 변수와 객체의 속성 이름이 동일한 경우, 속성 이름을 생략할 수 있습니다.

// 키값과 변수명이 동일한 경우 ( 일반적으로 자주 사용됨 )

const name = "John";
const age = 30;

const person = { name, age }; // 객체 속성 이름을 변수명과 일치시킴

3.Property Value Shorthand (속성 값 축약): 객체 리터럴에서 메서드를 정의할 때 function 키워드를 생략할 수 있습니다.

// 함수를 사용할시 function과 키명을 생략할수있다 ( 일반적으로 자주 사용됨 )

const greet = {
  sayHello() {
    console.log("Hello!");
  },
};

4. Destructuring Assignment (해체 할당): 객체를 해체할 때 원하는 속성만 가져오고 나머지는 무시할 수 있습니다.

const person = { name: "John", age: 30, email: "john@example.com", };
const { name, ...rest } = person; // name 속성을 가져오고 나머지는 rest 객체에 할당



객체안의 함수를 호출할때

const myObject = {
  firstFunction: function() {
   console.log('hi');
  }
};

myObject.firstFunction();  // hi
Oct 27, 2023 Views 103