JavaScript 및 TypeScript 개발자는 동일한 조건을 반복적으로 작성하는 경우가 많습니다. 웹 개발자라면 아마도 다음과 같은 코드를 접했을 것입니다.
const handleSaveTextKeydown = (event: KeyboardEvent) => { if (event.key === 'Enter') { //... save text } }
이 경우 event.key는 문자열 유형이며, 예를 들어 'Enter'에 실수로 공백이 포함되어 버그가 발생하기 쉽습니다.
이 조건을 함수로 캡슐화해 보는 것은 어떨까요?
const handleSaveTextKeydown = (event: KeyboardEvent) => { if (checkIsEnterKey(event.key)) { //... save text } }
이렇게 하면 Enter 키에 대한 모든 검사가 일관되고 신뢰할 수 있게 됩니다.
이제 다음 검증을 고려해보세요.
type Value = null | object; const value = {} as Value; if (typeof value === 'object') { value; // value type is null | object }
TypeScript가 똑똑하더라도 조건 내부의 값은 Value 유형으로 유지됩니다. 이는 typeof null이 '객체'를 반환하기 때문입니다.
따라서 다음과 같이 작성해야 합니다.
if (value !== null && typeof value === 'object') { value; // value type is object }
많은 개발자는 이를 함수로 캡슐화하지 않고 대신 이러한 상황이 발생할 때마다 반복적으로 작성합니다.
살면서 같은 조건을 몇 번이나 썼나요?
같은 실수를 몇 번이나 저질렀나요?
앞으로 같은 조건을 몇 번이나 더 쓰게 될까요?
나라면 이렇게 하겠다.
if (checkIsObject(value)) { value; // value type is object }
함수에 일반 조건을 캡슐화하면 많은 이점이 있습니다.
다음 예를 고려해보세요.
const array = [0, 1, 2, 3, 4, 5, null, undefined];
null 값만 제외하는 배열을 만들어 보겠습니다.
간결함을 우선시하여 다음과 같이 작성할 수도 있습니다.
const numbers = array.filter(Boolean);
안타깝게도 이는 이상적이지 않습니다. 0도 false로 평가되어 제외됩니다. 따라서 다음과 같이 작성해야 합니다.
const numbers = array.filter(item => item !== null && item !== undefined);
보기 흉하고 재사용이 불가능한 코드처럼 느껴지지 않나요?
더 우아한 코드를 작성할 수 있습니다:
const numbers = array.filter(checkIsNullish);
일반 조건을 반복적으로 작성하지 마세요. 실수만 낳고 코드 가독성도 떨어지게 됩니다.
제가 만든 checker라는 라이브러리를 소개하겠습니다.
이 유틸리티 함수 라이브러리는 일반적인 웹 개발 및 하위 수준 개발에서 일반적으로 사용되는 조건을 함수로 나타냅니다. 모든 함수는 입력을 받아 부울 값을 반환합니다.
이 기사를 작성하는 시점에는 문자열, 숫자, 부울, null 값과 같은 데이터 유형을 처리하는 다양한 함수를 제공합니다. 모든 기능은 테스트되고 문서화되었으며 사용하기 쉽습니다.
실제 사례를 살펴보겠습니다.
이 라이브러리에서 제공하는 패키지는 모두 JSR에 게시되어 있습니다. NPM, PNPM, Yarn, Bun, Deno 프로젝트에 쉽게 설치할 수 있습니다.
여기에서는 NPM의 예로 @checker/string 패키지를 살펴보겠습니다.
프로젝트 디렉터리에서 다음 명령을 실행하세요.
npx jsr add @checker/string
import { checkIsNotEmptyString, checkIsIndexFound } from "@checker/string"; const value = "Hello"; const formatted = value.trim(); if (checkIsNotEmptyString(formatted)) { // formatted !== '' // When formatted is not an empty string } const index = value.indexOf("el"); if (checkIsIndexFound(index)) { // index !== -1 // When "el" is found in value }
저는 부울 값을 반전시키기 위해 !SOME_CONDITION과 같은 논리 부정 연산자를 사용하는 것을 좋아하지 않습니다. 이는 암시적이기 때문에 단순히 부울 값을 추가하거나 생략하여 반전시키는 것은 많은 위험한 상황을 초래할 수 있습니다.
따라서 모든 함수에는 해당 checkIsNot~ 함수가 정의되어 있습니다.
함수에 일반 조건을 캡슐화합니다. 이렇게 하면 코드를 더 쉽게 읽을 수 있고 버그를 더 쉽게 발견할 수 있습니다.
읽어주셔서 감사합니다.
위 내용은 # 일반 검증을 재사용 가능한 함수로 대체의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!