[JS] Object

2022. 5. 2. 22:03

1. Object

  • JavaScript의 거의 모든 객체는 Object의 인스턴스
  • key-value 쌍으로 구성된 프로퍼티 여러개 넣을 수 있으며 key에는 문자형, value에는 모든 자료형 가능

 

2. 사용법

2.1 Object 선언

let obj = new Object();	// 객체 생성자
let obj = {};	// 객체 리터럴

 

2.2 리터럴과 프로퍼티

let obj = {
    fruit : "lemon",
    price : 700
    "allow discount" : false
};

// 프로퍼티 읽기
console.log(obj.fruit);	// lemon
console.log(obj.price);	// 700

// 프로퍼티 추가
obj.isOrganic = true;

// 프로퍼티 삭제
delete obj.price;

 

2.3 대괄호 표기법

// 문법 에러 발생
obj.allow discount = true;

// 설정
obj["allow discount"] = true;

// 읽기
console.log(obj["allow discount"]);	// true

// 삭제
delete obj["allow discount"];

// 변수로 접근해서 읽기
let key = "fruit";
console.log(obj[key]);	// lemon
console.log(obj.key) // undefined

 

2.4 계산된 프로퍼티

let fruit = prompt("5개 구매할 과일?", "apple");

let obj1 = {
	[fruit] : "5",	// 변수 fruit에서 프로퍼티 이름을 동적으로 받아옴
};

console.log(obj1.apple);	// 5

let obj2 = {
	["pine" + fruit] : 5
};

console.log(obj2.pineapple);	// 5

 

2.5 단축 프로퍼티

let obj = {
	fruit,	// fruit : fruit 과 같음
    price : 700
};

 

2.6 프로퍼티 존재여부 key로 확인

console.log("price" in obj);	// true
console.log("color" in obj);	// false

let key = "fruit";
console.log(key in obj);	// true

 

2.7 Object 탐색

let obj = {
    fruit : "lemon",
    price : 700
    isOrganic : false
};

// key와 value 출력
for(let key in obj) {
    console.log(key);	// fruit, price, isOrganic
    console.lof(obj[key]);	// lemon, 700, false
}

 

2.8 Object 정렬 방식

: key가 정수인 경우 오름차순 정렬, 정수가 아닌 경우 작성된 순서대로 프로퍼티 나열.

let codes = {
  "49": "독일",
  "41": "스위스",
  "44": "영국",
  // ..,
  "1": "미국"
};

// key가 정수이므로 오름차순 정렬되어 출력
for (let code in codes) {
  console.log(code); // 1, 41, 44, 49
}

// 정수로 취급되지 않도록 "+"추가하여 설정
let codes2 = {
  "+49": "독일",
  "+41": "스위스",
  "+44": "영국",
  // ..,
  "+1": "미국"
};

for (let code in codes2) {
  console.log(+code); // 49, 41, 44, 1
}

 

 

 

참고 :  https://ko.javascript.info/object

+ Recent posts