... Spread operator with already an array as parameter [duplicate] - javascript

This question already has answers here:
Spread Syntax vs Rest Parameter in ES2015 / ES6
(11 answers)
What is the meaning of "foo(...arg)" (three dots in a function call)?
(4 answers)
Closed 1 year ago.
I have this working code (puppeteer) :

async function extractedEvaluateCall(page) {
await page.waitForXPath(xpath);
const links = await page.$x(xpath);
const results = await page.evaluate((...links) => {
return links.map(e => e.innerText);
}, ...links);
}
What does the notation ... does here ?
I tried without, it doesn't work:
UnhandledPromiseRejectionWarning: TypeError: Converting circular structure to JSON Are you passing a nested JSHandle?
links is already an array, why the need of spread operator ?

Related

JS three dot operator in Array [duplicate]

This question already has answers here:
JavaScript (ES6): Using spread operator inside conditional expression (?-operator) [duplicate]
(1 answer)
Spread syntax ES6 with statement
(2 answers)
Closed 17 days ago.
I am wondering what does this three dot operator do in this case:
const csv = [
columns
...data
].map((row) => {
return Object.values(row).join(",");
}).join("\n");
I am trying to convert data to CSV, and if I assign data in the array without three dots operator like this:
const csv = [columns, data].map ...
It returns [object Object], while the one with three dot operators returns the correct data.
What does the operator do here?
I want to add a ternary operator but it seems like it's prohibited with a three dots operator.
what I want to achieve:
const csv = [
columns
(condition) ? ...anotherData : ...data
].map ...
Move the spread syntax (...) before the conditional operator.
const csv = [columns, ...condition ? anotherData : data];

JavaScript Rest operator [duplicate]

This question already has answers here:
Spread Syntax ES6
(8 answers)
Closed 7 months ago.
I am trying to learn javascript but having trouble in the spread and rest operators.
Can't understand whats happening here how dose this take in the taxRate parameter like a singel number when we spred the itemsBought parameter
function addTaxToPrices (taxRate, ...itemsBought)
{
return(itemsBought.map(item => item*taxRate));
}
let ShoppingCart=addTaxToPrices(1.1,46,89,35,79);
console.log(ShoppingCart)
for my understanding it is nearly the same than if you do:
function addTaxToPrices (taxRate, itemsBought)
{
return(itemsBought.map(item => item*taxRate));
}
itemsBought = [46,89,35,79]
let ShoppingCart=addTaxToPrices(1.1,itemsBought);
console.log(ShoppingCart)

Use object destructuring prefer-destructuring [duplicate]

This question already has answers here:
How to fix Eslint error "prefer-destructuring"?
(3 answers)
Closed 11 months ago.
I am codding first time on Vue.js and I have problem. Can you describe me the solution or problem.enter image description here
const { data } = await ...
Use this in 108 and 97 lines.
Your promise object has a data element. Currently, you are accessing your data element using dot (.) syntax. ( Your promise object.data is returning data).
You can use object destructuring to directly access the data element from inside your promise object
const { data } = (await this.$api.auth.sighIN({
email: this.email,
password: this.form.password,
}));

Adding {} to map breaks it [duplicate]

This question already has answers here:
Why doesn't my arrow function return a value?
(1 answer)
When should I use a return statement in ES6 arrow functions
(6 answers)
Arrow function without curly braces
(9 answers)
Curly Brackets in Arrow Functions
(3 answers)
Closed 1 year ago.
Why does this work:
const final = pdata.map((p) => p.nodeName);
// returns [ 'H1', 'P', 'P' ] like its supposed to
But this returns undefined in all of them:
const final = pdata.map((p) => {
p.nodeName
});
// returns [ undefined, undefined, undefined ]
I need to add a couple if statements inside to check for the different types but the {} seems to break it. Am I not supposed to this this in a .map()? Or is there another way to do this?
The usage of {...} is to encapsulate multiple statements.
You need to specify the return keyword:
const final = pdata.map((p) => {
return p.nodeName;
});

Javascript map() method and arrow function [duplicate]

This question already has answers here:
When should I use a return statement in ES6 arrow functions
(6 answers)
How is () => {...} different from () => [duplicate]
(4 answers)
Arrow function without curly braces
(9 answers)
Are 'Arrow Functions' and 'Functions' equivalent / interchangeable?
(4 answers)
Closed 2 years ago.
This probably suits other methods as well but the one i'm using at the moment is map().
How come:
const singleFruit = fruits.map((fruit) => fruit.toUpperCase());
console.log(singleFruit);
returns the array the correct way, with everything in uppercase, when:
const singleFruit = fruits.map((fruit) => {
fruit.toUpperCase();
});
console.log(singleFruit);
gives me an array but with my assigned fruits are now undefined. I can solve this by adding return before "fruit.toUpperCase();" I thought that the second code was the exact same as the first one but without the curly braces.
Thanks!

Categories