JavaScript — let, const, or var

Check out my work on Github, and my page on LinkedIn

A quick guide to JavaScript’s variable names, and how they affect your code

As I approach the second half of my coding bootcamp at flatiron, I recently started learning JavaScript. I was immediately left bewildered with all of the options I had in naming variables. But as I worked with JavaScript, it started to become clearer when they should be used. I was told that var should be avoided, but I never quite understood why. If you are starting to learn JavaScript, and have similar questions, I’m hoping you learn something from this blog!

Photo by Roozbeh Eslami on Unsplash

Var

Before the introduction of ES6, var was the only type of variable declaration available, but there were issues with it. Mainly it’s scope, var is globally scoped if it is declared outside of a function, meaning it’s available anywhere inside of the document, however inside of a function it is function scoped, meaning that it is available only within the function. So you may be thinking, with this information, I can work around it, so what? The problem lies in var being able to be redeclared which means that making an error, and reusing the same variable later on in your code could cause major headaches. Let and const were introduced in 2015 to help mitigate these issues.

Let

Let still allows you to update the value of the variable, however you cannot redeclare it. If you’re confused by that, don’t worry, so was I! When you first set a variable you would say:

let variableName = “This”

Later on in your code, reusing the variable will yield an error.

let variableName = “That” //expected output: error: Identifier ‘variableName’ has already been defined

However, you can update it by leaving out the let

variableName = “How about now”

console.log(variableName); // expected output:“How about now”

Let is also block scoped, meaning that it can have its value can change based on where you call it. Function scope and block scope can sometimes be the same, block scoped is just a fancy way of saying anything between curly braces { — — this is a block scope — {this is a smaller block}— — }

Const

The last variable, const, is very similar to let, with the big exception that once created, it cannot be redefined. While let is happy to be renamed again and again, const will throw an error

const x = 1;
const x = 3;
console.log(x) // expected result: Uncaught SyntaxError: Identifier 'x' has already been declared

However, because of block scoping, const CAN be redeclared with ‘const =’

This may seem confusing, and it is! However with practice it becomes second nature. Just remember that within each block, you can’t rename const, but in different blocks, they can have different values.

Hopefully this helps with any questions you had about which ones to use. As I continue my traversal through Flatiron’s Software Engineering program, I’ll continue posting blog posts that hopefully help explain beginner, and more advanced topics. Thank you for checking out my blog, and happy coding to everyone!