문자열 속 숫자만 추출해 정수로 변환하는 JavaScript 함수 구현하기

일반적으로 자바스크립트에서는 parseInt()나 parseFloat() 같은 내장 함수를 사용해 문자열 형태의 숫자를 Number 타입으로 변환합니다. 하지만 이러한 메서드는 문자열 중간중간 무작위 위치에 숫자가 섞여 있는 경우에는 제대로 작동하지 않습니다.

예를 들어 아래 코드는 454만 반환할 뿐, 우리가 원하는 값인 4545453을 얻지 못합니다.

parseInt('454ffdg54hg53')

따라서 이런 문자열을 입력받아 안에 포함된 모든 숫자를 순서대로 이어 붙인 정수를 반환하는 자바스크립트 함수를 직접 작성해야 합니다.

예제 코드

다음은 해당 기능을 구현한 코드입니다.

const numStr = '454ffdg54hg53';
const parseInteger = numStr => {
    let res = 0;
    for(let i = 0; i < numStr.length; i++){
        if(!+numStr[i]){
            continue;
        };
        res = (res * 10) + (+numStr[i]);
    };
    return res;
};
console.log(parseInteger(numStr));

실행 결과

콘솔에는 다음과 같이 출력됩니다.

4545453

코드 동작 원리

이 함수는 문자열의 각 문자를 처음부터 끝까지 한 글자씩 순회하며 다음 과정을 수행합니다.

• +numStr[i]: 단항 더하기 연산자를 사용해 각 문자를 숫자로 변환합니다.
• 변환 결과가 유효한 숫자가 아니면 continue 문으로 해당 문자를 건너뛰고 다음 문자로 넘어갑니다.
• 숫자라면 기존 결과값에 10을 곱한 뒤 새 자릿수를 더하는 방식으로 값을 누적합니다. 예를 들어 '4', '5', '4'가 차례로 처리되면 0 → 4 → 45 → 454처럼 최종 숫자가 만들어집니다.

이런 방식으로 문자열 어디에 숫자가 위치하든 관계없이, 포함된 모든 숫자를 하나의 정수로 조합해 반환할 수 있습니다.