---

🕖 DAY +12 / 2022. 11. 04

SEB FE / Section1 / Unit9 / JavaScript 배열, 객체

---

📌 Today I Learned

• 객체(Object)

💬 객체

하나의 변수 안에 여러 가지의 정보가 담겨져 있을 때 적합한 자료 구조
객체 선언을 아래와 같이 할 수 있다
객체는 키와 값 쌍(key-value pair)으로 이루어져 있다

let user = {
	firstName: 'meoing',
    lastName: 'choi',
    email: 'meoing@velog.com',
    city: 'Seoul'
};

💬 객체의 값 사용하기

객체의 사용 방법은 두 가지가 있다.

📂 Dot notation

• .은 개체의 속성을 가져오는 것 (유저의 속성)

let user = {
	firstName: 'meoing',
    lastName: 'choi',
    email: 'meoing@velog.com',
    city: 'Seoul'
};

user.firstName;
// 'meoing'

user.city;
// 'Seoul'

📂 Bracket notation

동적인 값을 할당할 때 사용한다.
키값이 동적으로 변할 때, 키값이 변수일 때 Bracket notation을 쓴다.

let user = {
	firstName: 'meoing',
    lastName: 'choi',
    email: 'meoing@velog.com',
    city: 'Seoul'
};

user['firstName'];
// 'meoing'

user['city']
// 'Seoul'

📂 예제

let tweet = {
	writer: 'monge',
    createdAt: '2022-11-03 20:38:33',
    content: '배가 부르다!'
}

// monge라는 아이디를 가진 유저가 SNS에 새로운 글을 올렸다. 
// 그가 작성한 글 "배가 부르다!"라는 내용을 bracket notation으로 어떻게 가져올 수 있을까?

/* dot notation */
tweet.writer
// "monge"
tweet.content
// "배가 부르다!"

/* braket notation */
tweet['writer'];
// "monge"
tweet['content'];
// "배가 부르다!"

💬 개념학습

tweet['content']
// "배가 부르다!"
// 키-값을 가져온다

tweet[content]
// ReferenceError: content is not defined
// ''를 걷어내니 키-값이 아니라 변수의 값으로 인식 중

// 객체에 항상 문자열로 넘겨 주거나 변수에 할당하여 사용해야 한다.

let person = {
	name: 'meoing',
    age: 20
};

function getProperty(obj, propoertyName) {
	return obj[propoertyName];
}

// 1
let output = getProperty(person, 'name');
console.log(output); // --> 'meoing'

// 2
let output2 = getProperty(person, 'age');
console.log(output2); // --> '20'

//

📂 객체 안 값 추가

tweet['category'] = '잡담';
tweet.isPublic = true;
tweet.tags = ['#트윗', '#데일리'];

📂 객체 안 값 삭제

let tweet = {
	writer: 'monge',
    createdAt: '2022-11-03 20:38:33',
    content: '배가 부르다!'
}

// createdAt 키-값 쌍을 지운다
delete tweet.createdAt;

// tweet은 다음과 같게 된다
// { writer: 'monge', content: '배가 부르다!'

📂 in 연산자

객체 안에 해당 키-값이 있는지 확인하여 불리언 값을 반환하는 연산자이다.

let tweet = {
	writer: 'monge',
    createdAt: '2022-11-03 20:38:33',
    content: '배가 부르다!'
}

'content' in tweet;
// true

'updatedAt' in tweet;
// false