자바스크립트 객체/배열 복습// JSON//stringify//parse

자바스크립트 객체== { }

배열은 []로 넣어준다

json: 자바스크립트 객체형식으로 데이터를 표현

JSON.stringify() 함수의 인자로 전달하여 JSON 형식의 문자열로 변환합니다.

자바스크립트 객체형식인데.. 어 이렇게 하니까 str.name에 접근이 안된다

key랑 value값에 문자열 표시해줬다 숫자일떄는 ㄱㅊ ->전체를 문자열로 표현 --> 결과적으로 문자열임 (JSON)

자바스크립트 객체만 이렇게 만든다고 한다

JSON.parse()를 사용하면 JSON 문자열을 JavaScript에서 사용 가능한 객체로 변환하여 데이터를 처리할 수 있습니다.

자바스크립트 객체형식으로 만들어놓고

parse인수에다가 넣어주면 객체로 바뀐다

이제 .name . age로 접근이 가능해진다

JSON에서 문자열은 큰따옴표(")로 둘러싸여야 합니다. 따라서 JSON 문자열 안에서 큰따옴표를 일반적인 문자로 처리하려면 이스케이프 문자인 백슬래시(\)를 사용해야 합니다. 즉, \"는 큰따옴표(")를 문자열의 시작 또는 끝을 나타내는 것이 아니라, 문자열 안에서 일반적인 큰따옴표로 해석하기 위해 사용되는 것입니다.

list처럼 쓰면 안된다 자바에서 홑따음표는 char이라 문자열하려면 "" 써야하는데 저렇게 하면 안되니깐

package servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/feedback")
public class Json_01 extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setCharacterEncoding("utf-8");
		
		PrintWriter out = response.getWriter();
		//문자열형식으로 써주려고 
		out.print("{\"name\" : \"james\", \"age\" :20}");	
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		
	}
}

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<script>
		window.onload = function() {
			const btns = document.querySelector("#btn");
			btn.addEventListener("click", f);
			
			function f () {
				const xhttp = new XMLHttpRequest();
				xhttp.onload = function() {
					let text = JSON.parse(this.responseText);
					document.getElementById('demo').innerHTML = text.name;
				}
				xhttp.open("GET", "feedback", true);
				xhttp.send();
			
			}
		}
	</script>
</head>
<body>
	<button id="btn">버튼</button>
	<div id="demo"></div>
</body>
</html>

저작자표시 비영리 변경금지 (새창열림)

'JSP > 이론' 카테고리의 다른 글

JSON/파라미터로 보내기(GET, POST) //xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");//xhttp.setRequestHeader("Content-type", "application/json"); (0)	2023.06.21
JSONObject // (0)	2023.06.21
서블릿 한방에 (0)	2023.06.20
파일업로드//enctype (0)	2023.06.19
fmt:formatNumber(groupingUsed, pattern, percent ,type)//fmt:formatDate (0)	2023.06.15