객체라고 하는 것은 key/value pair를 저장할 수 있는 구조이다.
const person = {
name : 'Damon woo',
age : 28,
'hobby' : ['Coding', 'running'],
'한국 고향' : '부산'
};
속성(key) 값에는 기본적으로 따옴표를 사용하지 않아도 되지만
'한국 고향'에 들어간 공백과 같이 식별자에 허용되지 않은 문자가 들어간 경우에는 속성이름을 정의할 때 반드시 따옴표를 사용해야 합니다.
이 경우의 속성이름을 사용할 때는 반드시 Bracket notation을 사용해야 합니다.
JavaScript 식별자는 문자,밑줄(-)혹은 달러 기호($)로 시작해야 하는 반면 이후는 숫자(0-9)일 수도 있습니다.
var myName = person.name; 혹은 var myName = person['name']
var myAge = person.age; 혹은 var myAge = person['age']
console.log(myName); // 'Damon woo'
console.log(myAge); // 28
person.age = 17; 혹은 person['age'] = 17;
console.log(myAge); // 13
- 객체 key/value 삭제하기
```js
delete.person.age;
console.log(person.age); // undefined (더 이상 존재하지 않는 key/value)
const sample = {
one: 1,
two: 2,
three: 3
};
for (let prop in sample) {
console.log(prop);
console.log(sample[prop]);
}
prop 변수에 in 연산자 뒤에 위치한 객체의 속성들이 하나씩 담깁니다.
첫 반복 때 prop 변수의 값은 'one', 두번째 'two' 세번째 'three'
sample[prop]을 이용하여 해당 키값의 value을 사용할수 있습니다.
- 개체의 key/value는 순서를 정의할 수 없습니다.
- for in loop의 순서는 임의로 정해집니다.
- for in 은 쉽게 객체의 속성을 (콘솔이나 다른 방법으로 출력)할 수 있기 때문에 실질적으로 디버깅을 위해 사용될 수 있습니다.
- 배열이 데이터의 저장에 있어서는 더 실용적이지만, 키-값 쌍이 선호되는 - 데이터의 경우(속성이 "key"역할을 함) 특정 값을 가진 키가 있는지 확인하려는 경우에 for...in을 사용할 수 있습니다.
const myself = 'Damon Woo';
function getAge () {
return 28;
}
const property = 'value'
const person = {
name: me,
age: getAge(),
[person] : 'value'
};
객체 리터럴을 이용해 속성을 지정할 때, 이미 정의된 변수나 함수를 value로 지정할 수도 있습니다.
대괄호를 사용해서 다른 변수에 저장된 문자열을 속성(key)의 이름으로 쓰는 것도 가능합니다.
const dog = {
greet: fuction() {
return '왈왈';
}
};
person.greet(); // '왈왈';
객체의 속성값으로 함수를 지정 할 수 있습니다, 어떤 객체의 속성으로 접근해서 사용하는 함수를 method라고 부릅니다.
const arr = [ 1, 2, 3 ];
console.log(arr[2]); // 3
console.log(arr.title); // undefined
arr.name = 'Velog';
console.log(arr.name); // 'Velog'
function foo (a, b) {
return a * b;
}
console.log(foo.title); // undefined
foo.title = '곱하기';
console.log(foo.title); // '곱하기'
console.log(foo(1, 2)); // 6
예제처럼 배열이나 함수 또한 객체의 한 종류이기 떄문에, 속성을 추가할 수 있습니다
하지만 일반적으로 그런 경우는 없고 주로 기본적으로 제공된 속성과 메소드를 사용합니다.