Here are the top 15 points related to JavaScript functions that are essential to learn
Varsha Tyagi
Senior Frontend Engineer | ui developer | Angular 2+ | Javascript | Rxjs | Typescript | TDD @hexaware
Function Declaration: Functions can be declared using the function keyword followed by a name, parameters, and a block of code.
function greet(name) {
? return Hello, ${name}!;
}
Function Expression: Functions can be assigned to variables. These are known as function expressions.
const greet = function(name) {
? return Hello, ${name}!;
};
Arrow Functions: Arrow functions provide a shorter syntax and automatically bind this to the context in which they are defined.
const greet = (name) => Hello, ${name}!;
?
Anonymous Functions: Functions without a name are called anonymous functions. They are often used in situations like callbacks.
setTimeout(function() {
? console.log('Hello, World!');
}, 1000);
Immediately Invoked Function Expression (IIFE): An IIFE is a function that is executed right after its definition.
(function() {
? console.log('IIFE executed!');
})();
Function Parameters and Arguments: Functions can accept parameters, which are values passed into the function. JavaScript functions can also accept any number of arguments, even if parameters are not explicitly defined.
function add(a, b) {
? return a + b;
}
add(2, 3); // 5
Default Parameters: You can set default values for function parameters.
function greet(name = 'Stranger') {
? return Hello, ${name}!;
}
Rest Parameters: Rest parameters allow you to handle an indefinite number of arguments as an array.
function sum(...numbers) {
? return numbers.reduce((acc, val) => acc + val, 0);
}
Returning Values: Functions can return values using the return keyword. If no return is specified, the function returns undefined.
function multiply(a, b) {
? return a * b;
}
Function Scope: Variables defined inside a function are not accessible outside the function, creating a local scope.
function scopeExample() {
? let x = 10;
? console.log(x); // 10
}
console.log(x); // Error: x is not defined
Closures: A closure is created when a function retains access to its outer scope, even after the outer function has finished executing.
领英推荐
function outer() {
? let count = 0;
? return function inner() {
??? count++;
?? return count;
? };
}
const counter = outer();
console.log(counter()); // 1
console.log(counter()); // 2
Callbacks: A callback is a function passed as an argument to another function and executed after some operation is completed.
function fetchData(callback) {
? setTimeout(() => {
??? callback('Data fetched');
? }, 1000);
}
fetchData((message) => console.log(message)); // Data fetched
Higher-Order Functions: A higher-order function is a function that can take another function as an argument or return a function.
function createMultiplier(multiplier) {
? return function(number) {
??? return number * multiplier;
? };
}
const double = createMultiplier(2);
console.log(double(5)); // 10
Recursion: A recursive function is one that calls itself to solve smaller instances of the same problem.
function factorial(n) {
? if (n === 0) return 1;
? return n * factorial(n - 1);
}
console.log(factorial(5)); // 120
Pure Functions: A pure function is a function that, given the same inputs, always returns the same output and has no side effects (e.g., modifying global variables or outputting to the console).
function add(a, b) {
? return a + b;
}
console.log(add(2, 3)); // 5 (always returns 5 for the same input)
// Testing a pure function
function square(n) {
return n * n;
}
console.log(square(4)); // 16
console.log(square(4)); // Still 16, no matter how many times we call it
Remember, every expert was once a beginner!
#JavaScript #WebDevelopment #Coding #Programming #Tech