Implement the `new` Operator

hard

By FrontendAtlas Editorial · Updated Jul 14, 2026

Implement myNew(Constructor, ...args) with the language's construction primitive. It must accept ECMAScript constructable targets, including classes and bound constructors, preserve new.target and native prototype fallback behavior, honor object or function return overrides, ignore primitive returns, and throw TypeError for nonconstructable targets.

Arguments

Constructor: Function — An ECMAScript constructable target to invoke with native construction semantics.
args: any[] — Arguments to pass to the constructor.

Returns

object | Function —

The value produced by native construction, including any object or function returned explicitly by the constructor.

Examples

// Example 1: normal constructor
function Person(name) { this.name = name; }
Person.prototype.say = function() { return `hi ${this.name}`; };

const p = myNew(Person, 'Ada');
p.name; // => 'Ada'
p.say(); // => 'hi Ada'
(p instanceof Person); // => true

// Example 2: constructor returns an object (must return that)
function Factory(name) {
  this.name = name;
  return { ok: true, name };
}

const f = myNew(Factory, 'Ada');
f; // => { ok: true, name: 'Ada' }

// Example 3: constructor returns primitive (ignore it)
function Weird(name) {
  this.name = name;
  return 123;
}

const w = myNew(Weird, 'Ada');
w.name; // => 'Ada'
(w instanceof Weird); // => true

Solution

Overview

A hand-written Object.create + apply approximation cannot invoke classes, does not preserve new.target, mishandles bound constructors, and gives the wrong fallback when prototype is not an object. Reflect.construct performs the language's [[Construct]] operation and therefore supplies the intended native construction semantics for any constructable target.

Approach: Delegate [[Construct]] to Reflect.construct

Call Reflect.construct(Constructor, args). Reflect.construct validates that Constructor is constructable, creates the correct receiver and prototype fallback, invokes classes and bound constructors, provides new.target, and applies native constructor return rules. A helper built from Object.create and apply is useful only as an explicitly restricted model for classic function constructors; it is not equivalent to native new. Complexity is O(k) to pass k arguments plus the constructor's own work.

export default function myNew(Constructor, ...args) {
  return Reflect.construct(Constructor, args);
}

export default function myNew<T extends new (...args: any[]) => any>(
  Constructor: T,
  ...args: ConstructorParameters<T>
): InstanceType<T> {
  return Reflect.construct(Constructor, args) as InstanceType<T>;
}

Notes & Pitfalls

Pitfalls

Calling Constructor.apply cannot invoke an ES class constructor and does not supply new.target.
Checking only typeof Constructor === 'function' is insufficient because arrows and methods are callable but not constructable.
Constructor return rule: objects and functions override the created instance; primitives are ignored.
Reflect.construct throws TypeError for nonconstructable targets, matching native construction.

Edge cases

A constructor with null or primitive prototype falls back to Object.prototype.
Bound constructable targets preserve their target's construction and instanceof behavior.
A constructor may explicitly return an object or a function; either overrides the created receiver.

Techniques

Use Reflect.construct to invoke the internal [[Construct]] operation.
Let the runtime validate constructability and apply prototype fallback.
Let native construction handle new.target and return overrides.

Resources

Guides

Frontend interview preparation guideGuide Frontend coding interview questions and prep guideBlueprint JavaScript Problems That Actually Show UpBlueprint Build Great UI in 60 MinutesBlueprint

Preparing for interviews? Use Frontend Coding Challenges first, then move into a concrete Study Plan before targeted Company Prep.

Open frontend interview questions Browse JavaScript interview questions Open Essential 60 Open Machine Coding Hub Open Frontend Coding Challenges Open System Design Open Interview Prep Guide Open System Design Blueprint Open Framework Prep Paths Open Study Plans Open JavaScript mastery study plan Open Company Prep Open JavaScript Framework Prep Guide