[ 자바스크립트 / JavaScript ] 입력값 체크 함수 정리

JavaScript로 입력값을 체크하는 함수는 다양한 유형의 입력값을 확인하고, 그 유효성을 검사하는 기능을 제공합니다. 여기서는 몇 가지 일반적인 입력값 유형 (예: 문자열, 숫자, 이메일, URL, 비밀번호 등)에 대해 체크하는 함수를 작성해 보겠습니다.

1. 일반적인 입력값 체크 함수

먼저, 다양한 유형의 입력값을 체크할 수 있는 일반적인 함수를 작성해 보겠습니다.

function validateInput(value, type) {
    switch (type) {
        case 'string':
            return validateString(value);
        case 'number':
            return validateNumber(value);
        case 'email':
            return validateEmail(value);
        case 'url':
            return validateURL(value);
        case 'password':
            return validatePassword(value);
        case 'korean':
            return containsKorean(value);

        default:
            throw new Error('Invalid type specified for validation');
    }
}

// 문자열 유효성 검사 (공백 및 최소 길이 체크)
function validateString(value, minLength = 1) {
    if (typeof value !== 'string') return false;
    return value.trim().length >= minLength;
}

// 숫자 유효성 검사 (정수 및 범위 체크)
function validateNumber(value, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
    const number = parseFloat(value);
    if (isNaN(number)) return false;
    return number >= min && number <= max;
}

// 이메일 유효성 검사 (정규식을 사용한 간단한 체크)
function validateEmail(value) {
    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    return emailRegex.test(value);
}

// URL 유효성 검사 (정규식을 사용한 간단한 체크)
function validateURL(value) {
    const urlRegex = /^(https?|ftp):\/\/[^\s/$.?#].[^\s]*$/i;
    return urlRegex.test(value);
}

// 비밀번호 유효성 검사 (최소 길이 및 복잡성 체크)
function validatePassword(value, minLength = 8) {
    if (typeof value !== 'string') return false;
    return value.length >= minLength;
}

// 한글 포함 여부 확인 함수
function containsKorean(value) {
    const koreanRegex = /[가-힣]/;
    return koreanRegex.test(value);
}

2. 사용 예제

이제 위에서 정의한 validateInput 함수를 사용하여 다양한 입력값을 검사하는 예제를 살펴보겠습니다.

// 문자열 유효성 검사 예제
console.log(validateInput('Hello', 'string')); // true
console.log(validateInput('   ', 'string'));   // false (공백만 있는 경우)
console.log(validateInput('World', 'string', 5)); // true (최소 길이 5)

// 숫자 유효성 검사 예제
console.log(validateInput('123', 'number')); // true
console.log(validateInput('abc', 'number')); // false (문자열은 숫자가 아님)
console.log(validateInput('100', 'number', 50, 150)); // true (범위 내)

// 이메일 유효성 검사 예제
console.log(validateInput('test@example.com', 'email')); // true
console.log(validateInput('invalid-email', 'email'));   // false

// URL 유효성 검사 예제
console.log(validateInput('https://www.example.com', 'url')); // true
console.log(validateInput('ftp://example.com', 'url'));      // true
console.log(validateInput('invalid-url', 'url'));            // false

// 비밀번호 유효성 검사 예제
console.log(validateInput('P@ssw0rd', 'password'));       // true (기본 최소 길이 8)
console.log(validateInput('short', 'password'));          // false (길이 부족)
console.log(validateInput('LongPassword', 'password', 12)); // true (최소 길이 12)

// 사용 예제
console.log(containsKorean('Hello World'));   // false
console.log(containsKorean('안녕하세요'));       // true
console.log(containsKorean('Hello 안녕'));     // true

3. 함수 설명

• validateInput: 입력값과 유형을 받아, 해당 유형에 따라 적절한 유효성 검사 함수를 호출합니다.
• validateString: 문자열이 공백이 아니고, 지정된 최소 길이 이상인지 검사합니다.
• validateNumber: 값이 유효한 숫자이고, 지정된 범위 내에 있는지 검사합니다.
• validateEmail: 이메일 형식이 유효한지 검사합니다. 간단한 정규식을 사용합니다.
• validateURL: URL 형식이 유효한지 검사합니다. 간단한 정규식을 사용합니다.
• validatePassword: 비밀번호가 지정된 최소 길이 이상인지 검사합니다.
• containsKorean 함수: 문자열에 한글이 포함되어 있는지를 확인합니다.

이제 validateInput 함수를 사용하여 입력값이 한글을 포함하는지 여부도 쉽게 확인할 수 있습니다. 이 함수는 다양한 유형의 입력값 검사를 하나의 인터페이스로 통합하여 사용하기 편리하게 만들어줍니다.

4. 함수 확장

입력값 체크 함수를 확장하여 더욱 복잡한 유효성 검사를 수행할 수도 있습니다. 예를 들어, 비밀번호 복잡성 검사를 강화하여 대문자, 소문자, 숫자, 특수 문자가 포함되도록 할 수 있습니다.

// 비밀번호 유효성 검사 (복잡성 체크 포함)
function validateComplexPassword(value, minLength = 8) {
    if (typeof value !== 'string') return false;
    const hasUpperCase = /[A-Z]/.test(value);
    const hasLowerCase = /[a-z]/.test(value);
    const hasNumber = /\d/.test(value);
    const hasSpecialChar = /[!@#$%^&*(),.?":{}|<>]/.test(value);
    return value.length >= minLength && hasUpperCase && hasLowerCase && hasNumber && hasSpecialChar;
}

// 사용 예제
console.log(validateComplexPassword('P@ssw0rd1')); // true
console.log(validateComplexPassword('password'));  // false

이 함수는 비밀번호가 최소 길이를 만족하면서 대문자, 소문자, 숫자 및 특수 문자를 포함하고 있는지 검사합니다.

이제 JavaScript로 입력값을 체크하는 다양한 함수들을 작성하고 사용할 수 있게 되었습니다. 이를 통해 사용자의 입력값을 효과적으로 검증하고, 애플리케이션의 안정성과 보안을 향상시킬 수 있습니다.