코드로보시죠
[JavaScript-25] 객체(object), 프로퍼티란? 본문
객체란, 키와 밸류쌍 여러 개를 묶어놓은 데이터 타입입니다.
코드로 보시죠
let myObject = {
name: 'lee',
age: 55
}
자, myObject가 바로 객체입니다. 영어로는 오브젝트라고 부르는데요.
우리가 지금까지 배웠던 변수들을 생각해보면,
하나의 변수는 숫자, 문자열, 불린, null 등등, 하나의 값만 갖고 있었습니다.
그런데, 세상을 살아가다 보면, 하나의 데이터에 대해 여러가지 설명을 붙여주고 싶은 경우가 있을 수 있죠?
예를 들어, 필자인 저라는 사람에 대한 정보를 저장하는 변수를 만든다 치면,
이름, 나이, 성별 등등.. 여러 정보를 하나의 변수에 저장하고 싶은 상황이 생길 수 있다는 거죠.
이럴 때, 객체를 사용해서 하나의 변수에 여러 값을 지정해줄 수 있어요.
객체는 중괄호를 이용해서 작성합니다.
중괄호 안에 데이터들을 넣어줄건데, 데이터들이 많아지면, 이게 뭘 의미하는지 알기 어려울 수 있어요.
그래서, 데이터마다, 앞에 무슨 데이터인지 설명을 써주고, 콜론을 찍고 그에 해당하는 데이터를 넣어줍니다!
위의 코드 예시에서는, name: 'lee'가 있네요!
여긴, 이름을 의미하는 데이터고, 실제 데이터는 lee야! 라는 의미죠.
여기서, 콜론 앞을 우리는 key라고 부르고, lee를 value라고 불러요!
그래서, 이렇게 키와 밸류 한 쌍을 프로퍼티라고 부릅니다!
객체는 프로퍼티들의 집합인 것이죠!
각 프로퍼티는 중괄호 속에서 콤마로 구분해서 써주면 됩니다!
let myCar = {
'brand': 'benz',
'model': 'E300',
'purchase-year': 2022
}
자, 이번엔 3개의 프로퍼티를 가진 자동차 객체를 만들어 봤는데요!
key들을 보시면, 맨 처음의 코드와 달리 key들이 따옴표로 둘러싸여 있죠?
원래 key는 모두 문자열이기에, 따옴표를 써줘야 합니다.
근데, 생략하더라도 에러가 나지 않는데, 그 이유는 자바스크립트가 알아서 문자열로 인식해주기 때문입니다.
그런데, 따옴표를 생략하고 쓸 경우, 하이픈과 띄어쓰기를 key이름에 절대 사용할 수 없어요.
그래서, key이름에 띄어쓰기나 하이픈을 넣어야 한다면, 따옴표를 사용해주세요!
마지막으로, 객체 하나만 더 만들어볼게요!
코드로 보시죠.
let myGirlFriend = {
name: 'kim',
age: 25,
major: {
main: 'english',
minor: 'software'
}
}
이렇게, value자리에 객체를 다시 넣어줄 수도 있답니다~
앞으로, 객체에 대한 포스팅을 더 해보도록 할게요.
지금은 딱 객체와 프로퍼티가 뭐고, 어떻게 만드는지만 알아보았습니다~
'[JavaScript] 코드잇과 함께!' 카테고리의 다른 글
[JavaScript-27] 객체 데이터 수정, 추가, 삭제 (0) | 2023.09.28 |
---|---|
[JavaScript-26] 객체의 데이터 접근하기 (0) | 2023.09.28 |
[JavaScript-24] for, while문의 변수의 scope (0) | 2023.09.28 |
[JavaScript-22] while반복문의 모든 것 (0) | 2023.09.28 |
[JavaScript-21] for문의 모든 것 (0) | 2023.09.27 |