342. (javaScript) 자바스크립트 json string 문자열 데이터 JSON.parse 사용해 model 객체에 매핑 수행

---

[개발 환경 설정]

​

개발 툴 : Edit++

개발 언어 : JavaScript

 

---

[소스 코드]

​

    <!-- ===================================================================================================== -->
    <!-- [자바스크립트 코드 지정] -->
    <!-- ===================================================================================================== -->
    <script>


        /*
        -----------------------------------------
        [요약 설명]
        -----------------------------------------
        1. JSON.stringify : Object 를 json 형식 문자열로 변환해줍니다
        -----------------------------------------
        2. JSON.parse : Json String 문자열을 Object 로 변환해줍니다
        -----------------------------------------
        */



        // [전역 변수 선언 객체]
        var userInfo = {
            "name" : "",
            "age" : 0
        };



        // [html 최초 로드 및 이벤트 상시 대기 실시] 
        window.onload = async function() {
            console.log("");
            console.log("=========================================");
            console.log("[window onload] : [start]");
            console.log("=========================================");
            console.log(""); 


            // [로직 처리 실시]
            try {

                // [Object 생성 및 Key , Value 삽입]
                var objc = {
                    "name" : "투케이",
                    "age" : 29
                };


                // [Object To Json String 변환]
                var jsonString = JSON.stringify(objc);


                // [Json 데이터 파싱 및 객체에 매핑]
                userInfo = JSON.parse(jsonString);

                console.log("");
                console.log("=========================================");
                console.log("[window onload] : [userInfo]");
                console.log("----------------------------------------");
                console.log("name :: " + userInfo.name);
                console.log("----------------------------------------");
                console.log("age :: " + userInfo.age);
                console.log("=========================================");
                console.log("");

            }
            catch (err){
                console.error("");
                console.error("=========================================");
                console.error("[window onload] : [catch] : Error");
                console.error("----------------------------------------");
                console.error("[err] :: " + err);
                console.error("=========================================");
                console.error(""); 
            }

        }; 

        
    </script>

 

---

[결과 출력]

 

=========================================
[window onload] : [userInfo]
----------------------------------------
name :: 투케이
----------------------------------------
age :: 29
=========================================

---