Object

Subin Ryu·2024년 8월 27일

Object

  • 자바스크립트의 데이터 타입 중 하나
  • key와 value의 집합체 {key:value}

- Object를 만드는 방법

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

- javascript에서 가능한 object 기능: 추가, 삭제

const lucas = {name: 'lucas', age: 8};
lucas.job = 'deginer';
console.log(lucas.job); // deginer
delete lucas.job;
console.log(lucas.job); // undefined

- 속성 출력 방법

console.log(lucas.name); // lucas 정확하게 key를 알 때
console.log(lucas['name']); // lucas 정확하게 key를 모를 때 사용 
function printValue(obj, key){
  console.lof(obj[key]); // obj.key 사용 못함, 코드 작성시 key의 값을 모르기 때문
}
printValue(lucas,'name');// lucas
printValue(lucas,'age');// 8

- Property value shorthand

const person = makePErson('julie',14);
console.log(person); // {name: "julie", age: 14}
function makePerson(name, age){ // 클래스와 같은 기능, 클래스 없을 때 이렇게 사용했음
  return {
    name, // key와 value가 같다면 하나만 적어도 됨!name:name
    age,
  }
}

- 보통 함수로 클래스 만들때 (constructor Function이라고 함)

function Person(name, age){ // 이름 첫 글자는 대문자
  //
  this.name = name;
  this.age = age;
}

- 속성 존재 확인

console.log('name' in lucas); // true
console.log('age' in lucas); // true
console.log('salary' in lucas); // false

- object cloning(복제)

const user = {name:'julie', age: 7};
const user2 = user;
// 1. old way
const user3 = {}; // 빈 객체 만들기
for(key in user){ // 수동적으로 값 할당
  user3[key] = user[key];  
}
// 2. Object.assign(dest, [obj1, obj2, obj3...])
const user4 = {};
Object.assign(user4, user);
const user5 = Object.assign({}, user);
// another example
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
profile
개발블로그입니다.

0개의 댓글