[JavaScript] Object 만들기
- Web/JavaScript
- 2023. 6. 1.
JavaScript, Object 만들기
Object 만들기
<script>
let obj = {
first : 'test'
}
console.log(obj);
obj['second'] = 'apple';
console.log(obj);
</script>
Object란, 하나의 변수 안에 여러 개의 값을 담는 것을 뜻 한다.
보통 Java에서 유명한 dataType은 String 혹은 int(number)가 있다. 이들은 각각 하나의 변수 안에 하나의 결괏값만 담고 있기에 가독성은 뛰어날 수는 있지만 변수명이 많아질수록 이들을 관리하는 것은 점차 힘들어짐과 동시에 데이터가 어디서 존재하는지 파악하기 조차 쉽지 않은 경우가 발생된다.
또한 데이터간의 그룹화가 존재할 수가 있는데, 기본 변수만으로 이를 표현하기란 변수명과 주석이 한계이므로 데이터의 공유 또한 문제가 생길 수가 있다.
이를 어느정도 최소화 할 수 있는 것이 Object이다.
보통 Key와 Value로 구성되어 있으며 변수 안에 Key를 저장하여 Key에 저장된 Value를 불러오는 방식을 이용한다.
이는 여러 사람이 은행에 돈을 맡기는 원리와 비슷하며 알맞는 Key가 아닐 경우 Value를 호출할 수는 없다.
해당 방법이 처음에는 어려울 수 있으나, JavaScript를 다룬다면 기본적으로 다뤄야 하는 문법 중 하나이다.
Object 생성하기
첫 번째 방법
let obj = {
first : 'test',
cafe : 'piu'
}
변수를 생성함과 동시에 내용을 저장하는 방식이다.좌측은 'key'를 의미하며, 우측은 'value'값을 뜻한다.
obj 라는 변수 안에는 first와 cafe라는 key가 생성되었다.
두 번째 방법
obj['second'] = 'apple';
변수명[key] = value;
배열을 다뤘다면 익숙한 방법 중 하나이다.
index 대신 key를 입력받았다.
보통 배열의 index는 number Type이라면, Object의 key는 String Type이므로 이 점을 주의하도록 하자.
이미 생성된 Object에 언제든지 데이터를 넣을 수 있는 방법이다.
세 번째 방법
obj.test = 'abc';
변수명.key = value;
두 번째 방법보다 더 간단하게 등록할 수 있는 방법이다.
첫 번째와 두 번째에 비해서 가독성은 떨어질 수 있으나, 데이터 삽입을 간단하게 할 수 있는 방법으로 널리 알려져 있다.
데이터가 정상적으로 들어있는지는 Log를 통해 알 수가 있다.
Object 불러오기
console.log(obj.first);
Object를 불러오는 방법은 위처럼 하면 된다.
Object.Key를 할 경우 해당 Key안에 담겨 있는 Value를 꺼낼 수 있다.
'Web > JavaScript' 카테고리의 다른 글
[JavaScript] Date타입 다루기 (0) | 2023.06.05 |
---|---|
[JavaScript] Object 길이 확인하기 (0) | 2023.06.02 |
[JavaScript] replace 사용하기 (0) | 2023.01.23 |
[Kakao지도] 지도 배경 변경하기 (0) | 2023.01.15 |
[kakao지도] 지도 중심좌표 부드럽게 이동하기 (0) | 2023.01.13 |