카테고리 없음

JS 객체 (JSON, JSON.stringfiy, JSON.parse)

Canyi 2022. 11. 10. 11:46

https://developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/JSON

 

JSON으로 작업하기 - Web 개발 학습하기 | MDN

JavaScript Object Notation (JSON)은 Javascript 객체 문법으로 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷입니다. 웹 어플리케이션에서 데이터를 전송할 때 일반적으로 사용합니다(서버에서

developer.mozilla.org

<!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>Document</title>
</head>
<body>
    <script>
        
        //JSON
        let user = {
            name : "can",
            age: 19,

            toString(){
                return `{
                         
                         name: "${this.name}",
                         age:   ${this.age}
                        
                        }`;
            }
        }

        alert(user.toString());

    </script>
</body>
</html>

 

 

JSON.stringfiy

 

 

<!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>Document</title>
</head>
<body>
    <script>
        
        let user = {
            name : "can",
            age: 19,
            isadmin : false,
            course : ['JS', 'Node', 'React'],
        }

        var Json = JSON.stringify(user);
        alert(Json);
        alert(typeof(Json));




    </script>
</body>
</html>

 

 

JSON.parse

 

<!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>Document</title>
</head>
<body>
    <script>
        

        //JSON.parse 함수
        //let value = JSON.parse(문자열);

        let numbers = "[0,1,2,3]";
        alert(numbers);
        let obj = JSON.parse(numbers);  //obj ==> [0,1,2,3]

        console.log(obj[0]);
        console.log(obj[1]);
        console.log(obj[2]);
        console.log(obj[3]);


    </script>
</body>
</html>