오브젝트(object)

오브젝트

// 1. Literals and properties
const obj1 = {}; // 'object literal' syntax
const obj2 = new Object(); // 'object constructor' syntax

function print(person) {
  console.log(person.Name);
  console.log(person.age);
}
// 객체가 아니었다면 모든 인자를 일일히 받아야 했을 것이다.
const ellie = { name: "ellie", age: 4 };
print(ellie);

ellie.hasJob = true; //뒤늦게 추가
console.log(ellie.hasJob);
delete ellie.hasJob; //삭제도 가능하다
console.log(ellie.hasJob); //undefined

자바스크립트는 동적 타입 언어(dynamically typed language)임으로 런타임 때 타입이 결정되기 때문에 객체 선언 이후에 프로퍼티를 추가해줄 수 있다.

그러나 뒤늦게 프로퍼티를 추가하는 것은 유지보수적 측면에서 그다지 좋지 않다.

오브젝트는 key와 value의 집합체이다.

// 2. Computed properties
console.log(ellie.name);
console.log(ellie["name"]); // Computed properties 방식
console.log(ellie[name]); // key는 항상 string type이어야 한다.
ellie["hasJob"] = true; //뒤늦게 추가
console.log(ellie.hasJob);

function printValue(obj, key) {
  console.log(obj[key]);
}
printValue(ellie, "name"); //객체 ellie의 이름
printValue(ellie, "age"); //객체 ellie의 나이

보통은 .은 해당 값을 가져오고 싶을 때 사용하고, []은 원하는 키를 이용해서 처리할 때 런타임에서 결정되는 방법으로 key가 결정되지 않는 상황에서 사용한다.

// 3. Property value shorthand
const person1 = { name: "bob", age: 2 };
const person2 = { name: "steve", age: 3 };
const person3 = { name: "dave", age: 4 };
const person4 = new Person("tom", 30);
// const person4 = makePerson('tom', 30); //클래스 이전 방식
console.log(person4);

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

// 4. Constructor Function
function Person(name, age) {
  // this = {}; //기본으로 객체 생성
  this.name = name;
  this.age = age;
  // return this;
} // 자바스크립트 함수는 객체이다.

객체를 생성하는 방법으로 이전에는 함수를 이용했었다. 지금은 클래스 방법으로 생성할 수 있게 되었다.

// 6. for..in (객체) & for..of (배열)
console.clear(); // console log 지움

for (let key in ellie) {
  console.log(key); // 객체 ellie의 값을 모두 불러옴
}

const array = [1, 2, 3, 4];
for (let value of array) {
  console.log(value);
}

객체에서 for를 활용할 수 있다.

// 7. Fun cloning
const user = { name: "ellie", age: 20 };
const user2 = user; // user2는 user과 같은 곳을 바라본다.
// user2를 수정해도 user에 영향을 준다.

// 완전 복제하는 방법
// old way
const user3 = {};
for (let key in user) {
  user3[key] = user[key];
}
console.log(user3);
// new way
const user4 = Object.assign({}, user);
console.log(user4);

객체를 복사하는 방법이다. assign()은 인자로 객체를 받을 때, 새로운 프로퍼티면 새로 생성하지만 같은 이름의 프로퍼티가 있을 경우에는 덮어씌워짐을 주의해야한다.