Skip to main content
Commonmark migration
Source Link

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); const results = Array(query.snapshotLength).fill(0).map((element, index) => query.snapshotItem(index)); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Performance Comparison

###Performance Comparison CompareCompare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); const results = Array(query.snapshotLength).fill(0).map((element, index) => query.snapshotItem(index)); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

###Performance Comparison Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); const results = Array(query.snapshotLength).fill(0).map((element, index) => query.snapshotItem(index)); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Performance Comparison

Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

deleted 22 characters in body
Source Link

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

varconst query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); varconst results = Array(query.snapshotLength).fill(0).map(function(element, index) {  => return query.snapshotItem(index); }); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

varconst query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

###Performance Comparison Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); var results = Array(query.snapshotLength).fill(0).map(function(element, index) {  return query.snapshotItem(index); }); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

###Performance Comparison Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); const results = Array(query.snapshotLength).fill(0).map((element, index) => query.snapshotItem(index)); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

const query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

###Performance Comparison Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

update code in for loop example
Source Link

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); var results = Array(query.snapshotLength).fill(0).map(function(element, index) { return query.snapshotItem(index); }); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node, nodes = [];noderesult.iterateNext(); node; node = result.iterateNext();) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node, nodes = [];noderesult.iterateNext(); node; node = result.iterateNext();) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

###Performance Comparison Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); var results = Array(query.snapshotLength).fill(0).map(function(element, index) { return query.snapshotItem(index); }); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

for(var node, nodes = [];node = result.iterateNext();) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); for(var node, nodes = [];node = result.iterateNext();) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

###Performance Comparison Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

There doesn't appear to be a way to get the results directly from document.evaluate().

Taking the concept from this answer, one could get a snapshot result, create an array filled with dummy values (e.g. 0s) and then map calls to snapshotItem().

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); var results = Array(query.snapshotLength).fill(0).map(function(element, index) { return query.snapshotItem(index); }); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

While less of a functional programming approach, one could also just use a for loop:

var query = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null); for (var i=0, results = []; i< query.snapshotLength; results.push(query.snapshotItem(i++))); console.log(results);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

Additionally, given the last example of Equivalent constructs, the while loop could be rewritten as a for loop as well:

for ( ; condition; ) { statements; } 

So the original code could be written as such:

var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } 

See this demonstrated in the snippet below:

var result = document.evaluate("//*[@*[starts-with(name(), 'temp')]]", document, null, XPathResult.ANY_TYPE, null); var nodes = []; for(var node = result.iterateNext(); node; node = result.iterateNext()) { nodes.push(node); } console.log(nodes);
<div temp-callback="1" temp-post-callback="4"></div> <div temp-callback="2"></div> <div></div> <div temp-callback="8" temp-post-callback="7"></div>

###Performance Comparison Compare the four approaches with this jsperf example. In Chrome, Firefox, and MS Edge it reports that the original code is the fastest.

update explanation
Source Link
Loading
simplify first for statement
Source Link
Loading
Bounty Awarded with 50 reputation awarded by alecxe
add performance comparison
Source Link
Loading
add section about re-writing while as for loop
Source Link
Loading
add explicit explanation
Source Link
Loading
add for loop example
Source Link
Loading
Source Link
Loading