Object

JavaScript 데이터 유형 중 하나. 다양한 키 모음 & entity를 저장.

key, value로 이루어짐

key : 문자, 숫자, symbole 등 단순 값
value : 문자, 숫자, (원시값), 객체 함수 등

생성 방식

object literal

let puppy = {
    name : '코코',
    'puppy-color' : 'cream',
    display : function(){
        console.log(`${puppy.name} :🐕`);
    }
}

key값에 '-'를 쓸 수 없음 -> 문자열로 변환하여 써야 함.

console.log(puppy);

생성한 객체 출력(마침표 표기법)

존재하지 않은 key값 참고하면..

console.log(puppy.shape);

문자열 key값은 '.' 생략 후, 배열처럼 접근 가능(대괄호 표기법)

console.log(puppy['puppy-color']);

객체의 function value 접근

puppy.display();

생성자 이용

let cat = new Object()

cat.name = '키위';
cat['color'] = 'cream';
cat.display = function(){
    console.log(`${this.name} : 🐈`);
}

console.log(cat);
console.log(cat.display());

Object.create()함수

지정된 프로토타입 객체와 프로퍼티를 갖고 새로운 객체를 만들어 줌.
사용자가 프로토타입 객체를 직접 명시할 수 있음.
상위클래스의 메소드를 하위클래스 메소드로 가져올 수 있음.
상위클래서의 constructor가 복사되어 오기 때문에 하위클래서 constructor를 따로 지정해 주어야 함

Object.create(프로토타입객체[,새로운 객체의 프로퍼티1, 새로운객체의 프로퍼티2,..])

상위클래스

function nctMember(name, team, position){
    this.name = name;
    this.team = team;
    this.position = position;
}

nctMember.prototype.intro = function(num){
    console.log(`${this.name}'s team : ${this.team} age : ${num} position : ${this.position}`);
}

function nct(name, team, position){
    nctMember.call(this, name, team);
    this.position = position;
}

nct.prototype = Object.create(nctMember.prototype);
const jisung = new nct('jisung.park', 'NCT DREAM', 'vocal, rap')
jisung.intro(21);

nctMember에 지정했던 intro라는 속성을 사용할 수 있음.

nct.prototype.constructor = nct;

jisung의 constructor가 nctMember의 constructor를 받기 위해 작성.

정적접근 & 동적접근

정적접근

const obj = {
    name : '마크',
    age : 24
}

// 코딩하는 시점, 정적으로 접근이 확정
console.log(obj);
console.log(obj.name);// value값을 얻을 수 있음.

obj.name = '제노'; // value값 수정
console.log(obj);

obj.team = 'NCTDREAM';
console.log(obj);

동적접근

동적으로 속성에 접근하고 싶을때 대괄호 표기법 사용

const obj = {
    name : "마크"
}
function getValue(obj,key){
    return obj[key];
}
console.log(getValue(obj,"name"));

// 동적으로 추가
function addKey(aa, bb, cc){
    aa[bb] = cc;
}
addKey(obj, "age", '24');
console.log(obj);

addKey(obj, "country", "canada");
console.log(obj);

축약형

key name과 value(참조하고 있는 변수의 이름)이 같으면 생략 가능

const x = 0;
const y = 0;

const a = {
     x,
     y
}
console.log(a);

const name = '마크';
const age = '24';

function b(name, age){
    return{
        name, 
        age
    }
}
console.log(b(name, age));

참고 :
Object
객체의 생성
[Javascript]Object.create() & ES6