@babel/plugin-proposal-nullish-coalescing-operator

What is @babel/plugin-proposal-nullish-coalescing-operator?

The @babel/plugin-proposal-nullish-coalescing-operator package allows developers to use the nullish coalescing operator (??) in their JavaScript code. This operator is a logical operator that returns its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand. This plugin transforms nullish coalescing operator syntax into equivalent JavaScript code that can be understood by JavaScript engines that do not support this feature natively.

What are @babel/plugin-proposal-nullish-coalescing-operator's main functionalities?

Nullish Coalescing for Default Values

Use the nullish coalescing operator to provide a default value for a variable that might be null or undefined. This is useful for handling API responses that might not return data.

const response = apiResponse ?? 'default value';

Combining with Logical OR for Fallbacks

Combine the nullish coalescing operator with the logical OR operator to provide a default value that is an object if both user settings and default settings are null or undefined. This showcases how nullish coalescing can be used in conjunction with other logical operators for more complex fallback mechanisms.

const settings = userSettings ?? defaultSettings || {};

Other packages similar to @babel/plugin-proposal-nullish-coalescing-operator

@babel/plugin-proposal-optional-chaining

Similar to the nullish coalescing operator, the optional chaining plugin (@babel/plugin-proposal-optional-chaining) allows developers to safely access deeply nested properties of an object without having to check for the existence of each level in the chain. While nullish coalescing provides a way to handle null or undefined values, optional chaining helps in accessing properties that might not exist. Both enhance code readability and safety.

lodash.get

The lodash.get function from the lodash library allows developers to access properties of an object safely, providing a default value if the property does not exist. While it serves a similar purpose in safely handling data that might be undefined or null, it does so in a different manner compared to the nullish coalescing operator, which is a language feature transformed by the @babel/plugin-proposal-nullish-coalescing-operator.

README

@babel/plugin-proposal-nullish-coalescing-operator

Replace ?? with an inline helper.

Example

In

var foo = object.foo ?? "default";

Out

var _object$foo;

var foo = (_object$foo = object.foo) !== null && _object$foo !== void 0 ? _object$foo : "default";

NOTE: We cannot use != null here because document.all == null and document.all has been deemed not "nullish".

Installation

npm install --save-dev @babel/plugin-proposal-nullish-coalescing-operator

Usage

Via .babelrc (Recommended)

.babelrc

{
  "plugins": ["@babel/proposal-nullish-coalescing-operator"]
}

Via CLI

babel --plugins @babel/proposal-nullish-coalescing-operator script.js

Via Node API

require("@babel/core").transform("code", {
  plugins: ["@babel/proposal-nullish-coalescing-operator"]
});

Options

loose

boolean, defaults to false.

When true, this transform will pretend document.all does not exist, and perform loose equality checks with null instead of string equality checks against both null and undefined.

Example

In

var foo = object.foo ?? "default";

Out

var _object$foo;

var foo = (_object$foo = object.foo) != null ? _object$foo : "default";

References

• Proposal: Nullish Coalescing