JSFiddle - React, Tailwind, and code Playground

by YuHan Chien

HTML

<div id="main"></div>

JavaScript

let lists = [{
	no: 1,
	title: 'hi',
  content: 'all'
},{
	no: 2,
  title: 'hey',
  content: 'everyone'
},{
	no: 6,
  title: 'yo',
  content: 'yo'
},{
	no: 8,
  title: 'haha',
  content: 'hoho'
}]

/* let html = lists.map((list)=>{
  return '<h1>'+list.title+'</h1>' + '<div>'+list.content+'</div>';
}).join(''); */


let content = lists.reduce((html, list)=>{
	//console.log(html);
  return `<h2>${html}<h2><h1>${list.title}</h1>` + `<div>${list.content}</div>`; 
},' ');

document.getElementById('main').innerHTML = content;

let comparison = lists.reduce((a, b)=>{
	console.log('now : ' + a);
	return a > b.no ? a : b.no;
},5);

console.log(comparison);