Objects Notebook

Mastering JavaScript Objects

Objects are the heart of JavaScript. Unlike primitives, objects are reference types and collections of key-value pairs. Understanding objects is crucial because almost everything in JavaScript—including arrays and functions—is effectively an object at its core.

IN [6]

// Although it is const it can be modified
const person = new Object(); // or use obj = {key: value}
// Add Properties
person.firstName = "John";
person.lastName = "Doe";

console.log(person.firstName + " " + person["lastName"]); // ways to access properties

Functions in Objects (use this.propertyName)

IN [7]

const person = {
  firstName: "John",
  lastName : "Doe",
  id       : 5566,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

person["firstName"] = "Jane";

console.log(person.fullName()); //

Unlike basic datatypes Objects are assigned by reference not by value

IN [ ]

//Create an Object
const person = {
  firstName:"John",
  lastName:"Doe",
  age:50, eyeColor:"blue"
}

// Create a copy
const x = person;

// Change Age in both
x.age = 10;

console.log(person.age);

// shallow copy (most common)
const copy1 = { ...obj };
const copy2 = Object.assign({}, obj);

// deep copy (simple data only)
const deep1 = structuredClone(obj);

// deep copy (legacy, no functions, no Date/Map/Set)
const deep2 = JSON.parse(JSON.stringify(obj));

IN [9]

// immutable basic datatypes numbers, string and booleans
var a = 10;
var b = a;
b = 20;

console.log(a);

IN [10]

person.nationality = "English";
delete person.lastName; // returns boolean tru false not the value
console.log(person);

Iterating Object

IN [11]

let text = "";
for (let x in person) {
  if (typeof person[x] == "function") {
    text += person[x]() + " ";
  } else {
    text += person[x] + " ";
  }
};

console.log(text);

IN [12]

const objValuesArray = Object.values(person);
const objKeysArray = Object.keys(person);

console.log("Keys: " + objKeysArray + "\n\nValues: " + objValuesArray);

IN [13]

// Object.entries(obj)
const fruits = {Bananas:300, Oranges:200, Apples:500};

let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
  text += fruit + ": " + value + " ";
}

IN [14]

console.log(JSON.stringify(person, null, 2))

Object Constructor

IN [15]

function Person(first, last, age, eye) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eye;
  this.nationality = "English"; // default value
}

IN [16]


const mySelf = new Person("Johnny", "Rally", 22, "green");
mySelf.education = "Masters";
console.log(typeof mySelf + " " + JSON.stringify(mySelf));

Protoype

IN [17]

Person.prototype.city = "Paris";
console.log(JSON.stringify(mySelf)); // it should work and append city in mySelf object. Jupyter is Deno is not working well

Constructor Methods

IN [18]

// TypeError: Wrong usage of Constructor Method: Must be added at declaration following should not work
Person.changeName = function (name) {
  this.firstName = name;
}

// Methods must be added by constructor
Person.prototype.changeLastName = function (name) {
  this.lastName = name;
}
const mySelf = new Person("Johnny", "Rally", 22, "green");
// mySelf.changeName("Rahul"); // TypeError: mySelf.changeName
mySelf.changeLastName("Dhole");
console.log(JSON.stringify(mySelf));

IN [19]

new Object()   // A new Object object {}
new Array()    // A new Array object []
new Map()      // A new Map object 
new Set()      // A new Set object 
new Date()     // A new Date object 
new RegExp()   // A new RegExp object /()/
new Function() // A new Function object (){}
// The Math() object is not in the list. Math is a global object. The new keyword cannot be used on Math.
Math.pow(2, 2) // 4

IN [20]

function Person2(first, last, age, eye) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eye;
  this.nationality = "English"; // default value
}
Person2.prototype = new Person();
Person2.prototype.changeName = function (name) {
  this.firstName = name;
}

const mySelf2 = new Person2("Johnny", "Rally", 22, "green");
mySelf2.education = "Masters";
mySelf2.changeName("John");
console.log(typeof mySelf2 + " " + JSON.stringify(mySelf2));

IN [ ]