JavaScript로 16진수(Hex) 코드 유효성 검사하기

문자열이 유효한 16진수(hex) 코드로 인정받으려면, 숫자 0~9와 영문자 a~f 외에 다른 어떤 문자도 포함되어서는 안 됩니다.

예시

'3423ad' → 유효한 16진수 코드
'4234es' → 유효하지 않은 16진수 코드

이번 글에서는 문자열을 입력받아 해당 문자열이 유효한 16진수 코드인지 판별하는 자바스크립트 함수를 작성해 보겠습니다.

구현 방법

가장 직관적인 접근 방식은 허용 가능한 문자 목록(legend)을 미리 정의해 두고, 문자열의 각 문자가 이 목록에 포함되어 있는지 하나씩 확인하는 것입니다. 목록에 없는 문자가 하나라도 발견되면 즉시 false를 반환하고, 모든 문자가 통과하면 true를 반환합니다.

const str1 = '4234es';
const str2 = '3423ad';

const isHexValid = str => {
   const legend = '0123456789abcdef';
   for(let i = 0; i < str.length; i++){
      if(legend.includes(str[i])){
         continue;
      };
      return false;
   };
   return true;
};

console.log(isHexValid(str1));
console.log(isHexValid(str2));

실행 결과

콘솔에는 아래와 같은 결과가 출력됩니다.

false
true

정규표현식을 활용한 더 간결한 방법

반복문 대신 정규표현식을 사용하면 훨씬 간결하게 같은 기능을 구현할 수 있습니다.

const isHexValidRegex = str => /^[0-9a-f]+$/i.test(str);

console.log(isHexValidRegex('3423AD')); // true (대소문자 구분 없음)
console.log(isHexValidRegex('4234es')); // false

정규표현식 끝에 붙인 i 플래그 덕분에 대문자 A~F도 함께 허용됩니다. 실제 16진수 색상 코드처럼 대소문자가 섞여 있는 입력을 다룰 때는 이 방식이 더 유연하고 실용적입니다. 상황에 맞게 반복문 방식과 정규표현식 방식 중 하나를 선택해 사용하시면 됩니다.