2024-10-15
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
/*
자바스크립트에서의 객체
- 자바에서의 객체의 개념과 유사.
- 속성 + 기능
- 자바스크립트에서 객체 생성 방법.
형식)
const(let) 객체명 = {
속성 : 값,
속성 : 값
}
*/
const product = {
name : "Galaxy S24",
type : "핸드폰",
company : "삼성전자"
}
// 해당 객체의 속성을 화면에 출력하는 방법 - 첫번째 방법
document.write(`제품 이름 >>> ${product['name']} <br>`);
document.write(`제품 타입 >>> ${product['type']} <br>`);
document.write(`제품 제조사 >>> ${product['company']} <br>`);
document.write("<hr>");
// 해당 객체의 속성을 화면에 출력하는 방법 - 두번째 방법
document.write(`제품 이름 >>> ${product.name} <br>`);
document.write(`제품 타입 >>> ${product.type} <br>`);
document.write(`제품 제조사 >>> ${product.company} <br>`);
document.write("<hr>");
// 해당 객체의 속성을 화면에 출력하는 방법 - 세번째 방법
// for..in 반복문
for(let p in product) {
document.write(`${p} 의 값 >>> ${product[p]} <br>`);
}
document.write("<hr>");
</script>
</head>
<body>
</body>
</html>
'JavaScript > 기초 내용 정리' 카테고리의 다른 글
| JavaScript(BOM)_01 (0) | 2024.10.15 |
|---|---|
| JavaScript(Object)_02 (0) | 2024.10.15 |
| JavaScript(Function)_Exam_01 (0) | 2024.10.14 |
| JavaScript(Function)_04 (0) | 2024.10.14 |
| JavaScript(Function)_03 (0) | 2024.10.14 |