Before classes there were constructor functions. Knowing what new does step by step explains classes, this, and a favourite interview question.

What `new Fn(args)` does

Create
A brand-new empty object is created.
Link
Its [[Prototype]] is set to Fn.prototype.
Bind and run
Fn is called with this = the new object and the given arguments.
Return
If Fn returns an object, that object is the result; otherwise the new object is returned.

JavaScript

function myNew(Ctor, ...args) {
  const obj = Object.create(Ctor.prototype);   // steps 1 + 2
  const result = Ctor.apply(obj, args);        // step 3
  return result !== null && typeof result === "object" ? result : obj;  // step 4
}

function User(name) { this.name = name; }
User.prototype.hi = function () { return `hi ${this.name}`; };

const u = myNew(User, "Asha");
console.log(u, u.hi(), u instanceof User);

Output

User { name: 'Asha' } hi Asha true

Returning an object overrides `this`

JavaScript

function A() { this.x = 1; return { y: 2 }; }
function B() { this.x = 1; return 42; }   // primitives are ignored
console.log(new A(), new B());

Output

{ y: 2 } B { x: 1 }

Forgetting `new`

JavaScript

function Point(x) { this.x = x; }
try {
  Point(5);                        // strict mode: this is undefined
} catch (e) {
  console.log(e.message);
}
function SafePoint(x) {
  if (!new.target) return new SafePoint(x);   // guard with new.target
  this.x = x;
}
console.log(SafePoint(5));

Output

Cannot set properties of undefined (setting 'x')
SafePoint { x: 5 }

Inheritance the ES5 way

JavaScript

function Animal(name) { this.name = name; }
Animal.prototype.speak = function () { return `${this.name} makes a sound`; };

function Dog(name, breed) {
  Animal.call(this, name);                         // "super(name)"
  this.breed = breed;
}
Dog.prototype = Object.create(Animal.prototype);  // link prototypes
Dog.prototype.constructor = Dog;                  // repair constructor
Dog.prototype.speak = function () {
  return Animal.prototype.speak.call(this) + " (woof)";
};

const d = new Dog("Rex", "lab");
console.log(d.speak(), d instanceof Animal, d.constructor.name);

Output

Rex makes a sound (woof) true Dog

What happens when you call a function with new?

What new Fn(args) does

Returning an object overrides this

Forgetting new

Inheritance the ES5 way

What `new Fn(args)` does

Returning an object overrides `this`

Forgetting `new`