우리가 알고 있듯이 JavaScript는 동적으로 유형이 지정되는 언어이므로 비어 있거나 존재하지 않는 값을 처리할 때 때때로 혼란을 줄 수 있습니다. 이 블로그 게시물에서는 JavaScript의 null, 정의되지 않음, 빈 문자열 및 빈 배열 간의 차이점을 각 개념을 설명하는 코드 예제와 함께 살펴보겠습니다.

1. 널

null은 의도적인 값이 아닙니다. 값 없음.
을 갖는 것으로 명시적으로 정의된 변수를 나타냅니다.

let myVariable = null;
console.log(myVariable); // Output: null
console.log(typeof myVariable); // Output: "object"

참고: null 유형은 객체를 반환하는데, 이는 레거시 이유로 인해 JavaScript에서 알려진 특이한 현상입니다.

2. 정의되지 않음

undefine은 선언되었지만 아직 값이 할당되지 않은 변수를 나타냅니다.

let myUndefinedVariable;
console.log(myUndefinedVariable); // Output: undefined
console.log(typeof myUndefinedVariable); // Output: "undefined"

function myFunction(param) {
    console.log(param);
}
myFunction(); // Output: undefined

3. 빈 문자열('')

빈 문자열은 길이가 0인 유효한 문자열입니다.

let emptyString = '';
console.log(emptyString); // Output: ""
console.log(typeof emptyString); // Output: "string"
console.log(emptyString.length); // Output: 0

4. 빈 배열([])

빈 배열은 요소가 없는 목록입니다.

let emptyArray = [];
console.log(emptyArray); // Output: []
console.log(typeof emptyArray); // Output: "object"
console.log(Array.isArray(emptyArray)); // Output: true
console.log(emptyArray.length); // Output: 0

5. 비교 및 ​​사용 사례

다음과 같은 다양한 유형을 비교해 보겠습니다.

console.log(null == undefined); // Output: true
console.log(null === undefined); // Output: false

console.log('' == null); // Output: false
console.log('' == undefined); // Output: false

console.log([] == null); // Output: false
console.log([] == undefined); // Output: false

console.log(Boolean(null)); // Output: false
console.log(Boolean(undefined)); // Output: false
console.log(Boolean('')); // Output: false
console.log(Boolean([])); // Output: true

null 또는 정의되지 않음 확인

function isNullOrUndefined(value) {
    return value == null;
}

console.log(isNullOrUndefined(null)); // Output: true
console.log(isNullOrUndefined(undefined)); // Output: true
console.log(isNullOrUndefined('')); // Output: false
console.log(isNullOrUndefined([])); // Output: false

빈 문자열 및 배열 처리

function isEmpty(value) {
    if (typeof value === 'string') {
        return value.length === 0;
    }
    if (Array.isArray(value)) {
        return value.length === 0;
    }
    return false;
}

console.log(isEmpty('')); // Output: true
console.log(isEmpty([])); // Output: true
console.log(isEmpty('hello')); // Output: false
console.log(isEmpty([1, 2, 3])); // Output: false

6. 모범 사례

1. 변수에 명시적으로 값이 없음을 나타내려면 null을 사용하세요.
2. 변수에 값이 할당되지 않은 경우 변수를 정의하지 않도록 합니다.
3. 문자가 없는 문자열이 필요한 경우 빈 문자열('')을 사용하세요.
4. 요소가 없는 목록이 필요한 경우 빈 배열([])을 사용하세요.
5. 특별한 이유가 없는 한 항상 엄격한 동등성(===)을 사용하세요.
6. null 또는 정의되지 않음을 확인할 때 value == null을 사용할 수 있습니다.

결론

깨끗하고 버그 없는 JavaScript 코드를 작성하려면 null, 정의되지 않음, 빈 문자열 및 빈 배열 간의 차이점을 이해하는 것이 중요합니다. 각각에는 고유한 사용 사례가 있으며 비교 및 ​​유형 확인에서 다르게 동작합니다. 이러한 값을 올바르게 사용하고 그 미묘한 차이를 알면 더욱 강력하고 유지 관리가 쉬운 JavaScript 애플리케이션을 작성할 수 있습니다.

사용할 항목을 결정할 때 항상 애플리케이션의 컨텍스트를 고려하고 코드베이스 전반에 걸쳐 접근 방식을 일관되게 유지하는 것을 기억하세요.