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

Also Read This ๐Ÿ‘‰   Vue.js Page Redirect after X delay seconds

<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.