클로드3.7추론모델 작성
자바스크립트 객체형 이해하기: 실생활 관점에서
왜 객체를 배워야 할까요?
객체는 관련된 정보를 하나로 묶어서 관리하는 방법입니다. 실생활로 예를 들면:
📱 스마트폰
- 모델명: "갤럭시"
- 색상: "검정"
- 가격: 100만원
- 메모리: 128GB
이런 정보를 개별 변수로 저장한다면:
var phoneModel = "갤럭시";
var phoneColor = "검정";
var phonePrice = 1000000;
var phoneMemory = 128;
너무 번거롭죠? 객체를 사용하면 관련 정보를 깔끔하게 하나로 묶을 수 있습니다:
var myPhone = {
model: "갤럭시",
color: "검정",
price: 1000000,
memory: 128
};
코드 분석: 두 가지 객체 만드는 방법
방법 1: 중괄호로 바로 만들기 (객체 리터럴)
var myCar01 = { model: "BMW", color: "gray", speed: 150 };
이것은 마치 "자동차 정보가 담긴 상자를 한번에 만들기"와 같습니다.
방법 2: 빈 객체 만든 후 채우기
var myCar02 = new Object(); // 빈 상자 준비
myCar02['model'] = "benz"; // 상자에 "model"이라는 라벨 붙인 칸에 "benz" 넣기
myCar02['color'] = "blue"; // 상자에 "color"라는 라벨 붙인 칸에 "blue" 넣기
myCar02['speed'] = 100; // 상자에 "speed"라는 라벨 붙인 칸에 100 넣기
객체에서 정보 꺼내기: 두 가지 방법
방법 1: 점(.) 사용하기
document.write(myCar01.model + "<br>"); // "BMW" 출력
방법 2: 대괄호([]) 사용하기
document.write(myCar02['model'] + "<br>"); // "benz" 출력
처음부터 코드 작성하는 법
- 객체 만들기:
var 변수이름 = { 속성이름: 값, 속성이름: 값, ... };
- 객체에서 값 불러오기:
변수이름.속성이름 또는 변수이름['속성이름']
실생활 활용 예시
// 학생 정보 관리
var student = {
name: "홍길동",
age: 20,
grade: "A",
subjects: ["수학", "영어", "과학"]
};
// 쇼핑몰 상품 정보
var product = {
name: "노트북",
price: 1200000,
brand: "삼성",
inStock: true
};
정리: 객체를 배우는 이유
- 관련 데이터를 체계적으로 관리할 수 있습니다
- 웹사이트에서 사용자 정보, 상품 정보 등을 다룰 때 필수적입니다
- 자바스크립트의 거의 모든 고급 기능은 객체를 기반으로 합니다
'JS' 카테고리의 다른 글
[JS] 자바스크립트 형 변환과 불리언(Boolean) (0) | 2025.04.02 |
---|---|
[JS] 객체와 배열의 기본 개념 (1) | 2025.04.02 |
[JS] 자바스크립트 기본문법~부울형까지 (0) | 2025.04.02 |
[JS] 작성규칙 기본문법~조건문 부울형까지 개념정리 (0) | 2025.04.02 |
[JS] 📘 자바스크립트 기초 개념 정리 (0) | 2025.04.01 |