JavaScript objects

Javascript objects

What is an Object in Javascript?

Everything else that is not a Primitive type is an Object type.

In JavaScript, an object is a standalone entity, an unordered collection of related data in the form of “key: value” pairs.
keys can be variables or functions and are called properties (for variables) and methods (for functions).

All objects in JavaScript are descended from Object. All objects inherit methods and properties from Object.prototype, although they may be overridden.

Object data types characteristics

  • Objects are mutable by default
  • Objects have unique identities and are compared by reference
  • Variables hold references to objects

Javascript objects are reference data types

A JavaScript Object is a reference data type.
Variables that are assigned by reference points to a location in memory, which is accessible only by javascript itself. The variables don’t actually contain the value.

So when you do:
objA = objB
you only copy the reference pointer to object in memory.

Object Properties

JavaScript objects can have properties, which define their characteristics.
An object property can be any valid JavaScript string or anything that can be converted to a string, including the empty string.

Properties vs. Keys vs. Values in JavaScript

The term property usually refers to the key/value pair that describes a member of an object.
“property” (is the whole thing, part of an object), “property name” (the string used as the key) and “property value” (the stored data). For example:

height : 10 => property(key/value pair)
height => key or property name
10 => value or property value

What is the difference between object keys with quotes and without quotes?

JavaScript objects do not contain single or double quote marks around the keys when no spacing is used in the key name. So, if there’s spacing in the key name, quotes are used.

Accessing Object Properties

You can access the properties of the object in the following ways:

  • objectName.propertyName
  • objectName[“propertyName”]
  • Or if an object have multiple properties, You can use the bracket notation with for…in to iterate over all the enumerable properties of an object.
var book1 = {
    title: "First book title",
    author: "John Doe",
    pages: 500,
    type: "Fiction",
    "e book": "yes"
First book title
First book title


Has a value of 1.
Allows the addition of properties to all objects of type Object.

Object methods

Methods are actions that can be performed on objects.
Methods are stored in properties as function definitions.

var book1 = {
    title: "First book title",
    author: "John Doe",
    pages: 500,
    type: "Fiction",
    "e book": "yes",
    getAuthor: function(){

Accessing Object Methods

You access an object method with the following syntax:

var book1 = {
    title: "First book title",
    author: "John Doe",
    pages: 500,
    type: "Fiction",
    "e book": "yes",
    getAuthor: function(){
John Doe

this is the book object that “owns” the getAuthor() function. means the author property of this object.

Object methods examples

Copies the values of all enumerable own properties from one or more source objects to a target object.

Creates a new object with the specified prototype object and properties.

How to create an object in JavaScript?

You can create an object:

  1. using an object initializer { … }
  2. using a constructor function and then instantiate an object invoking that function in conjunction with the new operator

1. with figure brackets { … } with an optional list of properties (“key: value” pairs)

The key is a string, called “property name“.
The property names can be strings or numbers. If the property name contains several separate words, the property names must be enclosed in quotes.

var book1 = {
    title: "First book title",
    author: "John Doe",
    pages: 500,
    type: "Fiction",
    "e book": "yes"

2. Using Constructor

The Object constructor creates an object wrapper for the given value.
Objects of the same type are created by calling the constructor function with the new keyword:

function Book(title, author, pages, type){
    this.title = title; = author;
    this.pages = pages;
    this.type = type;
book2 = new Book("Second book", "Mike", 299, "Non fiction");
Non fiction

Also, You can declare Strings, Numbers, and Booleans as Objects, like:

var x = new String();        // Declares x as a String object
var y = new Number();        // Declares y as a Number object
var z = new Boolean();       // Declares z as a Boolean object

The String global object is a constructor for strings or a sequence of characters.

It’s not recommended to do this, because they complicate your code and slow down the execution speed.

Copying Objects in JavaScript

What is the difference between window, screen, and document in Javascript?

window Object and document Object are not the same things!

Window Object

The window Object is the first thing that gets loaded into the browser, the root of everything. This window object has the majority of the properties like length, innerWidth, innerHeight, location, history etc

Document Object

The document Object is the top DOM object, like your HTML, PHP, or other documents that will be loaded into the browser. The document actually gets loaded inside the window object and has own properties like title, URL, cookie, etc

Screen Object

The screen Object just contains information about the screen dimensions. Screen properties width and height are the full-screen dimensions.

Sets in JavaScript

Set objects are collections of unique values. Set can store any types of values whether primitive or objects.
Set in ES6 are ordered! Read more here about sets in JavaScript.

Creates a new Set object


Set Methods

  • Set.prototype.add() – It adds new elements with a specified value at the end of the Set object.
  • Set.prototype.delete() – It deletes an element with the specified value from the Set object.
  • Set.prototype.clear() – It removes all the element from the set.
  • Set.prototype.has() – It returns true if the specified value is present in the Set object.
  • Set.prototype.values() – It returns all the values from the Set in the same insertion order.
  • Set.prototype.forEach() – It executes the given function once for every element in the Set, in the insertion order.

Hello there!

I hope you find this post useful!

I'm Mihai, a programmer and online marketing specialist, very passionate about everything that means online marketing, focused on eCommerce.

If you have a collaboration proposal or need helps with your projects feel free to contact me. I will always be glad to help you!

Leave a Reply

Your email address will not be published. Required fields are marked *