JavaScript 익히기 #11 JSON method

Sunki-Kim·2022년 8월 30일
0

JavaScript 익히기

목록 보기
12/22

JSON은 클라이언트와 서버 간의 HTTP 통신을 위한 텍스트 데이터 포맷이다.
JavaScript에 종속되지 않는 언어 독립형 데이터 포맷으로, 대부분의 프로그래밍 언어에서 사용할 수 있다.

실제로 실무에서 데이터를 전송받을때 (ajax, axios 등) 제일 보편적으로 받는 포맷이다.
ex) {name : "sunki", age : 31}


JSON.stringify() - JSON을 String 객체로 변환시켜 주며, 클라이언트에 서버를 전송하려면 객체를 문자열화하는 직렬화(serializing)를 해야한다.
JQuery - (serialize)

JSON.parse() - parse 메소드로 string 객체를 JSON 객체로 변환시켜준다.
서버로부터 클라이언트에게 전송된 JSON 데이터는 문자열이다. 해당 문자열을 객체로 사용하려면, JSON 포맷의 문자열을 객체화해야 하는 역직렬화(deserializing)를 해야한다.

var data = {
    Name: "Sunki",
    Age: "31"
}

var person =  JSON.stringify(data)
var person2 = JSON.parse(person)

// JSON.stringify()

console.log(person); // {"Name":"Sunki","Age":"31"}

// JSON.parse() key와 value 파싱

console.log(person2); // { Name: 'Sunki', Age: '31' }

ajax를 활용한 사례도 있다.

// ajax 활용 실습 예제 (Front-End)

function signup() {
    var member = {
        "email": "skdding3@gmail.com",
        "password": "1234"
    }
}

$.ajax({
    url : '/acount/signup',
    dataType : 'json',
    type : 'POST',
    data : JSON.stringify(member), // string 객체를 JSON 객체로 변환시키지 않으면 에러가 발생한다.
    contentType : 'application/json',
    success : function(result) {
        // TODO
        console.log(result)
    }
})

소스코드

profile
당신에게 가치있는 Developer가 되고자

0개의 댓글