Home » JavaScript

How to invoke a function call in JavaScript?

Invoking function in JavaScript: Here, we are going to learn how to invoke a function call in JavaScript?
Submitted by Siddhant Verma, on December 02, 2019

Functions are a way to break down your code into various blocks. o as to write neat, understandable and more modular code. Functional programming is widely used across different platforms with different languages today and so it's important to understand how to deal with functions, more specifically how to invoke or call them? In this article, we'll see how to invoke a function call in JavaScript?

When you write down a function it simply stays there and does nothing at all. No memory is allotted to its code or it's local variables unless and until you call it.

function multiply(a, b) {
    return a * b;
}

When we type in this, it does nothing. But when we call the multiply() function and pass in some parameters,

console.log(multiply(4, 5));

Output

20

Now it does what it was intended to do. It also allocated some memory for its local variables a and b and also outputted the value it returned to the console.

So is this a pure function? Not associated with any object? Well, JavaScript is all about objects. Everything in JavaScript is essentially an object. Any user-defined functions you make in JavaScript also attach themselves to an object when not stated while declaring and defining them. On the browser, this global object is the window object and you can verify this,

console.log(window.multiply(4, 5));

Output

20

We didn't attach the multiply() function as a method to the window object yet we can invoke it as one!

Speaking of objects and global objects, the this keyword attains the value of an object when used inside a function and owns that function. When we call a function without an object and use this inside it, it automatically becomes the global object or attains a global scope.

function greet() {
    return this;
}
console.log(greet());

Output

Window {parent: Window, postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, …}

Our function returned a global object!

function greet2() {
    console.log("returning global object inside this!");
    return this;
}
console.log(greet2());

Output

returning global object inside this!
Window {parent: Window, postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, …}

We can create our objects and use the function as a method. Then use this inside our object to invoke our method call,

const squirtle= {
    name: 'Squirtle-1',
    HP: 100,
    type: 'water',
    speak: function() {
        return `I'm ${this.name} of ${this.type} and is very healthy! My HP is
 $ {
            this.HP
        }
        `
    }
}

console.log(squirtle.speak());

Output

"I'm Squirtle-1 of water and is very healthy! My HP is
		100 "

Our squirtle object has a function which is invoked using the object. The object squirtle owns the speak function and we can also verify this,

const squirtle= {
    name: 'Squirtle-1',
    HP: 100,
    type: 'water',
    speak: function() {
        return this;
    }
}

console.log(squirtle.speak());

Output

{name: "Squirtle-1", HP: 100, type: "water", speak: ƒ}

We can also invoke a function as a constructor using the new keyword,

function pokemon(name, type) {
    this.name = name;
    this.type = type;
}

const pikachu = new pokemon('pikachu', 'electric');
console.log(pikachu.name);
console.log(pikachu.type);

Output

"pikachu"
"Electric"

JavaScript Tutorial »

---