Languages
[Edit]
EN

JavaScript - create and use functions

7 points
Created by:
Elias999
759

In this article, we would like to show you how to create and use functions in JavaScript.

1. Function function / class example

// ONLINE-RUNNER:browser;

var action1 = Function('console.log("This is my message...");');
var action2 = Function('console.log(arguments);');
var action3 = new Function('console.log("This is my message...");');
var action4 = new Function('console.log(arguments);');

action1();
action2(1, 2, 3, 'test 1', 'text 2', 'text n');
action3();
action4(1, 2, 3, 'test 1', 'text 2', 'text n');

console.log(action1.name);
console.log(action2.name);
console.log(action3.name);
console.log(action4.name);

Output (with NodeJS):

This is my message...

[Arguments] {
  '0': 1,
  '1': 2,
  '2': 3,
  '3': 'test 1',
  '4': 'text 2',
  '5': 'text n'
}

This is my message...

[Arguments] {
  '0': 1,
  '1': 2,
  '2': 3,
  '3': 'test 1',
  '4': 'text 2',
  '5': 'text n' 
}

anonymous
anonymous
anonymous
anonymous

2. Anonymous function example

2.1. With function name from the variable name

// ONLINE-RUNNER:browser;

var action = function() {
    console.log('This is my message...');
};

var sum1 = function(a, b) {
    return a + b;
};

var sum2 = function() {
    var result = 0;

    for(var i = 0; i < arguments.length; ++i) {
        result += arguments[i];
    }

    return result;
};

var print = function(a, b) {
    var text = '';
    
    text += 'a=' + a + ', ';
    text += 'b=' + b + ', ';
    text += 'arguments=[';

    for(var i = 0; i < arguments.length; ++i) {
        if(i > 0) {
            text += ', ';
        }
        text += arguments[i];
    }

    text += ']';

    console.log(text);
};


action();
console.log(sum1(1, 2));
console.log(sum2(1, 2, 3, 4, 5));
print(1, 2, 3, 4, 5);

console.log(action.name);
console.log(sum1.name);
console.log(sum2.name);
console.log(print.name);

Output (with NodeJS):

This is my message...
3
15
a=1, b=2, arguments=[1, 2, 3, 4, 5]

action
sum1
sum2
print

2.2. With own function name

// ONLINE-RUNNER:browser;

var action = function MyFunctionName() {
    console.log('This is my message...');
};

var sum1 = function MyFunctionName(a, b) {
    return a + b;
};

var sum2 = function MyFunctionName(a, b) {
    var result = 0;

    for(var i = 0; i < arguments.length; ++i) {
        result += arguments[i];
    }

    return result;
};

var print = function MyFunctionName(a, b) {
    var text = '';
    
    text += 'a=' + a + ', ';
    text += 'b=' + b + ', ';
    text += 'arguments=[';

    for(var i = 0; i < arguments.length; ++i) {
        if(i > 0) {
            text += ', ';
        }
        text += arguments[i];
    }

    text += ']';

    console.log(text);
};


action();
console.log(sum1(1, 2));
console.log(sum2(1, 2, 3, 4, 5));
print(1, 2, 3, 4, 5);

console.log(action.name);
console.log(sum1.name);
console.log(sum2.name);
console.log(print.name);

Output (with NodeJS):

This is my message...
3
15
a=1, b=2, arguments=[1, 2, 3, 4, 5]

MyFunctionName
MyFunctionName
MyFunctionName
MyFunctionName

3. Arrow function example

Arrow function has been introduced in ES6. This part shows in a simple way how to use arrow functions.

3.1. With function body in brackets

// ONLINE-RUNNER:browser;

var action1 = () => {
    console.log('This is my message...');
};

var action2 = (...myArguments) => {
    console.log(myArguments);
};

var sum = (a, b) => {
    return a + b;
};

var print = (a, b, ...myArguments) => {
    var text = '';
    
    text += 'a=' + a + ', ';
    text += 'b=' + b + ', ';
    text += 'myArguments=[';

    for(var i = 0; i < myArguments.length; ++i) {
        if(i > 0) {
            text += ', ';
        }
        text += myArguments[i];
    }

    text += ']';

    console.log(text);
};


action1();
action2(1, 2, 3, 4, 5);
console.log(sum(1, 2));
print(1, 2, 3, 4, 5);

console.log(action1.name);
console.log(action2.name);
console.log(sum.name);
console.log(print.name);

Output (with NodeJS):

This is my message...
[ 1, 2, 3, 4, 5 ]
3
a=1, b=2, myArguments=[3, 4, 5]

action1
action2
sum
print

3.2. Without brackets - with auto-returning of values

// ONLINE-RUNNER:browser;

var action = () => console.log('This is my message...');

var print1 = text => console.log(text);
var print2 = (...myArguments) => console.log(myArguments);
var print3 = (a, b, ...myArguments) => console.log(a, b, myArguments);

var sum = (a, b) => a + b;


action();
print1('This is my custom text...');
print2(1, 2, 3, 4, 5);
print3(1, 2, 3, 4, 5);
console.log(sum(1, 2));

console.log(action.name);
console.log(print1.name);
console.log(print2.name);
console.log(print3.name);
console.log(sum.name);

Output (with NodeJS):

This is my message...
This is my custom text...
[ 1, 2, 3, 4, 5 ]
1 2 [ 3, 4, 5 ]
3

action
print1
print2
print3
sum

4. Calling function/method ways

The ways how to call function (method) has been described in this article.

See also

  1. JavaScript - different ways to call function

Alternative titles

  1. JavaScript - how to create and use functions?
Donate to Dirask
Our content is created by volunteers - like Wikipedia. If you think, the things we do are good, donate us. Thanks!
Join to our subscribers to be up to date with content, news and offers.
Native Advertising
🚀
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

❤️💻 🙂

Join