객체 (중요함)

key - value 는 pair
하나의 변수에 여러개의 값을 넣을 수 있다.

1. 객체 생성 방법

1-1. 기본적인 객체 생성 방법

let person = {
    name: "홍길동",
    age: 30,
    gender: "남자",
};

객체 안에 있는 key 와 value 를 볼수 있다.

1-2. 생성자 함수를 이용한 객체 생성 방법

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

let Person1 = new Person("홍길동", 30, "남자");
let Person2 = new Person("홍길순", 20, "여자");

함수를 이용한 방법이다. 이러한 방법도 있으니 참고하면 좋을거 같다.

2. 객체 메소드 (Object.~~~)

2-1. keys

let person2 = {
    name: "홍길동",
    age: 30,
    gender: "남자",
};

let keys = Object.keys(person2);
console.log(keys);

말 그대로 객체안에 있는 key들을 가져오는 역할을 한다.

[ 'name', 'age', 'gender' ]

key를 가져온것을 볼수 있다.

2-2. values

let person2 = {
    name: "홍길동",
    age: 30,
    gender: "남자",
};

let values = Object.values(person2);
console.log(values);

[ '홍길동', 30, '남자' ]

key 와 반대로 이번에는 values를 가져 온것을 볼수 있다.

2-3. entries

key와 value를 묶어서 배열로 만든 배열이다.

let person2 = {
    name: "홍길동",
    age: 30,
    gender: "남자",
};

let entries = Object.entries(person2);
console.log(entries);

[ [ 'name', '홍길동' ], [ 'age', 30 ], [ 'gender', '남자' ] 
]

각 key와 value를 묶어서 배열로 보여준다.

2-4. assign

객체를 복사 한다고 쉽게 생각했다.

let person2 = {
    name: "홍길동",
    age: 30,
    gender: "남자",
};

let newperson = {};
Object.assign(newperson, person2, {age:31});
console.log(newperson);

복사도 가능하지만 객체 안에 있는 value 값을 변경 하고 싶을경우 변경도 쉽게 할수 있다.

{ name: '홍길동', age: 31, gender: '남자' }

age를 변경 후 나오는 값을 확인 할수 있다.

2-5. 객체 비교

let person3 = {
    name: "홍길동",
    age: 30,
    gender: "남자",
}

let person4 = {
    name: "홍길동",
    age: 30,
    gender: "남자",
}

눈으로 볼때는 같은 key와 value를 가지고 있어서 같은 것이 아닌가 라고 생각 했다.

console.log(person3 === person4);

false

하지만 콘솔로 확인해보니 같은 값이 아님을 확인 할수 있었다.
이유는 각각의 변수의 주소가 다르기 때문인데
비교를 하려면 JSON.stringify 을 사용 할수 있겠다.
간단하게 주소값으로 되어 있던 것을 문자열화 시킨다 라고 이해했다.

console.log(JSON.stringify(person3) === JSON.stringify(person4));

true

손쉽게 확인할수 있었다.

2-6. 객체 병합

let person5 = {
    name: "홍길동",
    age: 30,
}

let person6 = {
    gender: "남자",
}

let perfectman = {...person5, ...person6};
console.log(perfectman);

두개의 객체를 합치는 방법인데 먼저 key와 value를 풀어주는 spread operator 를 사용 하면,

{ name: '홍길동', age: 30, gender: '남자' }

쉽게 병합 시킨 결과값을 확인 할수 있다.

마무리

TIL을 작성하면서 문법을 다시 복습하는 시간을 가졋는데 무작정 외울려고 하는 것 보다는 수학문제 풀듯이 계속 계속 작성하고 써보는 편이 기억이 잘 되는것 같다.
수업에서 알고리즘코드카타도 실시 했는데 처음 접해보는 거라 아는 문제였는데도 불구하고 조금 얼탄거 같아서 내일은 집중해서 풀어볼 예정이다.