javascript - object

자바스크립트는 객체(object) 기반의 스크립트 언어이며, 원시 타입(Primitives)을 제외한 나머지 값들(함수, 배열, 정규표현식 등)은 모두 객체이다.
키(key)과 값(value)으로 구성된 프로퍼티(Property)들의 집합이다.

객체는 new Object() 'object constructor' 문법 또는 {} 'object literal' 문법을 사용하여 만들 수 있다.

Property value shorthand

const person1 = {name: 'jihun', age: 28};
const person2 = {name: 'changhan', age: 23};
const person3 = {name: 'taenam', age: 21};

만약에, 다음과 같이 person1부터 3까지 object들이 있다.

person4라는 새로운 object를 만들 때,

일일히 작성하는 번거로움을 줄일 수 있으려면?

 

const person1 = {name: 'jihun', age: 28};
const person2 = {name: 'changhan', age: 23};
const person3 = {name: 'taenam', age: 21};

const person4 = makePerson("taeckseong", 29);

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

key와 value 값이 같다면 생략할 수 있다.

const person1 = {name: 'jihun', age: 28};
const person2 = {name: 'changhan', age: 23};
const person3 = {name: 'taenam', age: 21};

const person4 = makePerson("taeckseong", 29);

console.log(person4); //{name: "taeckseong", age: 29}

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

Constructor function

다른 계산을 하지않고, 순수하게 object를 생성하는 함수들은 class에 constructor과 비슷하다.

const person1 = {name: 'jihun', age: 28};
const person2 = {name: 'changhan', age: 23};
const person3 = {name: 'taenam', age: 21};

const person4 = new Person("taeckseong", 29);

console.log(person4); //{name: "taeckseong", age: 29}

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

 

for..in vs for..of

// for (key in obj)
// for문을 돌때마다, key라는 지역변수에 할당이 된다.
const taenam = { name: 'taenam', age: 29, nowWorking:true };
for (key in taenam) {
  console.log(key);
    // name
    // age
    // nowWorking
}

// for (value of iterable)
// array같은 배열 리스트를 돌때 쓰인다.
const array = [1,2,3,4,5];
for(value of array){
  console.log(value);
  // 1
  // 2
  // 3
  // 4
  // 5
}

cloning

const user = { name: 'taenam', age: 29};
const user2 = user;
user2.name = 'jihun';
console.log(user); // {name: 'jihun', age:29}

user2에도 동일한 ref가 들어있고, 똑같은 object를 가르키고 있기 때문에 user의 name도 'jihun'으로 변경된다.

object를 복제할 수 있는 방법 2가지

const user = { name: 'taenam', age: 29};
const user2 = user;

// old
const user3 = {};
for (key in user) {
  user3[key] = user[key];
}
console.log(user3); // {name: "taenam", age: 29}

// new: Object.assign
const user4 = Object.assign({}, user);

console.log(user4) // {name: "taenam", age: 29}

 

출처: www.youtube.com/watch?v=1Lbr29tzAA8&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=7