Constructor functions and the new operator

// A constructor function, called with new, and the same four steps written out by hand.
function Booking(passenger, seat) {
  this.passenger = passenger;
  this.seat = seat;
}
Booking.prototype.label = function () {
  return `${this.passenger}, seat ${this.seat}`;
};

const withNew = new Booking('Anil', '14C');

// 1. Create a new, empty object.
// 2. Link it to Booking.prototype (that object becomes its [[Prototype]]).
const obj = Object.create(Booking.prototype);
// 3. Run Booking with this set to the new object.
const returned = Booking.call(obj, 'Anil', '14C');
// 4. The result is the new object, unless Booking returned an object of its own.
const isObject = (typeof returned === 'object' && returned !== null) || typeof returned === 'function';
const byHand = isObject ? returned : obj;

console.log(withNew.label(), '|', byHand.label());
console.log(Object.getPrototypeOf(withNew) === Booking.prototype, Object.getPrototypeOf(byHand) === Booking.prototype);
console.log(withNew instanceof Booking, byHand instanceof Booking);
console.log('Booking returned:', returned);

// Step 4 in action: an object that the constructor returns replaces the new one; a primitive is ignored.
function GivesObject() {
  this.made = 'by new';
  return { made: 'by the return statement' };
}
function GivesNumber() {
  this.made = 'by new';
  return 42;
}
console.log(new GivesObject().made, '|', new GivesNumber().made);

Anil, seat 14C | Anil, seat 14C
true true
true true
Booking returned: undefined
by the return statement | by new

// What it costs when every object gets its own copies of its methods, measured in V8, the engine of Node.js.
// v8.queryObjects() runs a full garbage collection and then counts the functions that are still reachable; the heap
// is read right after it, so both numbers describe live objects only.
import { queryObjects } from 'node:v8';

// Node.js 24 warns that queryObjects() is experimental, with the process number in the message. These two lines
// print the same warning without the number, so that every run prints the same text.
process.removeAllListeners('warning');
process.on('warning', (warning) => console.error(`${warning.name}: ${warning.message}`));

function AccountWithOwnMethods(owner) {
  this.owner = owner;
  this.balancePaise = 0;
  this.deposit = function (paise) {
    this.balancePaise += paise;
  };
  this.statement = function () {
    return `${this.owner}: ${this.balancePaise} paise`;
  };
}

function Account(owner) {
  this.owner = owner;
  this.balancePaise = 0;
}
Account.prototype.deposit = function (paise) {
  this.balancePaise += paise;
};
Account.prototype.statement = function () {
  return `${this.owner}: ${this.balancePaise} paise`;
};

const owners = [];
for (let i = 0; i < 10_000; i++) owners.push(`customer ${i}`);

function measure(label, Constructor) {
  const accounts = new Array(owners.length);
  const functionsBefore = queryObjects(Function, { format: 'count' });
  const heapBefore = process.memoryUsage().heapUsed;
  for (let i = 0; i < owners.length; i++) accounts[i] = new Constructor(owners[i]);
  const functionsAfter = queryObjects(Function, { format: 'count' });
  const bytesPerAccount = (process.memoryUsage().heapUsed - heapBefore) / accounts.length;
  console.log(`${label}: ${functionsAfter - functionsBefore} new functions, about ${Math.round(bytesPerAccount)} bytes per account`);
  return accounts;
}

const own = measure('methods made in the constructor', AccountWithOwnMethods);
const shared = measure('methods on the prototype       ', Account);
console.log('own[0].deposit === own[1].deposit:', own[0].deposit === own[1].deposit);
console.log('shared[0].deposit === shared[1].deposit:', shared[0].deposit === shared[1].deposit);

methods made in the constructor: 20000 new functions, about 201 bytes per account
methods on the prototype       : 0 new functions, about 41 bytes per account
own[0].deposit === own[1].deposit: false
shared[0].deposit === shared[1].deposit: true

ExperimentalWarning: v8.queryObjects() is an experimental feature and might change at any time

// One account type written twice: as a constructor function (how code was written before ES2015) and as a class.

// --- The constructor-function version ---
function Account(owner, balancePaise) {
  this.owner = owner;
  this.balancePaise = balancePaise;
}
Account.prototype.deposit = function (paise) {
  this.balancePaise += paise;
  return this;
};
Account.prototype.toString = function () {
  return `${this.owner}: Rs ${(this.balancePaise / 100).toFixed(2)}`;
};
Account.fromRupees = function (owner, rupees) {
  return new Account(owner, Math.round(rupees * 100)); // a "static" helper: a property of the function
};

// --- The class version ---
class AccountClass {
  constructor(owner, balancePaise) {
    this.owner = owner;
    this.balancePaise = balancePaise;
  }
  deposit(paise) {
    this.balancePaise += paise;
    return this;
  }
  toString() {
    return `${this.owner}: Rs ${(this.balancePaise / 100).toFixed(2)}`;
  }
  static fromRupees(owner, rupees) {
    return new AccountClass(owner, Math.round(rupees * 100));
  }
}

const a = Account.fromRupees('Meera', 1250.5).deposit(4950);
const b = AccountClass.fromRupees('Meera', 1250.5).deposit(4950);
console.log(String(a), '|', String(b));
console.log(typeof Account, typeof AccountClass);
console.log(Object.keys(a), Object.keys(b)); // own properties: the same

// Differences that show up in real code:
const forIn = (obj) => {
  const keys = [];
  for (const key in obj) keys.push(key);
  return keys.join(', ');
};
console.log('for...in, function version:', forIn(a)); // methods assigned to the prototype are enumerable
console.log('for...in, class version:   ', forIn(b)); // class methods are not
const flags = (C) => Object.getOwnPropertyDescriptor(C, 'prototype').writable;
console.log('prototype can be replaced:', flags(Account), flags(AccountClass));

Meera: Rs 1300.00 | Meera: Rs 1300.00
function function
[ 'owner', 'balancePaise' ] [ 'owner', 'balancePaise' ]
for...in, function version: owner, balancePaise, deposit, toString
for...in, class version:    owner, balancePaise
prototype can be replaced: true false

// Old code often replaced a constructor's whole prototype with an object literal. Two things change.
function Parcel(weightKg) {
  this.weightKg = weightKg;
}
const early = new Parcel(2); // made while Parcel.prototype is still the original object

Parcel.prototype = {
  charge() {
    return 40 + 15 * Math.ceil(this.weightKg);
  },
};
const late = new Parcel(3.2);

console.log('late.charge():', late.charge());
// 1. The literal has no constructor property, so the one inherited from Object.prototype shows through.
console.log('late.constructor === Parcel:', late.constructor === Parcel, '| it is', late.constructor.name);
// 2. Objects made earlier keep the old prototype: they lost the method, and instanceof now says no.
console.log('typeof early.charge:', typeof early.charge, '| early instanceof Parcel:', early instanceof Parcel);

// The usual repair in such code: put constructor back, as a non-enumerable property like the original one.
Object.defineProperty(Parcel.prototype, 'constructor', { value: Parcel, writable: true, configurable: true });
console.log('after the repair:', new Parcel(1).constructor === Parcel);

late.charge(): 100
late.constructor === Parcel: false | it is Object
typeof early.charge: undefined | early instanceof Parcel: false
after the repair: true

// One mistake, three outcomes: a constructor called without new.

// A constructor in sloppy code, the way old classic scripts were written. The Function constructor makes sloppy code
// unless the text starts with "use strict", so it stands in for such a script here.
// eslint-disable-next-line no-new-func -- the example needs a function compiled as sloppy code
const SloppyWallet = new Function('owner', 'this.owner = owner; this.balance = 0;');
const sloppy = SloppyWallet('Asha'); // no new: this is the global object
console.log('sloppy:', sloppy, '| globalThis.owner is now', globalThis.owner);
delete globalThis.owner; // remove the two globals the call created
delete globalThis.balance;

// The same constructor in strict code (every module is strict): this is undefined, so its first line throws.
function StrictWallet(owner) {
  this.owner = owner;
  this.balance = 0;
}
try {
  StrictWallet('Asha');
} catch (err) {
  console.log('strict:', `${err.name}: ${err.message}`);
}

// A class refuses the call before its body runs.
class ClassWallet {
  constructor(owner) {
    this.owner = owner;
    this.balance = 0;
  }
}
try {
  ClassWallet('Asha');
} catch (err) {
  console.log('class: ', `${err.name}: ${err.message}`);
}

// new.target is the function that new was used with, and undefined in a plain call: a guard for old constructors.
function GuardedWallet(owner) {
  if (!new.target) throw new TypeError('GuardedWallet must be called with new');
  this.owner = owner;
  this.balance = 0;
}
try {
  GuardedWallet('Asha');
} catch (err) {
  console.log('guard: ', `${err.name}: ${err.message}`);
}
console.log('with new:', new GuardedWallet('Asha').owner);

sloppy: undefined | globalThis.owner is now Asha
strict: TypeError: Cannot set properties of undefined (setting 'owner')
class:  TypeError: Class constructor ClassWallet cannot be invoked without 'new'
guard:  TypeError: GuardedWallet must be called with new
with new: Asha

// Which functions can be called with new? Reflect.construct(String, [], F) throws a TypeError when F is not a
// constructor, so it answers the question without running F.
function canConstruct(fn) {
  try {
    Reflect.construct(String, [], fn);
    return true;
  } catch {
    return false;
  }
}

const shop = {
  method() {},
};
class Basket {}
const kinds = {
  'function declaration': function plain() {},
  'arrow function': () => {},
  'method in an object literal': shop.method,
  'class': Basket,
  'async function': async function load() {},
  'generator function': function* ids() {},
  'bound function': function plain() {}.bind(null),
};
for (const [kind, fn] of Object.entries(kinds)) {
  console.log(`${kind.padEnd(28)} ${canConstruct(fn) ? 'yes' : 'no'}`);
}

// Built-in functions decide for themselves what a call with and without new means.
console.log(typeof Date(), typeof new Date(0)); // a string, then a Date object
console.log(typeof String(42), typeof new String(42)); // a primitive, then a wrapper object
try {
  // eslint-disable-next-line no-new-native-nonconstructor -- the TypeError is what the line shows
  new Symbol('id');
} catch (err) {
  console.log('new Symbol:', err.name);
}

function declaration         yes
arrow function               no
method in an object literal  no
class                        yes
async function               no
generator function           no
bound function               yes
string object
string object
new Symbol: TypeError