ES6 JavaScript

ES6 JavaScript
February 07, 2026 | Read time: 4 minutes

The first native AI agent for mobile is here.

Droidrun is the first native mobile AI agent that lets LLMs control iOS and Android devices. The framework is the most powerful option available for mobile agents. It is also fully open source.

Check and contribute to the Droidrun repo

Sponsor this newsletter to reach 9,000+ active developers

Note: This is a guest post by Matt Lawrence, a co-host of the HTML All The Things podcast.

Recently I’ve been dipping my toes into the world of React as a beginner, with AI as my guide.

As someone that primarily works for small and medium businesses, my web development career largely focuses on WordPress, Webflow, and SEO. While I do code to extend and enhance these tools sometimes (ie adding custom code to extend Webflow’s native form handling), I typically need to code in vanilla HTML/CSS/JS in order to have my snippets work within the confines of a page builder.

Lately, I’ve been interested in expanding my skills by learning React, and so with AI as my guide I kicked off my learning journey in late 2025. Unfortunately, it didn’t take me long to discover that my JavaScript coding knowledge has become quite dated. I rarely use modern JavaScript methodologies that are typically found in ES6 and above.

As I “knock the rust off” my JavaScript skills, I’ve been finding some ES6 features that I find quite essential to my journey so far including:

  • Variable declarations with let and const
  • Arrow functions
  • Destructuring

 

Let’s explore these JavaScript features one-by-one to unlock their potential.

Let and Const

Back before I started my React learning journey, I actually published a piece on the difference between var, let and const in JavaScript.

I had been using let instead of var for quite a while in my code snippets, but hadn’t really thought much about why it mattered before writing my guide, so let’s break it down here:

  • var is the old school way of declaring variables in JavaScript, it is still valid (browsers still understand it), however it is largely relegated to use in older codebases that have compatibility concerns (ie running on old browser versions). It is function-scoped – accessible throughout the entire function where it is declared.
  • let is the new school way of declaring variables in JavaScript. You can almost consider it a “var 2.0” of sorts, with the main difference being that it is block-scoped – it is accessible only within the { } block in which it is defined.
  • const is a new way to declare a variable whose value will be constant. It cannot be reassigned a new value. This prevents accidental reassignment (which can cause bugs). const is also block-scoped, just like let.

 

In modern JavaScript programs, you should be using const wherever possible, leaving let for variables that need to have their values reassigned. This practice helps reduce bugs by “locking in” variable values wherever applicable, preventing the accidental changing of a variable that’s supposed to have a different value.

Arrow Functions

Arrow functions are a shorter way to write a function in JavaScript by using an equal sign = and greater than symbol > put together to form an arrow =>.

Let’s take a look at adding two numbers with a function. If you’re a beginner (or like me) you’re probably very familiar with this sort of syntax:

                            
function add(num1, num2) {
	return num1 + num2;
}                            
                        

The equivalent as an arrow function is this:

                            
const add = (num1, num2) => num1 + num2;                            
                        

Furthermore, arrow functions treat the

this

keyword differently than a standard function declaration. This difference is illustrated in the below example:

                            
const user = {
  name: "Matt",

  regularMethod: function () {
    console.log("regularMethod says:", this.name);
  },

  arrowMethod: () => {
    console.log("arrowMethod says:", this.name);
  }
};

user.regularMethod(); // Console: Matt
user.arrowMethod(); // Console: Undefined                            
                        

Regular functions (using the function keyword) set this to the object that called them. In our example user called the the regularMethod which means that this is Matt.

Arrow functions do not set their own this, it’s whatever this is in the outer environment – which ends up being undefined in our case (because strict mode is on).

Destructuring

We can use destructuring to pull values out of an array or object and store them inside variables. We can think of this as unpacking data using some short and readable syntax.

In my work, I would typically grab my values individually (ie let num1 = arrayName[0];) but destructuring can really help if you want to quickly unpack multiple values in fewer lines.

Array Destructuring

In array destructuring, we use square brackets [] on the left side of our assignment operator = and the name of the array we’re destructuring on the right bethesdaGames.

Inside the [] we place the variables we want our array values to unpack into.

                            
// Array Destructuring
const bethesdaGames = ["Fallout 3", "Oblivion", "Doom 3"];

const [fallout, tes, doom] = bethesdaGames;
/* 
 fallout = Fallout 3
 tes = Oblivion
 doom = Doom 3 
*/                            
                        

Object Destructuring

In object destructuring we use curly braces {} on the left side of our assignment operator = and the name of the object we’re destructuring on the right fallout.

Inside the {} we place the variables we cant our object key values to unpack into.

                            
const fallout = {
	type: "TV Show",
	seasons: 2,
	distribution: "Prime Video"
}

const { type, seasons, distribution } = fallout;
/*
 type = TV show
 seasons = 2
 distribution = Prime Video
*/                            
                        

Conclusion

Many of these ES6+ features and methods may seem simple if you’re an experienced developer, but I know that these small tweaks (among others not covered here) will help me approach and learn React with a fresh set of modern JavaScript skills. And if you’re a beginner, these tips can help you begin to understand how to approach some fundamental concepts with modern syntax.

Do you have any JavaScript skills that would be helpful on my React journey? Let me know on LinkedIn or X.