Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
14 views

Learn JavaScript - Iterators Cheatsheet - Codecademy

The document discusses JavaScript iterators and higher-order functions. It provides examples and explanations of common iterator methods like map, filter, forEach and reduce. It also covers callback functions, passing functions as arguments, and functions being first-class objects.

Uploaded by

bilal.a6t9
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
14 views

Learn JavaScript - Iterators Cheatsheet - Codecademy

The document discusses JavaScript iterators and higher-order functions. It provides examples and explanations of common iterator methods like map, filter, forEach and reduce. It also covers callback functions, passing functions as arguments, and functions being first-class objects.

Uploaded by

bilal.a6t9
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

1/18/24, 10:43 AM Learn JavaScript: Iterators Cheatsheet | Codecademy

Cheatsheets / Learn JavaScript

Iterators

The .reduce() Method

The .reduce() method iterates through an array and const arrayOfNumbers = [1, 2, 3, 4];
returns a single value.
In the above code example, the .reduce() method will
sum up all the elements of the array. It takes a callback const sum =
function with two parameters (accumulator, arrayOfNumbers.reduce((accumulator,
currentValue) as arguments. On each iteration, currentValue) => {
accumulator is the value returned by the last iteration,
return accumulator + currentValue;
and the currentValue is the current element.
Optionally, a second argument can be passed which acts });
as the initial value of the accumulator.

console.log(sum); // 10

The .forEach() Method

The .forEach() method executes a callback function on const numbers = [28, 77, 45, 99, 27];
each of the elements in an array in order.
In the above example code, the callback function
containing a console.log() method will be executed 5 numbers.forEach(number => {
times, once for each element. console.log(number);
});

The .filter() Method

The .filter() method executes a callback function on const randomNumbers = [4, 11, 42, 14, 39];
each element in an array. The callback function for each
const filteredArray =
of the elements must return either true or false . The
returned array is a new array with any elements for which randomNumbers.filter(n => {
the callback function returns true . return n > 5;
In the above code example, the array filteredArray will
});
contain all the elements of randomNumbers but 4 .

https://www.codecademy.com/learn/introduction-to-javascript/modules/learn-javascript-iterators/cheatsheet 1/4
1/18/24, 10:43 AM Learn JavaScript: Iterators Cheatsheet | Codecademy

The .map() Method

The .map() method executes a callback function on const finalParticipants = ['Taylor',


each element in an array. It returns a new array made up
'Donald', 'Don', 'Natasha', 'Bobby'];
of the return values from the callback function.
The original array does not get altered, and the returned
array may contain different elements than the original // add string after each final participant
array.
const announcements =
In the example code above, the .map() method is used
to add ' joined the contest.' string at the end of each finalParticipants.map(member => {
element in the finalParticipants array. return member + ' joined the contest.';
})

console.log(announcements);

Functions Assigned to Variables

In JavaScript, functions are a data type just as strings, let plusFive = (number) => {
numbers, and arrays are data types. Therefore, functions
return number + 5;
can be assigned as values to variables, but are different
from all other data types because they can be invoked. };
// f is assigned the value of plusFive
let f = plusFive;

plusFive(3); // 8
// Since f has a function value, it can be
invoked.
f(9); // 14

https://www.codecademy.com/learn/introduction-to-javascript/modules/learn-javascript-iterators/cheatsheet 2/4
1/18/24, 10:43 AM Learn JavaScript: Iterators Cheatsheet | Codecademy

Callback Functions

In JavaScript, a callback function is a function that is const isEven = (n) => {


passed into another function as an argument. This
return n % 2 == 0;
function can then be invoked during the execution of that
higher order function (that it is an argument of). }
Since, in JavaScript, functions are objects, functions can
be passed as arguments.
let printMsg = (evenFunc, num) => {
const isNumEven = evenFunc(num);
console.log(`The number ${num} is an
even number: ${isNumEven}.`)
}

// Pass in isEven as the callback function


printMsg(isEven, 4);
// Prints: The number 4 is an even number:
True.

Higher-Order Functions

In Javascript, functions can be assigned to variables in the


same way that strings or arrays can. They can be passed
into other functions as parameters or returned from them
as well.
A “higher-order function” is a function that accepts
functions as parameters and/or returns a function.

https://www.codecademy.com/learn/introduction-to-javascript/modules/learn-javascript-iterators/cheatsheet 3/4
1/18/24, 10:43 AM Learn JavaScript: Iterators Cheatsheet | Codecademy

JavaScript Functions: First-Class Objects

JavaScript functions are first-class objects. Therefore: //Assign a function to a variable


They have built-in properties and methods, such
originalFunc
as the name property and the .toString()
method. const originalFunc = (num) => { return num
Properties and methods can be added to them. + 2 };
They can be passed as arguments and returned
from other functions.
They can be assigned to variables, array elements, //Re-assign the function to a new variable
and other objects. newFunc
const newFunc = originalFunc;

//Access the function's name property


newFunc.name; //'originalFunc'

//Return the function's body as a string


newFunc.toString(); //'(num) => { return
num + 2 }'

//Add our own isMathFunction property to


the function
newFunc.isMathFunction = true;

//Pass the function as an argument


const functionNameLength = (func) => {
return func.name.length };
functionNameLength(originalFunc); //12

//Return the function


const returnFunc = () => { return newFunc
};
returnFunc(); //[Function: originalFunc]

Print Share

https://www.codecademy.com/learn/introduction-to-javascript/modules/learn-javascript-iterators/cheatsheet 4/4

You might also like