JavaScript Tutorial.58
JS JSON
JSON은 데이터를 저장하고 전송하는 형식이다.
JSON은 서버에서 웹 페이지로 데이터를 보낼 때 자주 사용된다.
What is JSON?
- JSON은 JavaScript Object Notation의 약자다.
- JSON은 경량 데이터 교환 형식이다.
- JSON은 언어에 독립적이다*
- JSON은 "자체 설명(self-describing)"이며 이해하기 쉽다.
* JSON 구문은 JavaScript 객체 표기법 구문에서 파생되지만 JSON 형식은 텍스트 전용입니다. JSON 데이터를 읽고 생성하기 위한 코드는 모든 프로그래밍 언어로 작성할 수 있습니다.
JSON Example
이 JSON 구문은 employees object를 정의한다: 3개의 employees 레코드(objects) array:
- JSON Example
{ "employees":[ {"firstName":"John", "lastName":"Doe"}, {"firstName":"Anna", "lastName":"Smith"}, {"firstName":"Peter", "lastName":"Jones"} ] }
The JSON Format Evaluates to JavaScript Objects
JSON 형식은 JavaScript 객체를 생성하기 위한 코드와 구문적으로 동일하다.
이러한 유사성 때문에 JavaScript 프로그램은 JSON 데이터를 기본 JavaScript 객체로 쉽게 변환할 수 있다.
JSON Syntax Rules
- 데이터는 name/value의 한쌍이다.
- 데이터는 쉼표로 구분된다.
- 중괄호로 객체를 구분(포함)한다.
- 대괄호로 배열을 구분(포함)한다.
JSON Data - A Name and a Value
JSON 데이터는 JavaScript 객체 속성과 마찬가지로 name/value가 한쌍으로 작성된다.
name/value 쌍은
1. . field name(큰따옴표안에),
2. :,
3. value
로 구성된다.
"firstName":"John"
JSON 이름에는 큰따옴표가 필요하다. JavaScript 이름은 그렇지 않다.
JSON Objects
JSON 객체는 중괄호 안에 작성된다.
JavaScript와 마찬가지로 객체에는 여러 name/value이 한 쌍으로 포함될 수 있다.
{"firstName":"John", "lastName":"Doe"}
JSON Arrays
JSON 배열은 대괄호 안에 작성됩니다.
JavaScript와 마찬가지로 배열에는 객체가 포함될 수 있다.
"employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName":"Peter", "lastName":"Jones"}
]
위의 예시에서 "employees" 객체는 배열이다. 여기에는 세 개의 객체가 포함된다.
각 객체는 사람의 기록이다.(이름과 성을 포함).
Converting a JSON Text to a JavaScript Object
JSON의 일반적인 용도는 웹 서버에서 데이터를 읽고 웹 페이지에 데이터를 표시하는 것이다.
단순함을 위해 문자열로 입력하여 설명할 수 있다.
먼저 JSON 구문이 포함된 JavaScript 문자열을 만든다.
let text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';
그런 다음 JavaScript 내장 함수 JSON.parse()
를 사용하여 문자열을 JavaScript 객체로 변환한다.
const obj = JSON.parse(text);
마지막으로, 페이지에서 새 JavaScript 객체를 사용한다.
- Example
<p id="demo"></p> <script> document.getElementById("demo").innerHTML = obj.employees[1].firstName + " " + obj.employees[1].lastName; </script>
JSON에대한 더욱 자세한 내용은 사이트를 참조하자. JSON tutorial
Author And Source
이 문제에 관하여(JavaScript Tutorial.58), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@ansunny1170/JavaScript-Tutorial.58저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)