jsJSONBasics

<!DOCTYPE html>
<html lang="en" id="html">
<head>
    <meta charset="UTF-8">
    <title>CANVAS</title>
    <style>
        html,
        body {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .container {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-content: center;
            align-items: center;
            margin-top: 30px;
            position: relative;
        }

        canvas {
            margin: 10px;
            border: 1px solid black;
            background-image: url('grid.png');
        }
    </style>
</head>
<body>
    <div id="container" class="container">
    </div>
    <script>
        'use strict'
        {
            let obj = {
                name: 'Bill', sname: 'Gates', age: 65.4, company: { name: 'Microsoft', position: 'Founder', evilcompany: null },
                arr: [1,3,4]
            };


            //{"name":"Bill","sname":"Gates","age":65,"company":{"name":"Microsoft","position":"Founder"}}
            let json = JSON.stringify(obj);
            console.log(json);

            let restoredObj = JSON.parse(json);

            console.log(restoredObj);
            console.log(typeof (json));
            console.log(typeof(restoredObj));

            let objCopy = JSON.parse(JSON.stringify(obj));
            console.log(objCopy);
            console.log(typeof (objCopy));

            console.log(obj === objCopy);

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