[JavaScript] Object

자바스크립트의 데이터 타입에는 기본형과 참조형으로 나뉘어져 있다.
기본타입에는 변수하나당 값을 하나만 담을 수 있다.
하지만 Object 의 경우에는 여러개의 값을 넣을 수 있어 간편하게 데이터를 관리할 수 있다.

Object를 생성하는 방법에는 두가지가 있다.

const obj1 = {};	// Object 리터럴 방식
const obj2 = new Object(); // Object 생성자

Object는 { 키(key)와 값(value) }의 집합체이다.

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

const dev = { name : 'seungit', age : 20 };
print(dev);

Object 내부의 데이터에 접근 시에는 다음과 같이 사용할 수 있다.

console.log(dev.name);		// seungit	 점으로 접근하는 방법
console.log(dev['age']);	// 20 	대괄호를 통해서 접근, String 타입으로 지정해야한다.

function printValue(obj, key) {
    console.log(obj[key]);  // 키값을 받아서 출력해야하는 함수의 경우
}
printValue(dev, 'name');	// seungit
printValue(dev, 'age');		// 20

Object를 여러개 만들어야 할 경우에는 다음과 같이 활용할 수 있다.

const person1 = { name : 'seungit1', age : 21 };
const person2 = { name : 'seungit2', age : 22 };
const person3 = { name : 'seungit3', age : 23 };
const person4 = makePerson('seungit4', 24);

console.log(person4); // { name : 'seungit4', age : 24 }

function makePerson(name, age) {
	return {
      	// key와 value가 같다면 생략하여 사용 가능하다.
    	name : name,	// name,
      	age : age,		// age,
    };
}

생성자 함수를 이용한 방법. Object가 자동으로 생성됨.

const person1 = { name : 'seungit1', age : 21 };
const person2 = { name : 'seungit2', age : 22 };
const person3 = { name : 'seungit3', age : 23 };
const person4 = new Person('seungit4', 24);

console.log(person4); // { name : 'seungit4', age : 24 }

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

Object 내부의 key 값 존재유무를 확인하는 방법. in 을 활용

console.log('name' in dev);	// true
console.log('age' in dev);	// true
console.log('address' in dev);	// false
// 정의되지 않은 키에 접근시
console.log(dev.address);	// undefined

Object 의 assign 을 활용해서 복사하기.

//ex1
const target = { a: 1};
const source = { a: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// Expected output: Object { a: 4, c: 5 }
console.log(source);
// Expected output: Object { a: 4, c: 5 }
console.log(source == target);
// Expected output: false				...??
console.log(source === target);
// Expected output: false				...??
console.log(returnedTarget === target);
// Expected output: true
console.log(returnedTarget === source);
// Expected output: false

// ex2
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

---

참고
유튜브