@babel/plugin-transform-destructuring

What is @babel/plugin-transform-destructuring?

The @babel/plugin-transform-destructuring npm package is a plugin for Babel, a JavaScript compiler, that enables the transformation of destructuring assignments and rest properties in JavaScript code. This allows for more concise and readable code, especially when dealing with objects or arrays. The plugin is part of the larger Babel ecosystem, which helps developers write next-gen JavaScript today.

What are @babel/plugin-transform-destructuring's main functionalities?

Object Destructuring

Transforms object destructuring syntax into a format that can be understood by environments that do not support ES2015 or later. This feature allows for extracting properties from objects and assigning them to variables in a single statement.

const { a, b } = { a: 1, b: 2 };

Array Destructuring

Enables transformation of array destructuring, which allows for a similar concise syntax for arrays as for objects, extracting values from arrays directly into variables.

const [a, b] = [1, 2];

Nested Destructuring

Supports nested destructuring, which is useful for extracting deeply nested properties or values from objects or arrays into variables at various levels of depth.

const { a: { b, c } } = { a: { b: 1, c: 2 } };

Default Values

Allows for setting default values in destructuring assignments, which is particularly useful when the expected property might not exist in the source object or array.

const { a = 10, b = 5 } = { a: 3 };

Other packages similar to @babel/plugin-transform-destructuring

babel-plugin-transform-es2015-destructuring

This package offers similar functionality to @babel/plugin-transform-destructuring but is specifically targeted at transforming ES2015 destructuring syntax. It's part of the older Babel 6 ecosystem and has been superseded by the more general @babel/plugin-transform-destructuring in Babel 7.

babel-preset-env

While not a direct equivalent, babel-preset-env includes @babel/plugin-transform-destructuring among many other plugins. It automatically determines the Babel plugins and polyfills you need based on your supported environments. It's a more comprehensive solution for writing next-gen JavaScript.

README

@babel/plugin-transform-destructuring

Compile ES2015 destructuring to ES5

See our website @babel/plugin-transform-destructuring for more information.

Install

Using npm:

npm install --save-dev @babel/plugin-transform-destructuring

or using yarn:

yarn add @babel/plugin-transform-destructuring --dev

Changelog

v7.28.0 (2025-07-02)

:rocket: New Feature

• babel-node
  • #17147 Support top level await in node repl (@liuxingbaoyu)
• babel-types
  • #17258 feat(matchesPattern): support super/private/meta (@JLHwung)
• babel-compat-data, babel-preset-env
  • #17355 Add explicit resource management to preset-env (@JLHwung)
• babel-core, babel-parser
  • #17390 Support sourceType: "commonjs" (@JLHwung)
• babel-generator, babel-parser
  • #17346 Materialize explicitResourceManagement parser plugin (@JLHwung)
• babel-plugin-proposal-destructuring-private, babel-plugin-proposal-do-expressions, babel-plugin-transform-object-rest-spread, babel-traverse, babel-types
  • #17391 LVal coverage updates (Part 2) (@JLHwung)
• babel-parser, babel-traverse, babel-types
  • #17378 Accept bigints in t.bigIntLiteral factory (@JLHwung)
• babel-generator, babel-plugin-proposal-destructuring-private, babel-plugin-proposal-discard-binding, babel-plugin-transform-destructuring, babel-plugin-transform-explicit-resource-management, babel-plugin-transform-react-display-name, babel-types
  • #17277 Transform discard binding (@JLHwung)
• babel-generator, babel-parser, babel-plugin-proposal-destructuring-private, babel-plugin-transform-block-scoping, babel-plugin-transform-object-rest-spread, babel-plugin-transform-typescript, babel-traverse, babel-types
  • #17163 Parse discard binding (@JLHwung)

:bug: Bug Fix

• babel-helper-globals, babel-plugin-transform-classes, babel-traverse
  • #17297 Create babel-helper-globals (@JLHwung)
• babel-types
  • #17009 feature: TSTypeOperator: keyof (#16799) (@coderaiser)

:house: Internal

• babel-compat-data, babel-plugin-proposal-decorators, babel-plugin-transform-async-generator-functions, babel-plugin-transform-json-modules, babel-plugin-transform-regenerator, babel-plugin-transform-runtime, babel-preset-env, babel-runtime-corejs3
  • #17403 Update babel-polyfill packages (@nicolo-ribaudo)