javascript演習 6日目/３０日

覚えたこと

fetch()はpromise
push()にスプレッド構文

fetch(endpoint)
  .then(blob => blob.json())
  .then(data => cities.push(...data));

filterとmatch()
new RegExp()

cities.filter(place => {
  const regex = new RegExp(word,'gi');
  return place.match(regex)
});

inputにchangeとkeyup

searchInput.addEventListener('change' , displayMatches);
searchInput.addEventListener('keyup' , displayMatches);

replace()

const regex = new RegExp(this.value, 'gi');
place.replace(regex,`<span class="hl">${this.value}</span>`)

map()に${}して、htmlを書き換える
join()

const html = matchArray.map(place => {
    return `
    <li>
      <span class="name">${place.city},${place.state}</span>
      <span class="population">${place.population}</span>
    </li>
    `;
  }).join('')
  suggestions.innerHTML = html;

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

参考