EN
JavaScript - create and use functions
7
points
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.