how to call a function in javascript?

how to call a function in javascript – The call() method is a predefined JavaScript method. It is used to call a function contains this value and an argument provided individually.

how to call a function in javascript

The call() method is used to write methods for different objects. there are main 4 ways to call a function in JavaScript. As a function, As a method, As a constructor and via call and apply.

Calling a function as a function

<button onclick="welcomeMessage()">great welcome</button>
  <script>
    function welcomeMessage() {
      console.log(this);
      console.log(arguments);
      console.log('welcome');
    }
  </script>

force the context to be undefined

<button onclick="welcomeMessage()">great welcome</button>
  <script>
    'use strict'; 
    function welcomeMessage() {
      console.log(this);
      console.log(arguments);
      console.log('welcome');
    }
  </script>

Calling a function as a method

<button onclick="SetProfile.welcomeMessage()">great welcome</button>
  <script>
    SetProfile = {
      welcomeMessage: function () {
        console.log(this);
        console.log(arguments);
        console.log('welcome');
      }
    }

Calling a function as a constructor

  <input type="text" id="name"></input>
  <button onclick="welcomeMessage()">great welcome</button>
  <script>

    function SetProfile(name) {
      console.info('start level constructor');
      console.log(this);
      console.log(arguments);
      this.name = name;
      console.info('end constructor')
    }


    function welcomeMessage() {
      var name = document.getElementById('name').value;
      var resdata = new SetProfile(name);
      console.log('welcome ' + resdata.name);
    }
  </script>

Don’t Miss : Call Javascript Function From Html

Calling a function via call and apply

<button onclick="go()">GO</button>
  <script>
    var member = [];
    var name = 'deep';

    function Person(queryIndex) {
      queryIndex % 2 === 0 ? 
        this.name = 'deep ' + queryIndex : 
        this.name = 'mobi ' + queryIndex;
    }

    function displayProfile() {
      console.log(this.name);
    }

    function go() {
      //call displayProfile to print the name variable defined on the window object
      displayProfile();

      //populate the member array with a couple of member
      for (let queryIndex = 0; queryIndex < 5; queryIndex++) {
        member.push(new Person(queryIndex));
      }

      // lets call the displayProfile for each object that we just created 
      // seting this dynamically
      member.forEach(p => {
        displayProfile.call(p);
      });
      // displayProfile.call(valueOfThis, 1, 2, 3);
      // displayProfile.apply(valueOfThis, [1, 2, 3])
    }
  </script>

//call accepts a list of values
displayProfile.call(valueOfThis, 1, 2, 3);

//apply accepts an array of values
displayProfile.apply(valueOfThis, [1, 2, 3]);

I hope you get an idea about how to call a function in javascript.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.