reduce filter map play

by andrew rowe

HTML

for
<p></p>
reduce add
<div id='reduce'>
</div>
<table id='reduce_log'>
</table>
filter even
<p></p>
filter odd
<p></p>
map + 3
<p></p>
forEach
<p></p>

JavaScript

var total = 0;
var numbers = [1, 5, 7, 3, 8, 9];
for ( var i = 0; i < numbers.length; i++ ){
    total += numbers[i];
}
document.getElementsByTagName('p')[0].innerHTML= total;
document.getElementById('reduce').innerHTML = [5, 1, 2, 3, 9, 15, -6].reduce( (prev,next,index,arr) =>{ 
	if( index == 1 ){
  	document.getElementById('reduce_log').innerHTML += `<tr><th>prev</th><th>next</th><th>index</th><th>arr</th></tr>`
  }
  document.getElementById('reduce_log').innerHTML += `<tr><td>${prev}</td><td>${next}</td><td>${index}</td><td>${arr}</td></tr>`;
  return prev + next;
});

document.getElementsByTagName('p')[1].innerHTML = [1, 2, 3, 4, 5, 6].filter( x => x % 2 == 0);
document.getElementsByTagName('p')[2].innerHTML = [1, 2, 3, 4, 5, 6].filter( x => x % 2 == 1);
document.getElementsByTagName('p')[3].innerHTML = [1, 2, 3, 4, 5, 6].map( x => x + 2);
[1, 2, 3, 4, 5, 6].reverse().forEach( x => document.getElementsByTagName('p')[4].innerHTML += x);