이번에는 객체(Object) 에 대해서 다루어보도록 하겠습니다.
객체는 하나의 데이터만 담을 수 있는 원시형(primitive type) 의 자료형과 달리, 여러 타입을 키(key) 와 값(value) 의 형태로 담을 수 있는 자바스크립트의 자료형입니다.
따라서, 이러한 객체의 기본을 지금부터 알아보도록 합시다.
1. 객체 선언
객체는 두가지의 방법으로 선언될 수 있습니다. 하나는 객체 생성자를 이용하는 방법이고, 나머지 하나는 객체 리터럴을 이용하는 방법입니다.
let obj1 = new Object(); // 객체 생성자
let obj2 = {}; // 객체 리터럴
선언 방식만 다를뿐 obj1과 obj2는 똑같은 객체입니다. 보통은 객체 리터럴 방식으로 많이 선언하지만, 원하는 방식을 사용하시면 됩니다.
2. 객체 값 다루기
리터럴 방식으로 선언한 객체는 아래와 같이 선언과 동시에 값을 설정할 수 있습니다.
let obj = {
a : 1,
b : "hello"
}
키(key) : 값(value) 형태로 데이터를 지정해주며, 값에는 모든 자료형을 넣을 수 있습니다.
let key = "moonsung"
let obj = {
"hello world" : 1,
[key] : 2 // "moonsung" : 2
}
위와 같이 따옴표를 이용해서 특수문자나 띄어쓰기가 있는 문자열도 키로 설정할 수 있으며, 특정 변수의 값을 동적으로 설정할 수도 있습니다.
let obj = {}
obj.moonsung = 1;
obj["moon sung"] = 2;
console.log(obj.moonsung); // 1
console.log(obj["moon sung"]); // 2
값을 추가할때에는 점(.) 표기법을 이용해 추가하거나, 특수문자나 띄어쓰기가 들어가는 문자열의 경우에는 대괄호([]) 표기법을 이용하여 추가할 수 있습니다.
이는 값을 읽어올때에도 마찬가지입니다.
let name = "moonsung";
let age = 17;
let obj = {
name, // name : "moonsung"
age // age : 17
}
단축 프로퍼티을 이용하여 변수 이름을 키(key)로, 그에 해당하는 값을 값(value) 으로 한번에 설정할 수도 있습니다. 참 유용하죠?
let obj = {
a : 1
}
delete obj.a;
객체 속 값을 지울때에는 delete 문을 이용하여 자울 수 있습니다. delete문도 점 표기법과 대괄효 표기법을 둘 다 사용하여 지울 수 있습니다.
3. 객체 값 유무
객체에 특정 값이 존재하는지 확인하기 위해서는 in 구문을 이용해서 확인할 수 있습니다.
let obj = {
a : 1
}
console.log("a" in obj); // true
console.log("b" in obj); // false
정확히 말하면, 객체 속에 특정 키가 존재하는지 확인하는 문법이며, true / false의 boolean 을 결과로 내보냅니다.
let obj = {
a : 1,
b : 2
}
for(let key in obj) {
console.log(key)
}
// a
// b
이를 응용하여, 객체의 키 값들을 반복문을 통해 불러올 수도 있습니다.
이렇게 객체의 기본에 대해 전체적으로 다루어보았는데, 다음 글에서도 이어서 객체에 관하여 다루어 볼 예정이니 많은 관심 부탁드립니다!
'프로그래밍 > JavaScript' 카테고리의 다른 글
[JavaScript Core] new 연산자와 생성자 함수에 대해 알아보자 (0) | 2023.10.31 |
---|---|
[JavaScript Core] this 키워드에 대해 알아보자 (0) | 2023.10.29 |
[JavaScript Core] 객체의 얇은 복사(Shallow Copy) 와 깊은 복사(Deep Copy) 에 대해서 알아보자 (0) | 2023.10.26 |
[JavaScript Core] 논리 연산자(||, &&, !) 와 nullish 병합 연산자(??) 에 대해서 알아보자 (0) | 2023.10.24 |
[JavaScript Core] 엄격 모드, "use strict" 에 대해서 알아보자 (0) | 2023.10.23 |