반응형

퀴즈관련된 로직을 만들던 중 한글 초성 맞추기 관련 로직을 찾아보게되었습니다. 

흔히 쓰지 않는 로직이지만 이참에 정리해 두려고 합니다. 

 

한글의 초성을 추출하기 위해서는 각 한글 문자를 유니코드로 변환한 후, 해당 유니코드에서 특정 값을 빼서 초성의 유니코드를 얻어야 합니다. 그리고 그 유니코드를 다시 문자로 변환하여 초성을 얻을 수 있습니다.

 

const [extractInput, setExtractInput] = useState("");
const [extractChar, setExtractChar] = useState("");
const getInitials = (e) => {
    setExtractInput(e.target.value);
    const str = e.target.value;
    const cho = ["ㄱ", "ㄲ", "ㄴ", "ㄷ", "ㄸ", "ㄹ", "ㅁ", "ㅂ", "ㅃ", "ㅅ", "ㅆ", "ㅇ", "ㅈ", "ㅉ", "ㅊ", "ㅋ", "ㅌ", "ㅍ", "ㅎ"];
    let result = "";
    for (let i = 0; i < str.length; i++) {
        const charCode = str.charCodeAt(i);
        if (charCode >= 0xAC00 && charCode <= 0xD7A3) {
            const uni = charCode - 0xAC00;
            const choIdx = Math.floor(uni / (21 * 28));
            result += cho[choIdx];
        } else {
            result += str[i];
        }
    }
    setExtractChar(result);
}

return(
	<div>
        <input type="text" value={extractInput} onChange={getInitials} style={{border: "1px solid lightgrey"}} />
        <br/>
        <span>range value: {extractChar}</span>
    </div>
)

 

입력된 문자열의 각 문자에 대해 유니코드를 계산하여 초성을 추출하고, 그 결과를 state에 업데이트 해주면됩니다. 

 

charCode >= 0xAC00 && charCode <= 0xD7A3 이 부분은 한글 유니코드의 범위를 체크하는 조건입니다.

0xAC00은 '가'의 유니코드 값으로, 이는 한글 음절의 시작점이며, 초성이 'ㄱ', 중성이 'ㅏ', 종성이 없는 경우를 나타냅니다.
0xD7A3은 '힣'의 유니코드 값입니다. 이는 한글 음절의 끝점이며, 초성이 'ㅎ', 중성이 'ㅣ', 종성이 'ㅎ'인 경우를 나타냅니다.
즉, charCode >= 0xAC00 && charCode <= 0xD7A3 이 조건은 주어진 문자가 한글 음절인지를 확인합니다. 
이 조건이 true이면, 해당 문자는 '가'부터 '힣' 사이의 한글 음절이라는 것을 알 수 있습니다.

이 범위 내의 문자에 대해서만 초성을 추출하는 로직을 적용합니다. 만약 문자가 이 범위 밖에 있다면, 그 문자는 한글 음절이 아니므로 초성 추출 로직을 적용하지 않고, 원래 문자를 그대로 반환합니다.
만약 한글이 아닌 다른 글자가 들어가는경우 그대로 return 하게 됩니다.

반응형

+ Recent posts