objects.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Objects</title>
  </head>
  <body>
    <script>
      const product = {
        name: "tshirts",
        price: 5.99,
        color: "blue",
        rating: {
          rate: 4.5,
          count: 234,
        },
        fun: function () {
          console.log("Function inside object");
        }
      };
      console.log(product);
      console.log(product.name);
      console.log(product.price);

      product.price = 34;
      console.log(product);

      product.newProperty = "true";
      console.log(product);

      delete product.color;
      console.log(product);

      console.log(product["rating"]["rate"]);

      product.fun();

      product2 = {
        jeans: "Levis",
        price: 45.99,
        rating: {
          rate: 4.7,
          count: 150,
        },
        fun2: function () {
          console.log("This is a jeans");
        },
      };
      // convert object to JSON > JSON.stringify(product2)

      console.log(JSON.stringify(product2));

      // convert JSON to object > JSON.parse(jasonString)

      const jsonString = JSON.stringify(product2);
      console.log(JSON.parse(jsonString));

      /* JSON : JavaScript Object Notation
    Used to transfer data over the web
    uses double quotes for keys and string values and does not allow functions */

      const object1 = {
        message: "Hello World",
      };
      const object2 = object1;
      console.log(object2);

      object2.message = "Hello Universe";
      console.log(object1);

      // both object1 and object2 point to the same memory location

      const object3 = {
        message: "Hello Universe",
        work: function () {
          console.log("Working");
        },
      };

      console.log(object1 === object3); // false
      // although the content is same, they point to different memory locations

      console.log(object1.message === object3.message); // true
      // the content is same
      console.log(object1 === object2); // true
      // both point to the same memory location

      // const message = object3.message;
      // console.log(message); // Hello Universe

      // destructuring assignment
      const { message, work } = object3;
      console.log(message); // Hello Universe
      console.log(work); // function definition

      const jsUser = {
        name : "Ishan",
        age : 20,
        email : "ishan@gmail.com",
        isAdmin : false,

        [mykey] : "this is a symbol declaration"
      };

      console.log(jsUser);
      console.log(jsUser["name"]);
      console.log(jsUser.age);

      Object.freeze(jsUser);
      jsUser.age = 21; // will not work

      

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