Skip to main content

The "new" Operator

Objects the Basics: The "new" Operator

What is the difference between a regular function and a constructor function?​

View Answer:
Interview Response: The conventional difference is the constructor function name is capitalized and invoked with the "new" operator.

Code Example:

function User(name) {
  this.name = name;
  this.isAdmin = false;
}

let user = new User('Jack');

alert(user.name); // Jack
alert(user.isAdmin); // false

What steps are taken by a constructor function when it gets invoked in relation to the "this" keyword?​

View Answer:
Interview Response: First, a new object is created and assigned to "this", the function body executes. Usually, it modifies "this", adds new properties, and the value of this gets returned.

Code Example:

function User(name) {
  // this = {};  (implicitly)

  // add properties to this
  this.name = name;
  this.isAdmin = false;

  // return this;  (implicitly)
}

// So let user = new User("Jack") gives the same result as:

let user = {
  name: 'Jack',
  isAdmin: false,
};

What is the primary function of constructor functions?​

View Answer:
Interview Response: The primary purpose of constructors is to act as the framework of object creation. It quickly allows the code to create new objects in its image. All functions that accept the arrow function can get used as a constructor.

What is the result when using an arrow function as a constructor?​

View Answer:
Interview Response: Any attempt to resolve "this" in an arrow function results in a type error. This behavior is especially notable when you try to use an arrow function as a constructor, resulting in a type error. A cardinal rule to remember in JavaScript development is that arrow functions have no "THIS".

Code Example:

const Car = (color) => {
  this.color = color;
};

const redCar = new Car('red'); // TypeError: Car is not a constructor

Can you omit the parentheses when you invoke a constructor function?​

View Answer:
Interview Response: Yes, technically, when you have no arguments and this approach is permitted by the specification but not considered a good style. It would be best always to use the parentheses even when you have no arguments in your constructor.

Code Example:

// let user = new User; <-- no parentheses

// same as
let user = new User(); <-- proper implementation

What are the explicit rules on return statements in constructor functions?​

View Answer:
Interview Response: Constructors often do not contain a return statement. Their role is to enter all relevant information into this, and it immediately becomes the outcome; nevertheless, if there is a return statement, the rule is straightforward.

  1. If the return function gets used with an object, the object is returned instead of this.
  2. If the return function gets invoked with a primitive, it gets ignored.

Code Example:

function BigUser() {
  this.name = 'John';

  return { name: 'Godzilla' }; // <-- returns this object
}

alert(new BigUser().name); // Godzilla, got that object