4. 객체 : 기본

도비김·2024년 3월 10일
0

JS

목록 보기
5/5

객체

객체는 중괄호 {...}를 이용해 만들 수 있다. '키(key):값(value)'쌍으로 구성된 프로퍼티(property)를 여러개 넣을수 있고, 키엔 문장형, 값엔 모든 자료형이 허용된다. 점 표기법(dot notation)으로 프로퍼티 값을 읽을 수 있고, 프로퍼티를 추가 삭제할 수 있다.

let user = new Object(); // '객체 생성자' 문법
let user = {}; // '객체 리터럴' 문법 
const user = {}; // 'const'로 선언된 객체도 수정 가능 값은 고정하지만 내용은 고정하지 않음.

let user = {
  name: "John",
  age: 30, // 'trailing', 'hanging' 쉼표로 보기 편하게 정렬
  "likes birds": true  // 복수의 단어는 따옴표로 묶는다.
};

delete user.age; // delete 연산자로 프로퍼티 삭제

점표기법은 키가 유효한 변수 식별자인 경우에만 사용 가능. 유효한 변수 식별자엔 공백이 없어야 한다. 유효한 변수 식별자가 아닌 경우엔 점 표기법 대신에 대괄호 표기법을 사용한다.

let user = {};
// set
user["likes birds"] = true;
// get
alert(user["likes birds"]); // true
// delete
delete user["likes birds"];

let user = { // 대괄호 표기법은 평가 결과를 프로퍼티 키로 사용 가능
  name: "John",
  age: 30
};
let key = prompt("사용자의 어떤 정보를 얻고 싶으신가요?", "name");
// 변수로 접근
alert( user[key] ); // John (프롬프트 창에 "name"을 입력한 경우)

계산된 프로퍼티

let fruit = prompt("어떤 과일을 구매하시겠습니까?", "apple");
let bag = {
  [fruit]: 5, // 객체 리터럴 안에 프로퍼티 키가 대괄호로 둘러 쌓인 경우, 계산된 프로퍼티로 변수 fruit에서 프로퍼티 이름을 동적으로 받아 온다.
};
alert( bag.apple ); // fruit에 "apple"이 할당되었다면, 5 출력

let fruit = prompt("어떤 과일을 구매하시겠습니까?", "apple");
let bag = {};
// 변수 fruit을 사용해 프로퍼티 이름을 만들었습니다.
bag[fruit] = 5;

let fruit = 'apple';
let bag = {
  [fruit + 'Computers']: 5 // bag.appleComputers = 5
}

프로퍼티 이름 제약사항

  • 예약어 사용 안됨
  • __proto__라는 특별한 존재가 있다.

프로퍼티 존재 여부 확인

js는 존재하지 않는 프로퍼티 접근 시 undefined를 반환한다.
연산자 in을 활용해 프로퍼티 존재를 확인할 수 있다.

"=== undefined" // 가 실패할수 있으므로
"key" in object // 를 사용하자 (true || false)

'for...in' 반복문

for (key in object) {
  // 객체의 모든 키를 순회할 수 있다. 각 프로퍼티 키(key)를 이용하여 본문(body) 실행.
}

프로퍼티 정렬

  • 정수 프로퍼티 : 자동 정렬
  • 그 외 : 추가한 순서대로

참조에 의한 객체 복사

profile
To Infinity, and Beyond!

0개의 댓글