728x90
객체 쓰기와 읽기
잠깐 복습을 해보면 배열은 정보를 담는 그릇이면서 동시에 정보가 순서대로 저장된다는 특징이 있다.
그렇다면 순서 없이 정보를 저장할 수 있는 것이 있지 않을까?
그게 바로 객체이다.
그렇다고 데이터를 무작위로 넣는 것이 아니다.
객체는 이름이 있는 정리정돈 상자라고 생각하면 되겠다.
Tip. 배열은 [대괄호], 객체는 {중괄호}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>object</h1>
<h2>Create</h2>
<script>
var coworkers = {
"beginner":"livebyfaith117"
"programmer":"egoing"
};
</script>
</body>
</html>
coworkers 라는 객체에 livebyfaith117 라는 정보를 beginner 라는 딱지를 붙여서 저장한 것이고,
egoing 이라는 정보를 programmer 라는 딱지를 붙여서 저장한 것이다.
반대로 꺼내올때는 어떻게 할까?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>object</h1>
<h2>Create</h2>
<script>
var coworkers = {
"beginner":"livebyfaith117"
"programmer":"egoing"
};
document.write("beginner:"+coworkers.beginner);
</script>
</body>
</html>
document.write("beginner:"+coworkers.beginner); 에서
coworkers 와 beginner 사이에 있는 점은 object access operator 라고 불린다.
즉 앞에 있는 객체 coworkers 에 접근하는 오퍼레이터.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>object</h1>
<h2>Create</h2>
<script>
var coworkers = {
"beginner":"livebyfaith117",
"programmer":"egoing"
};
document.write("beginner:"+coworkers.beginner+"<br>");
document.write("programmer:"+coworkers.programmer);
</script>
</body>
</html>
지금 객체를 만드는 방법과 만들어져 있는 객체에서 데이터를 가져오는 방법을 살펴봤다.
이미 객체가 만들어진 다음에 정보를 추가하고 싶다면 어떻게 하면 될까?
coworkers 라는 변수에 .점을 찍고
coworkers.bookkeeper="duru";
document.write("bookkeeper:"+coworkers.bookkeeper);
또 data scientist 를 추가하고 싶다.
여기서 data 와 scientist 사이에 띄어쓰기가 들어간다. 이러면 문법적으로 오류이다. 어떻게 해결할까?
배열에서 어떤 정보를 가져올 때 [대괄호]를 쓴다. 이것을 사용한다.
coworkers["data scientist"]="taeho";
document.write("data scientist:"+coworkers["data scientist"]);
- ex10.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>object</h1>
<h2>Create</h2>
<script>
var coworkers = {
"beginner":"livebyfaith117",
"programmer":"egoing"
};
document.write("beginner:"+coworkers.beginner+"<br>");
document.write("programmer:"+coworkers.programmer+"<br>");
coworkers.bookkeeper="duru";
document.write("bookkeeper:"+coworkers.bookkeeper+"<br>");
coworkers["data scientist"]="taeho";
document.write("data scientist:"+coworkers["data scientist"]);
</script>
</body>
</html>
이렇게 객체 생성법, 객체의 데이터를 가져오는 법, 데이터를 넣는 법까지 살펴봤다.
'youtube.com|user|egoing2 > WEB2 - JavaScript' 카테고리의 다른 글
WEB2 - JavaScript 32 (객체프로퍼티와 메소드) (0) | 2021.09.29 |
---|---|
WEB2 - JavaScript 31 (객체와 반복문) (0) | 2021.09.29 |
WEB2 - JavaScript 29 (객체 'object' 의 예고) (0) | 2021.09.27 |
WEB2 - JavaScript 28 (함수의 활용) (6) | 2021.09.24 |
WEB2 - JavaScript 24 to 27 (함수, function) (4) | 2021.09.23 |