728x90
반응형
SMALL
1. JSON(JavaScript Object Notation)
- 데이터를 저장하거나 전송할 때 사용되는 경량의 Data 교환 형식
- 사람과 기계 모두 이해하기 쉬우며 용량이 작아서 XML을 대체하여 데이터 전송 등에 많이 사용
- 데이터 포멧일 뿐, 통신 방법도 프로그래밍 문법도 아님
2. JSON의 특징
- 서버와 클라이언트간의 교류에서 일반적으로 많이 사용
- 자바스크립트를 이용하여 JSON 형식의 문서를 자바스크립트 객체로 변환하기 쉬움
- 자바스크립트 문법과 굉장히 유사하지만 텍스트 형식일 뿐
- 특정 언어에 종속되지 않으며, 대부분 프로그래밍 언어에서 JSON 포멧에 데이터를 핸들링 할 수 있는 라이브러리를 제공
✔ 자바스크립트와 다른점
- JSON은 이름과 값으로 구성된 프로퍼티의 정렬되지 않은 집합이며 따라서 메소드 프러퍼티가 없음
3. JSON의 구조
{"name":"루시", "age":14, "family":"포메라니안", "weight":3.5}- 이름과 값의 쌍으로 이루어짐
- 데이터는 쉼표로 구분하여 나열
- {}중괄호로 감싸서 표현
- 배열은 []대괄호로 감싸서 표현
4. JSON의 타입
- 숫자, 문자열, 불리언, 객체, 배열, null
{
"class":
[
{"name":"김사과"(문자열), "age":20(숫자), "hp":"010-1111-1111","testPass":true(불리언)}(객체),
{"name":"반하나", "age":25, "hp":"010-2222-2222","testPass":false},
{"name":"오렌지", "age":27, "hp":"010-3333-3333","testPass":true}
...
](배열),
[
...
]
}
5. 메소드
- JSON.stringify(object): 객체를 문자열로 변환
- JSON.parse(JSON): 문자열 데이터를 자바스크립트 객체로 변환
- https://ko.javascript.info/json#ref-694
JSON과 메서드
ko.javascript.info
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JSON</title>
</head>
<body>
<h2>JSON</h2>
<script>
const dog = {
name:'루시',
age:14,
family:'포메라니안',
eat: ()=>{
console.log('잘먹고 잘논다')
}
}
const json = JSON.stringify(dog)
console.log(dog) // 객체가 찍힘
console.log(json) // 객체가 문자열로 찍힘
console.log('-----------')
const obj = JSON.parse(json)
console.log(obj) // 객체 타입으로 변환
</script>
</body>
</html>
728x90
반응형
LIST
'Web > JavaScript' 카테고리의 다른 글
| [Node.js] 모듈 - 1️⃣ os (0) | 2023.04.25 |
|---|---|
| [JavaScript] fetch API (0) | 2023.04.20 |
| [JavaScript] Promise 객체 - 3️⃣ all(), allSettled(), race() (0) | 2023.04.20 |
| [JavaScript] Promise객체 - 2️⃣ promise 콜백함수 축약형으로 작성하기! (0) | 2023.04.20 |
| [JavaScript] Promise객체 - 1️⃣ 비동기 작업 처리란? & Promise 객체 생성과 콜백함수 사용 (0) | 2023.04.20 |
