I have an array and I create an another array with Array.prototype.map(). How can I console log the x value (the current element being processed in the array) during the map function?
const array1 = [1, 4, 9, 16];
const map1 = array1.map((x) => x * 2);
You can use console.log in a map like this:
const array1 = [1, 4, 9, 16];
const map1 = array1.map((x) => {
console.log(x);
return x * 2;
});
You are using a shorthand return:
() => x returns x just as
() => { return x; }.
But since you are not only returning something you can not use the concise arrow function syntax.
you can use like this:
const array1 = [1, 4, 9, 16];
const map1 = array1.map(function(x){
console.log(x);
return x* 2;
});You can print it like below.
array1.map(function(x) {
console.log(x*2);
return x * 2
});
const array1 = [1, 4, 9, 16];
const map1 = array1.map(function(x) {
console.log(x*2);
return x * 2
});You can use an array:
const array1 = [1, 4, 9, 16];
console.log('Mapping array1...');
const map1 = array1.map((x) => [x * 2, console.log(x)][0]);
console.log('Maped successfully, map1 =', map1);
functions instead of arrow functions, since you can have multiple commands and stuff. But if you need to use arrow functions, this may be an option. It creates an array with two elements: x * 2, which is what you want to return, and a console.log statement, which logs x and returns undefined. Then, the arrow function returns the first element of the array with [0], which contains x * 2, ignoring the undefined returned by the console.log.Use {} to create a block
const array1 = [1, 4, 9, 16];
const map1 = array1.map((x) => {
console.log(x)
return x * 2
});
=>