babel-plugin-transform-es2015-destructuring

What is babel-plugin-transform-es2015-destructuring?

The babel-plugin-transform-es2015-destructuring package is a Babel plugin that transforms ES2015 destructuring syntax into ES5 code. This allows developers to use modern JavaScript destructuring features while maintaining compatibility with older JavaScript environments.

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

Array Destructuring

Transforms array destructuring syntax into ES5 code. This allows you to extract values from arrays and assign them to variables in a concise manner.

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

Object Destructuring

Transforms object destructuring syntax into ES5 code. This allows you to extract properties from objects and assign them to variables in a concise manner.

const { x, y } = { x: 1, y: 2 };

Nested Destructuring

Transforms nested destructuring syntax into ES5 code. This allows you to extract nested properties from objects and assign them to variables.

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

Default Values

Transforms destructuring with default values into ES5 code. This allows you to assign default values to variables if the property is undefined.

const { a = 10 } = {};

Other packages similar to babel-plugin-transform-es2015-destructuring

babel-plugin-transform-es2015-parameters

This package transforms ES2015 parameter syntax, including default parameters and rest parameters. While it does not focus solely on destructuring, it complements destructuring transformations by handling parameter-related syntax.

babel-plugin-transform-es2015-spread

This package transforms ES2015 spread syntax for arrays and objects. It is related to destructuring as both features are often used together to handle complex data structures in a concise manner.

README

babel-plugin-transform-es2015-destructuring

Compile ES2015 destructuring to ES5

Examples

In

let arr = [1,2,3];
let {x, y, z} = arr;

Out

var arr = [1, 2, 3];
var x = arr.x,
    y = arr.y,
    z = arr.z;

Installation

npm install --save-dev babel-plugin-transform-es2015-destructuring

Usage

Via .babelrc (Recommended)

.babelrc

{
  "plugins": ["transform-es2015-destructuring"]
}

Via CLI

babel --plugins transform-es2015-destructuring script.js

Via Node API

require("babel-core").transform("code", {
  plugins: ["transform-es2015-destructuring"]
});