특정 문자열을 볼드, 하이라이트 등 강조 처리 하는 방법

어느날 들어온 질문 하나. 전체 문구와 일부 단어를 드리면 해당 부분만 볼드처리해주실 수 있나요? 아마 될 것 같지만 확인은 한 번 해보겠다고 하고, 어떻게 풀어나갈까 생각했다. 생각해보니 검색창에 검색어를 입력할 때, 해당 부분만 표시된다거나 하는 코드라고 생각하면 쉬울 것 같아 어떻게 풀어내었는지 메모삼아 작성한다.

 

✔️ 정규식을 이용하자

---

// const text = '웹 애플리케이션 보안 완벽 가이드';
// const bold = '보안';

if (text.includes(bold)) {  // 매치되는 단어가 있는지 확인한다.
  // true일 때, 
  const regex = new RegExp(bold, "g");
  text.replace(regex, "<b>" + bold + "</b>");
  // 전체문장.replace(regex, 치환 할 문자);
}