생성자 함수, 계산된 프로퍼티, 객체 메소드, 심볼

*생성자 함수

function Item(title, price) {

    // this = {};

    this.title = title;

    this.price = price;

    this.showPrice = function() {

        console.log(`가격은 ${price}원 입니다.`);

    }

    //return this;

}

//new를 안붙이면 그냥 함수실행

const item1 = new Item('인형', 1000);

const item2 = new Item('인형2', 2000);

const item3 = new Item('인형3', 3000);

item3.showPrice();

// => 가격은 3000원 입니다.

 

- 생성자 함수를 사용하면 주석으로 돌린 코드와 같이 실행됨.

- new를 안붙이면 그냥 함수가 실행되므로 new를 꼭 붙여야함.

 

*계산된 프로퍼티(computed property)

let a = 'age';

const user = {

    name: 'mike',

    // age : 30

    [a] : 30 //으로 작성해도 됨 이게 계산된 프로퍼티

}

 

*객체 메소드

1. Object.assign() : 객체 복제

const user1 = {

    name: 'mike',

    age: 20

}

const user2 = {

    height:20

}

const cloneUser = Object.assign({gender:'male'}, user1, user2); //user1이 복제됨 cloneUser랑 user1은 다름

cloneUser.name = 'hihi';

console.log(cloneUser) //{gender: 'male', name: 'hihi', age: 20, height: 20}

console.log(user1) //{name: 'mike', age: 20}

- 기존의 객체는 변경되지 않음. 

- cloneUser라는 객체가 새로 생긴 

 

2. object.key() : 키 값/ Object.values() : value값 / Object.entries() / Object.fromEntries()

const user = {

    name: 'mike',

    age : 30 

}

 

const userKey = Object.keys(user); //키값

console.log(userKey) // ['name', 'age']

const userValue = Object.values(user); //value값

console.log(userValue) // ['mike', 30]

const userEntries = Object.entries(user); //둘 다

console.log(userEntries) // ['name', 'mike'],['age', 30]

 

let arr = [

    ['mon', '월'],

    ['tue', '화']

]

const result = Object.fromEntries(arr);

console.log(result); //{mon: '월', tue: '화'}

- Object.entries() 는 객체를 배열로 변환

- Object.fromEntries() 는 배열을 객체로 변환, 배열의 각 요소가 정확이 두개 (키, 값)으로 이루어져야 작동함.

 

3. 심볼 Symbol, 전역심볼 Symbol.for()

const symbolSample = { //다른 개발자가 만들어 놓은 객체

    name: 'mike',

    age:20

}

// user.showName = function() {} //내가 작업

const showName = Symbol('show name');

symbolSample[showName] = function() {

    console.log(this.name); //=>mike

}

symbolSample[showName]();

for (let key in symbolSample) { // 사용자가 접속하면 보는 메세지

    console.log(`his ${key} ${symbolSample[key]}`); //=>his age 20 , his age 20

}

//전역심볼 Symbol.for()

// 하나의 심볼만 보장받을 수 있음

const id1 = Symbol.for('id');

const id2 = Symbol.for('id');

console.log(id1 === id2); //true

 

- 다른 개발자가 만들어 놓은 객체에 코드를 추가해야할 때 심볼을 사용함.

- 위의 예시 코드와 같이 내가 작업한 부분이 보이면 안되니 심볼을 이용함.

- 사실 사용해봐야 알 것같음.