TIL 10 | 객체

배열에 이어서 객체의 기초를 배워 보았다.

Achievement Goals

1. 객체의 구조를 이해하고 언제, 어떻게 사용하는지 이해할 수 있다.
2. 객체 속성(property)의 추가, 조회, 변경, 삭제를 자유자재로 할 수 있다.
3. 객체 속성 조회법 두 가지, dot notation과 bracket notation의 차이를 이해한다.
4. 객체 실습 - 2의 tweet.content와 tweet['content']의 차이가 무엇인지 설명할 수 있다.
5. dot notation을 이용한 객체 할당 방식을 능숙하게 다룰 수 있다. obj.a = "hello"
6. 객체 속성 삭제를 위한 delete 키워드를 사용할 수 있다.
7. 객체를 위한 for문 for ... in 문을 이해하고 다룰 수 있다.

간단한 문제풀이

문제(1)
객체와 키, 값을 입력받아 키에 값을 할당해야 합니다.

입출력 예시

let steve = {};

// 보기의 코드를 여기에 입력하면, 아래의 결과가 나와야 합니다.
addPropertyAndValue(steve, 'isMale', true);

console.log(steve.isMale); // --> true

-->

function addPropertyAndValue(obj, property, value) {
   obj[property] = value;
}

• 입출력 예시를 보면 property는 string 형태로 들어온다는 것을 알 수 있습니다. 그렇기 때문에 함수 addPropertyAndValue가 호출될 때, obj[property] = value; 는 매개변수 property의 값을 key로 가지고, value는 매개변수 value의 값으로 가지는 속성이 할당된다.

문제(2)
객체의 모든 key를 콘솔에 출력하기 위한 방법?

function allKeys(obj) {
   for (let key in obj) {
    console.log(key)
  }
}

• 배열과 객체의 가장 큰 차이점은 순서의 유무이다. 배열은 요소에 0부터 순차적으로 접근할 수 있지만 객체는 속성에 순서대로 접근하지 않고, key를 통해서 value에 접근한다.

문제(3)
두 개의 객체를 입력받아 두 번째 객체의 속성들을 첫 번째 객체에 추가해야 합니다.

입출력 예시

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 4, c: 3 };

// 보기의 코드를 여기에 입력하면, 아래의 결과가 나와야 합니다.
extend(obj1, obj2);

console.log(obj1); // --> {a: 1, b: 2, c: 3}
console.log(obj2); // --> {b: 4, c: 3}

-->

function extend(obj1, obj2) {
   for (let key in obj2) {
    if (!(key in obj1)) {
      obj1[key] = obj2[key];
    }
  }
}

• 두 개의 객체를 입력받아 두 번째 객체의 속성들을 첫 번째 객체에 추가한다. 여기서 두 가지 조건이 생긴다.
• obj2에는 있는데 obj1에 없는 key가 있다면 obj2의 key의 value를 obj1의 key의 value에 할당한다.
• 만약에 obj1과 obj2에 중복으로 있는 key라면 key를 변경하지 않고 유지한다.