ES6에서의 객체 (동일한 key명과 value명 처리, 매서드의 의미 )

JEON.HYEONG.JUN·2023년 3월 25일
0

퇴근 후 자바스크립트 공부는 적은 시간이지만 꾸준히 하고 있다.
기억해 둘법한 내용들을 간단하게 정리해보자.


기존 문법

const x = 1, y = 2;

const obj1 = { 
  x: x,
  y: y
}

console.log(obj1);
=> {x: 1, y: 2}

콘솔찍어보기전에는 에러가 날 것 같았는데 x:1, y:2로 할당이 되었다.

ES6에서의 문법

function createProduct (name, price, quantity) {
    return {name, price, quantity}
}

createProduct('선풍기', 5000, 1)

=> {name: '선풍기', price: 5000, quantity: 1}

위와 같이 마치 클래스를 찍어내듯 사용할 수 있다.


기존문법

const person = {
  name: '홍길동',

  salutate: function (formal) {
    return formal
    ? `안녕하십니까, ${this.name}입니다.`
    : `안녕하세요, ${this.name}이에요.`;
  }
}
console.log(person.salutate(true));
=>안녕하십니까, 홍길동입니다.
const person = {
    name: '홍길동',

    salutate (formal) {
        return formal
        ? `안녕하십니까? 저는 ${this.name}입니다.`
        : `안녕? 나는 ${this.name}이야`
    }
}

console.log(person.salutate(true));
=>안녕하십니까, 홍길동입니다.

ES6부터는 위의 표현으로 정의된 함수만(function으로 정의한 것이 아닌) 매서드라고 부른다.


코드의 길이가 짧아지고 가독성이 좋아진 것 같다.

사실 위 2개의 사례를 보면 현업에서 사용할 가능성은 적지만,
기록해두면 언젠가 써먹을 날이 오겠지..음..

profile
💻😀👍🎁👏😁

0개의 댓글