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

Brief Answer

A regular function executes code and can return a value. A constructor function is the same function but used to create objects with the [new] keyword. Main differences:

Regular function is called directly: [func()]
Constructor function is called with [new]: [new Func()]
In constructor [this] becomes a new object
Constructor automatically returns [this]

// Regular function
function greet(name) {
  return 'Hello, ' + name;
}
greet('John'); // 'Hello, John'
 
// Constructor function
function User(name) {
  this.name = name;
}
const user = new User('John');
console.log(user.name); // 'John'

Full Answer

The difference between a regular function and a constructor function is like the difference between a regular spoon and a scoop. Both items are similar, but used for different purposes! 🥄

What is a Regular Function

A regular function is a block of code that can be called to perform some actions or calculations:

function add(a, b) {
  return a + b;
}
 
const result = add(5, 3); // 8

What is a Constructor Function

A constructor function is a regular function that is used to create objects:

function Car(brand) {
  this.brand = brand;
}
 
const myCar = new Car('Toyota');
console.log(myCar.brand); // 'Toyota'

Main Differences

Calling Method

function Example() {
  this.value = 'test';
}
 
// Regular call
const regular = Example(); // undefined (in strict mode)
 
// Call as constructor
const constructor = new Example(); // object { value: 'test' }

Working with this

function Test() {
  this.name = 'Test';
}
 
// In regular function this depends on context
Test(); // this → window/undefined
 
// In constructor this is always a new object
new Test(); // this → {} (new object)

Returning Values

function Regular() {
  return 'result';
}
 
function Constructor() {
  this.value = 'object';
  // automatically return this
}
 
Regular();        // 'result'
new Constructor(); // object { value: 'object' }

Simple Examples

Regular Function

// Does something and returns result
function calculateTax(price) {
  return price * 0.2;
}
 
const tax = calculateTax(100); // 20

Constructor Function

// Creates objects of the same type
function Product(name, price) {
  this.name = name;
  this.price = price;
}
 
const product1 = new Product('Book', 500);
const product2 = new Product('Pen', 50);
 
console.log(product1.name); // 'Book'
console.log(product2.name); // 'Pen'

When to Use What

Regular Functions

// For performing actions
function showMessage(message) {
  console.log(message);
}
 
// For calculations
function sum(a, b) {
  return a + b;
}

Constructor Functions

// For creating similar objects
function User(name, email) {
  this.name = name;
  this.email = email;
}
 
// Create users
const user1 = new User('John', 'john@example.com');
const user2 = new User('Peter', 'peter@example.com');

Common Mistakes

Confusion in Calls

function Animal(name) {
  this.name = name;
}
 
// ❌ Error — called constructor as regular function
const animal = Animal('Lion');
console.log(animal); // undefined
 
// ✅ Correctly — used new
const animal2 = new Animal('Lion');
console.log(animal2.name); // 'Lion'

Expecting Object

function CreateCounter() {
  this.count = 0;
}
 
// ❌ Will be error
// const counter = CreateCounter(); // undefined
// counter.count++; // Cannot read property 'count' of undefined
 
// ✅ Correct
const counter = new CreateCounter();
counter.count++; // works

Simple Rules

Regular function — executes code and can return value 🏃
Constructor — creates objects with [new] 🏗️
this in regular function — depends on context 🤔
this in constructor — always new object 🎯
Call — regular [func()], constructor [new Func()] 🆕

Understanding the difference helps properly choose when to use regular functions and when constructors. This is important for writing clean and understandable code! 💪

Want more articles to prepare for interviews? Subscribe to EasyAdvice, bookmark the site and improve yourself every day 💪