728x90
1. 객체(Object)
배열에서는 아이템에 대한 식별자(인덱스)로는 숫자를 사용했습니다.
그렇기 때문에 인덱스를 사용해서 데이터에 접근할 수가 있었습니다. 그러나 숫자가 아닌 문자를 사용하기 위해서는
객체를 사용해야 합니다.
JavaScript에서는 Dictionary라는 타입이 존재하지 않기 때문에 객체를 Dictionary 식으로 활용을 합니다.
Dictionary는 key, value의 묶음으로 저장하게 되는데 배열이나 리스트에서 인덱스로 접근하는 것과 다르게 key값을 이용해서 데이터에 접근하기 때문에 원하는 값을 빠르게 찾을 수 있다는 장점이 있습니다.
객체 생성
var obj = {}
객체는 중괄호{}로 생성할 수 있습니다.
var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};
위 코드에서 보듯이 인덱스로 문자를 사용했습니다.
- key : egoing
- value : 10
var dictObject = {}
dictObject['banana'] = '바나나';
dictObject['hong'] = '홍';
dictObject['monkey'] = '원숭이';
console.log(dictObject) // 결과 : Object {banana: "바나나", hong: "홍", monkey: "원숭이"}
객체(Dictionary) 출력
for (var key in dictObject) {
console.log("key : " + key +", value : " + dictObject[key]);
}
// 결과 :
key : banana, value : 바나나
key : hong, value : 홍
key : monkey, value : 원숭이
객체(Dictionary) 추가,삭제
key 값과 value 값을 지정하여 객체를 추가할 수 있으며 delete를 사용하여 객체를 사용할 수 도 있습니다.
객체를 삭제할 때 정상적으로 삭제되면 true 아니면 false가 반환됩니다.
dictObject['elephant'] = '코끼리';
console.log(Object.keys(dictObject)); // 결과 : ['banana', 'hong', 'monkey', 'elephant']
delete dictObject['elephant']; // 결과 : true
console.log(Object.keys(dictObject)); // 결과 : ['banana', 'hong', 'monkey']
객체(Dictionary) 추가, 삭제
console.log(Object.keys(dictObject).length); // 결과 : 3
객체(Dictionary) 추가, 삭제
객체에는 숫자나 문자와 같은 데이터뿐 아니라 객체와 심지어 함수까지 담을 수 있습니다.
var grades = {
'list': {'a': 10, 'b': 6, 'c': 2},
'show' : function(){
let cal = grades['list']['a'] + grades['list']['b'] * grades['list']['c']
console.log(cal);
}
};
console.log(grades['list']['test1']);
console.log(grades['show']()); // 결과 : 22
객체(Dictionary) 추가, 삭제
객체에 담아서 사용하다보면 key값들만 뽑아서 사용하거나 value값들을 뽑아서 사용해야하는 경우가 있습니다.
배열을 반복문을 돌려서 하나씩 뽑아서 사용하는 방법도 있지만 JS에서 제공하는 Object.values() 라는 메서드를 사용하면 간편하게 사용이 가능합니다.
/*숫자로 이루어진 객체*/
var obj = {
a: 1,
b: 2,
c: 3
};
console.log(Object.values(obj)); // 결과 : [1, 2, 3]
/*여러 값으로 이루어진 객체*/
var obj = {
a: {a : '1'},
b: 2,
c: true,
d: 'is d'
};
console.log(Object.values(obj));
// 결과 :
[{a: '1'}, 2 ,true, 'is d']
'Language > JavaScript' 카테고리의 다른 글
[JavaScript] repeat() 메서드 알아보기 (0) | 2024.02.19 |
---|---|
[JavaScript] Array every(), some() 함수 알아보기 (0) | 2024.02.12 |
(JavaScript) 문자열을 여러조건으로 나누기 (0) | 2024.02.09 |
[JavaScript] 이스케이프 문자 처리 / 백틱(Backtick) (0) | 2024.01.28 |
[JavaScript] 구조 분해 할당(destructuring assignment) (0) | 2024.01.26 |