[Javascript/자바스크립트] Day3 - 객체, 참조

1 .객체

 

[1] 자바스크립트의 8가지 자료형 중에서 7개는 오직 하나의 데이터만 담을 수 있는 '원시형'과

     다양한 데이터를 담을 수 있는 '객체형'이 있다

[2] 객체는 중괄호'{}' 를 이용해 만들 수 있고, 중괄호 안에는 '키(key): 값(value)'쌍으로 구성된 프로퍼티(property)를

     여러개 넣을 수 있는데, '키'에는 문자형, '값'에는 모든 자료형이 허용된다

[3] 객체를 만드는 2가지 방법

// '객체 생성자' 문법
let user = new Object();
// '객체 리터럴' 문법 -> 주로 사용
let user = {};

[4] 리터럴과 프로퍼티

let user = {
   name: "John",
   age : 30
};

// 프로퍼티 값 얻기
alert( user.name );	// John
alert( user.age );	// 30

[5]  상수객체는 수정 가능

const user = {
   name: "John"
};

user.name = "Pete";

alert(user.name);	// Pete

[6] 여러 단어를 조합해 프로터피 키를 생성하는 경우

// 생성 예1
let user = {
   "likes birds" : true
}

//생성 예2
let user = {};

// set
user["likes birds"] = true;
// get
alert (user["likes birds"]);	// true
// delete
delete user["likes birds"];

[6] 선언한 변수로 프로퍼티 이름을 생성할 때 '[]' 를 사용

let fruit = "apple";

let bag = {
    [fruit] : 5
};
alert( bag.apple )	// 5

[7] 단축 프로퍼티

function makeUser(name, age) {
   return {
      name,	// name: name과 같음
      age	// age : age와 같음
   }
}

[8] 프로퍼티 존재여부 확인

let user = {};

// '===' 로 확인
alert( user.noSuchProperty === undefined );	// true가 나오면 '존재하지않음'을 의미

// 'in'으로 확인
alert ( "noSuchProperty in user );

[9] for..in 반복문을 통해 객체의 키 순회

// 문법
for (key in object) {

}

// 예시
let user = {
   name: "mina",
   age: 30,
   inAdmin: true
};

for (let key in user) {
   // key
   alert(key);	// name, age, inAdmin
   // 키에 해당하는 값
   alery( user[key] );	// mina, 30, true
}

 

---

2. 참조에 의한 객체 복사

 

[1] 객체의 동작 방식

   : 변수엔 객체가 그대로 저장되는 것이 아니라, 객체가 저장되어있는 '메모리 주소'인 객체에 대한 '참조 값'이 저장됨.

     따라서, 객체가 할당된 변수를 복사할 땐 객체의 참조 값이 복사되고 객체는 복사되지 않습니다

let user = { name : 'John' };
let admin = user;

admin.name = 'Pete';	// 'admin' 참조값에 의해 변경됨
alert(user.name);	// Pete

 

[2] 참조에 의한 비교

   : 객체 비교시 동등 연산자 '=='와 일치 연산자 '===' 는 동일하게 '참'을 동작하지만,

    두 객체가 모두 비어있을 경우엔 독립된 개체이기 때문에 '거짓'을 반환

let a = {};
let b = a;	// 참조에 의한 복사

alert( a == b );	// true
alert( a === b );	// true

====================================
let a = {};
let b = {};	// 독립된 두 객체

alert( a == b );	// false

 

[3] 객체 복사

let user = {
   name : "herry",
   age: 30
};

let clone = {};	// 새로운 빈 객체

// 빈 객체에 user 프로퍼티 모두 복사하여 넣기
for (let key in user) {
   clone[key] = user[key];
}

clone.name = "Pete";
alery( user.name );	// John

 

[4] 객체 병합

// 문법
Object.assign(dest, [src1, src2, src3, ...])

// 병합 예시
let user = {
   name: "John"
};

let permissions1 = { canView : true };
let permissions2 = { canEdit : true };

// permission1,permission2의 property를 user로 복사
Object.assign(user, permissions1, permissions2);

// now user = { name : "John", canView : true, canEdit : true }

 

[5] 중첩 객체 복사

let user = {
   name : "John",
   sizes : {
       height: 182,
       width: 50
   }
};

alert( user.sizes.height );	// 182


============================================
let user = {
   name: "John",
   sizes: {
      height: 182,
      width: 50
   }
};

let clone = Object.assign({}, user);	// clone 객체에 User의 모든 프로퍼티 복사

user.sizes.width++;
alert(clone.sizes.width);	// 51