const test = [3, 5, 6, 7, 8, 0, "", null, undefined, "testing"];


 test.forEach(listItem);

function listItem(item, number, total) {
    return `<li class="${number}">${item} ${number} of ${total}</li>`;
}


let htmlDOM = `<ul>${test.map((item, index, array) => listItem(item, `${index + 1}`, `${array.length}`)).join("")}</ul>`;
  

//console.log(htmlDOM);

/**

'<ul><li class="1">3 1 of 10</li><li class="2">5 2 of 10</li><li class="3">6 3 of 10</li><li class="4">7 4 of 10</li><li class="5">8 5 of 10</li><li class="6">0 6 of 10</li><li class="7"> 7 of 10</li><li class="8">null 8 of 10</li><li class="9">undefined 9 of 10</li><li class="10">testing 10 of 10</li></ul>'

*/

function getKey(k) {
  return `a key named ${k}`;
}

// bad
const obj = {
  id: 5,
  name: 'San Francisco',
};
obj[getKey('enabled')] = true;

// good
const obj = {
  id: 5,
  name: 'San Francisco',
  [getKey('enabled')]: true,
};