JavaScript&TypeScript

[JS] Object (객체) 1

백단비 2024. 5. 17. 08:40

Object 

 

🌀 객체(object)는 키(key)와 값(value)콜론(:)으로 구분하는 속성(property)들의 집합

let obj = {
  key: value, // 키와 값을 묶어서 프로퍼티라 함
  // property name : property value
}

 

🛑 키는 일반적으로 따옴표 생략 후 작성하는데 주의 사항이 있음

➡ 첫 번째 글자는 반드시 문자, 밑줄(_), 달러 기호($) 중 하나로 시작

➡ 띄어쓰지 금지

➡ 하이픈(-) 금지

⚠  일반적으로 좀 더 간편한 점 표기법을 더 많이 사용하긴 하지만, 프로퍼티 네임에 띄어쓰기가 있을 경우에는 반드시 따옴표를 붙여서 문자열이라는 것을 명시해 주어야 하고, 대괄호 표기법으로만 접근이 가능하다는 점은 주의

 

 

🌀 객체 안에 있는 프로퍼티들은 쉼표(,)로 구분해야 함

let obj = {
  key: value,
  key: value,
  key: value,
  key: value
}

 

 

🌀 객체 안의 프로퍼티는 key를 이용해 점 표기법이나 대괄호 표기법으로 접근 가능

let obj = {
 name: "bidanee",
 age: 10
}

//점 표기법 => obj.key 
//대괄호 표기법 => obj["key"]

console.log(obj.name) // bidanee
console.log(obj["age"] // 10

 

➡  점 표기법은 그냥 key의 이름을 적으면 되는데 대괄호 표기법은 문자열로 적어줘야 함("", '',``)

➡  존재하지 않은 property에 접근 시 error가 아닌 undefined가 나옴

 

 

🌀property 추가, 변경, 삭제

let obj = {
 title: "객체",
 writer: "bidanee"
}

// 추가
obj.comment = "hi"
console.log(obj) //{title: '객체', writer: 'bidanee', comment: 'hi'}

// 변경
obj.writer = "bidan"
console.log(obj) //{title: '객체', writer: 'bidan', comment: 'hi'}

// 삭제
delete obj.title
console.log(obj) //{writer: 'bidan', comment: 'hi'}

 

➡ 추가 : 없는 property name에 점 표기법이나 대괄호 표기법을 사용해서 넣어줌

➡ 변경 : 있는 property name에 점 표기법이나 대괄호 표기법을 사용해서 값을 변경해 주면 됨

➡ 삭제 : delete 키워드 다음에 점 표기법이나 대괄호 표기법을 사용해서 프로퍼티에 접근하면 해당 프로퍼티가 삭제됨

320x100

'JavaScript&TypeScript' 카테고리의 다른 글

[JS] Object (객체) 2  (0) 2024.05.26
[TS] Interface (인터페이스)  (0) 2024.05.08
TypeScript의 기본 타입  (0) 2023.09.20
TypeScript란?  (0) 2023.09.06
JS) type  (0) 2023.04.21