Loading...

!== null vs !== undefined in Typescript or Javascript, how to check for both at once?

question typescript javascript
Ram Patra Published on November 14, 2024

The choice between !== undefined and !== null depends on the context and what you’re trying to check.

Key Differences:

  1. undefined:
    • A variable or property that has been declared but not assigned a value.
    • A function parameter that was not provided when the function was called.
    • A property that doesn’t exist in an object.
  2. null:
    • An explicit value that represents “no value” or “empty.”
    • Often used to intentionally signify the absence of a value.

When to Use:

  1. Use !== undefined when:
    • You’re dealing with cases where a variable might be uninitialized or omitted.
    • Checking whether a parameter was passed to a function.
    if (value !== undefined) {
      // Do something
    }
    
  2. Use !== null when:
    • You explicitly assign null to indicate “no value.”
    • Checking against a value explicitly set as null.
    if (value !== null) {
      // Do something
    }
    
  3. Use both (value != null) when:
    • You want to check for both null and undefined together, since null and undefined are considered equal in loose equality (==).
    • Commonly used when you don’t care about the specific type of “empty.”
    if (value != null) {
      // Do something if value is not null or undefined
    }
    

Best Practice:

  • Prefer strict equality checks (!== or ===) for better type safety and clarity.
  • Use != null only when you explicitly want to check for both null and undefined.

For your example:

  • offerPrice !== undefined is correct if you’re checking whether the parameter was passed.
  • If offerPrice might explicitly be null, you should use offerPrice != null to handle both cases.
Presentify

Take your presentation to the next level.

FaceScreen

Put your face and name on your screen.

ToDoBar

Your to-dos on your menu bar.

Ram Patra Published on November 14, 2024
Image placeholder

Keep reading

If this article was helpful, others might be too

question eslint nextjs November 14, 2024 How to disable ESLint in a Nextjs project?

Although it is highly advisable to enable ESLint at all times, if you do not want ESLint to run during next build, you can set the eslint.ignoreDuringBuilds option in next.config.js to true like below:

question typescript react September 28, 2024 How to add a custom element to a Next.js/Typescript project?

Let’s say I have a custom element setapp-badge that I want to use in my tsx files. If I go ahead and use it, the compiler will throw an error and Next.js will fail to build. It seems the problem might be a combination of how Next.js, TypeScript, and custom elements work together. Therefore, let’s try an approach that avoids the namespace/module issues while ensuring custom elements are recognized in a Next.js/TypeScript project.

question front-end javascript August 28, 2024 8 best Javascript libraries for building fast-changing tables

For handling fast-changing tables in JavaScript, you’ll want libraries that are optimized for performance, support real-time data updates, and are flexible enough to handle a wide range of use cases. Here are some of the best libraries: