Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
June 5, 2019 12:20 am GMT

Declaring JS Variables in 2019

tl;dr my opinion : use const by default, only use let if required.

History

JavaScript has three* ways to declare variables:

var x = 123;let y = 456;const z = 789;

The first, var, comes from the original version of JavaScript. The later two arrived widely across browsers in about 2016.

Constant by Default

If you declare variables with const, they cannot be changed ("mutated"). (If the variable points to an object, you can mutate the object.) For example:

const value = 123;const object = {abc: 123};object.abc++;   // ok value++;        // error object = null;  // error 

This is an extremely primitive but useful method of safety while building JS. If a variable isn't meant to be mutatedit's the result of some complex operationthen const means you can't accidentally use it incorrectly. (This is also useful in conjunction with strict mode, where you can't just invent variable names without var, let or const).

Let On Demand

If you later find out that you need a variable to mutate, you can go back to its declaration and mark it as let. This lets readers of your program know a bit more about the variable.

const counter = getTotalEvents();// ...later, we decide to add something, but this will counter += otherEvents();

If we modify const counter to be let counter, readers will know that it's not the final value: it will likely mutate further on below.

Gotchas

  • Function arguments are always mutable.
function foo(foobar) {  ++foobar;  return foobar;}
  • You can and should use const inside a for-of or for-in loop (which is not always obvious, since it seems like the variable is mutating every iteration).
for (const x in object) { ... }for (const x of arrayOrIterable) { ... }

Var Considered Confusing

Declaring with var has some quirksthe variable declaration is hoisted to the top of a function, so it's always available. Here's an example, but showing that you could just use let instead:

let vs var

Declaring with var can be useful in some occasions, but I believe it does not follow the principle of least surprise, and you can always replace it with let.

The Exception*

Function declarations are technically another way to declare a variable.

function foo() {  // do stuff}// "foo" is now something we can pass around, e.g.:setTimeout(foo, 1000);

This isn't exactly like saying var foo = function() { ... }, but it's similar. The main difference being that the declaration itself is hoisted, not just the variable name. Here's that in action:

foo();  // ok! bar();  // crashes: "bar" is a valid name, but contains undefined function foo() {}var bar = function bar() {};

Function declarations are a useful concept in JS, because it lets us pass around functions before they are declaredallowing for circular references such as passing functions as callbacks. (If you're curious, I talk about how this interacts with ES6 modules in a talk I gave at the Polymer Summit in 2017).

Thanks!

That's all for today, just a simple opinion piece!

5


Original Link: https://dev.to/samthor/declaring-js-variables-in-2019-4572

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To