What problems are being caused by this specific way of assigning variables?

Question

What problems are being caused by this specific way of assigning variables?

What is the difference in variable assignment when it is inside an object and the "this" variable refers to that object?

var prop       = this.properties;
var properties = this.properties;

Compared to:

var prop = properties = this.properties;

Switching to the latter resulted in issues. Could it be a problem with referencing?

javascript variables reference

Answer 1

Answer №1

There is a distinction in the second scenario where you are attempting to assign a value to a variable named properties without first declaring it. The use of var only pertains to prop, not properties, as properties appears on the right side of the assignment operator (=) following prop, making it part of the initialization process for prop. Here is how it breaks down:

var prop = (properties = this.properties);
//         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^−−−− initializer for `prop`

In non-strict mode, this leads to what I refer to as The Horror of Implicit Globals — creating a global variable called properties. When using strict mode, assigning to an undeclared identifier results in the error it should always have been. Hence, all new code should adhere to strict mode.

You can declare multiple variables with var, but you cannot assign them identical values without repeating the source.

You could opt for:

var prop, properties;
prop = properties = this.properties;

If preferred. Alternatively:

var prop = this.properties, properties = prop;

This approach works because initializers within a var (or let or const) involving multiple declarations are executed based on the order in the source code, from left to right. Thus, prop = this.properties executes before properties = prop.

Note: It is advisable to avoid using var in new code and instead opt for let or const. If there is a need to support outdated JavaScript engines, modern code can be transpiled to ES5 standards.

Answer 2

There is a distinction in the second scenario where you are attempting to assign a value to a variable named properties without first declaring it. The use of var only pertains to prop, not properties, as properties appears on the right side of the assignment operator (=) following prop, making it part of the initialization process for prop. Here is how it breaks down:

var prop = (properties = this.properties);
//         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^−−−− initializer for `prop`

In non-strict mode, this leads to what I refer to as The Horror of Implicit Globals — creating a global variable called properties. When using strict mode, assigning to an undeclared identifier results in the error it should always have been. Hence, all new code should adhere to strict mode.

You can declare multiple variables with var, but you cannot assign them identical values without repeating the source.

You could opt for:

var prop, properties;
prop = properties = this.properties;

If preferred. Alternatively:

var prop = this.properties, properties = prop;

This approach works because initializers within a var (or let or const) involving multiple declarations are executed based on the order in the source code, from left to right. Thus, prop = this.properties executes before properties = prop.

Note: It is advisable to avoid using var in new code and instead opt for let or const. If there is a need to support outdated JavaScript engines, modern code can be transpiled to ES5 standards.

What problems are being caused by this specific way of assigning variables?

Answer №1

Similar questions

Service for Posting in Angular

Omitting "a" elements with a designated ancestor from a jQuery scroll operation

Trouble with incrementing in Angular 4's previous and next buttons

Transform XML2JS by eliminating square brackets around values

Navigating the jQuery UI Accordion: selecting a panel via the top menu to reveal its contents while simultaneously closing any

What is the best way to organize properties within the Class Variance Authority?

Dealing with Error TS2769 in Visual Studio Code when passing props to a custom component in Vue 2 with Typescript

Issue encountered when concealing page elements followed by revealing them again

Is it feasible to activate a Bootstrap Tooltip from a different element?

Spin the object around the world's central axis

Issues with jqGrid's grid grouping feature not functioning as expected

Can we safely save a value in session storage directly from the main.js file in Vue?

Data vanishing in upcoming authentication session in test environment

Comparison of Vue CLI 3 vue.config.js and webpack.config.js in terms of handling plugins

"Implementing a 2D graphical user interface on a three.js

Guide on confirming the presence of an element on a webpage utilizing Node.js, Mocha, and Selenium

What exactly occurs when a "variable is declared but its value is never read" situation arises?

"Enhance your website's user experience with a sleek multiple selection

Eliminate the CSS triggered by a mouse click

"Return to previous view with the zoom back feature in CanvasJS