Top community members
All Wiki Articles Create Wiki Article

Welcome to Dirask IT community! ❤ 💻
We are community of people that helps each other.

If you are beginner in IT field, you are more then welcome to ask questions, it will help you to learn faster. We are here to help you.

We are always beginner in something, we just need to remember it along the way.

there are no wrong questions - Ask Question

JavaScript - how to create and use functions?

0 contributions
7 points

In JavaScript it is possible to create and use functions in few ways.

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

Merged questions

  1. JavaScript - how to create and use function?
  2. How to create and use function in JavaScript?
  3. How to create and use functions in JavaScript?

See also

  1. JavaScript - different ways to call function

0 contributions

Checkout latest Findings & News:

Checkout latest questions:

Checkout latest wiki articles:

Hey 👋
Would you like to know what we do?
  • Dirask is IT community, where we share coding knowledge and help each other to solve coding problems.
  • We welcome everyone,
    no matter what the experience,
    no matter how basic the question is,
    this community will help you.
Read more