본문 바로가기
카테고리 없음

[JavaScript ] Object에 대해 알아보자

by Tamii 2021. 3. 10.
반응형

object 

key 와 value 의 집합

object 정의하는 2가지 방법

const obj1 = {}; // object literal
const obj2= new Object(); // object constructor

1) literal  2)constructor

 

 

javascript 다이나믹 타입 언어: 동적으로 Runtime 일때 결정되는 언어

뒤늦게 property 추가/삭제  가능 

function print(person){
    console.log(person.name);
    console.log(person.age);
}


const tami = { name: 'tami', ate: 25}
tami.hasJob = false; //뒤늦게 추가 
delete tami.hasJob; //뒤늦게 삭제

 

 

computed properties 

동적으로 Key 이

[ 'key']  key는 문자형으로 넣어야 함 

// 1)dot 
console.log(tami.name); //tami

// 2) computed properties
console.log(tami['name']);  //tami

1) 코딩하는 순간 key 에 해당하느 ㄴ값을 쓸때

2) 정확히 어떤 key 가 필요한 지 모르고 runtime에서 결정될 때

 

ex) 

function printValue(obj,key) {
    console.log(obj[key]);
}

printValue(tami, 'name');

tami에 name이라는 key를 추가하며 출력 

 

 


 

Class  가 없을 때의 자바스크립트  

object 를 함수를 사용하여 반복을 줄이기 

const person1 = {name: 'bob', age:2};
const person2 = {name: 'steve', age:3};
const person3 = {name: 'sandy', age:4};


function makePerson(name, age) {
    return {
        name, //name: name,
        age,//age: age,
    };
}

const person4 = makePerson('tami',25);
console.log(person4);

makePerson

 : 순수하게 object를 생성하는 함수 

=> Person 대문자 

=> Return 지우고 this로 설정 

 

constructor function

function Person(name, age) {
    //this={};
    this.name=name;
    this.age=age;
    // return this;
}

const person4 = new Person('tami',25);
console.log(person4);

 

 

 


for in  & for of

for(key in tami){
    console.log(key);
}


const array = [1,2,3,4];

for(value of array){
    console.log(value);
}

 

cloning

const user = {name:'tami',age:'25'};
const user2 = user;

user2.name = 'coder';
console.log(user);

user , user2는 같은 leference를 참조하기 때문에 user의 name 도 변경하게 됨 

 

object.assign

기본 탑재된 object중 하나

object 를 복사하여 새 object를 만드는 법

const user3 = {};

//old way
for(key in user){
    user3[key]=user[key];
}

//object.assign
const user4 = Object.assign({},user);
console.log(user4)

assign 사용 시 유의사항 

const fruit1 = {color:'red'};
const fruit2 = {color:'blue', size:'big'};

const mixed = Object.assign({},fruit1,fruit2);

console.log(mixed.color); // blue
console.log(mixed.size); // big

댓글