자바스크립트 JSON

JSON은 JavaScript Object Notation의 약어로, 데이터 교환 형식입니다.

JSON이란 무엇인가요?

JSON의 정식 영어 이름은 JavaScript Object Notation입니다.

JSON은 경량 데이터 교환 형식입니다.

JSON은 언어 독립적입니다. *

JSON은 이해하기 쉽습니다.

JSON에는 몇 가지 데이터 유형만 있습니다.

number: JavaScript의 숫자와 정확히 동일합니다.

boolean: JavaScript의 true 또는 false입니다.

null: JavaScript의 null입니다.

array: JavaScript의 배열 표현입니다. -

객체: {...} 자바스크립트의 표현

및 위 항목의 조합.

게다가 JSON도 문자셋이 UTF-8이어야 한다고 규정하고 있어 다국어 표현에 문제가 없습니다. 통합 구문 분석의 경우 JSON 문자열은 큰따옴표 ""를 사용해야 하며 개체 키도 큰따옴표 ""를 사용해야 합니다.

JSON은 매우 간단하기 때문에 웹 세계에서 빠르게 인기를 얻었고 ECMA 표준이 되었습니다. 거의 모든 프로그래밍 언어에는 JSON을 구문 분석하기 위한 라이브러리가 있으며, JavaScript에서는 JSON 구문 분석이 내장되어 있기 때문에 JSON을 직접 사용할 수 있습니다.

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title>
<script type="text/javascript">  
var student = new Object(); 
student.name = "Lanny"; 
student.age = "25"; 
student.location = "China"; 
var json = JSON.stringify(student); 
alert(json); //{"name":"Lanny","age":"25","location":"China"}
</script>  
</head>  
<body>  
</body>  
</html>

JSON은 JavaScript 개체로 형식화되었습니다.

JSON 형식은 JavaScript 개체를 생성하는 코드와 구문상 동일합니다.

비슷하기 때문에 JavaScript 프로그램은 JSON 데이터를 JavaScript 개체로 쉽게 변환할 수 있습니다.

JSON 구문 규칙

데이터는 키/값 쌍입니다. 데이터는 쉼표로 구분됩니다. 중괄호는 객체를 저장합니다. 대괄호는 배열을 저장합니다.

JSON 데이터 - 하나의 이름은 하나의 값에 해당합니다.

JSON 데이터는 JavaScript 객체 속성과 마찬가지로 키/값 쌍으로 형식화됩니다.

키/값 쌍은 필드 이름(큰따옴표 안), 콜론, 값으로 구성됩니다.

"firstName":"John"

JSON 개체

JSON 객체 중괄호 안에 저장됩니다.

JavaScript와 마찬가지로 객체는 여러 키/값 쌍을 보유할 수 있습니다.

{"firstName":"John", "lastName":"Doe"}

JSON 배열

JSON 배열은 대괄호 안에 저장됩니다.

JavaScript와 마찬가지로 배열에도 객체가 포함될 수 있습니다.

"employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName" :"Peter", "lastName":"Jones"}
]

위의 예에서 "employees" 개체는 배열입니다. 세 개의 개체가 포함되어 있습니다.

각 개체는 직원(성과 이름)의 기록입니다.

JSON 문자열을 JavaScript 객체로 변환

보통 우리는 서버에서 JSON 데이터를 읽어 웹페이지에 표시합니다.

먼저 JSON 형식의 데이터인 JavaScript 문자열을 만듭니다.

var text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName ": "Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]} ';

그런 다음 JavaScript 내장 함수 JSON.parse()를 사용하여 문자열을 JavaScript 개체로 변환합니다.

var obj = JSON.parse(text);

마지막으로 페이지에서 새로운 JavaScript 개체 사용:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var text = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';
obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.employees[2].firstName + " " + obj.employees[2].lastName;
</script>
</body>
</html>

지속적인 학습

새로운 파일

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> var arr = ["a", "b", "c"]; var str = JSON.stringify(arr); document.write(str); document.write ("<br/>"); var newArr = JSON.parse(str); while (newArr.length > 0) { document.write(newArr.pop() + "<br/>"); } // Output: var arr = ["a", "b", "c"]; var str = JSON.stringify(arr); document.write(str); document.write ("<br/>"); var newArr = JSON.parse(str); while (newArr.length > 0) { document.write(newArr.pop() + "<br/>"); } </script> </head> <body> </body> </html>

제출하다 코드 재설정

자동운전