Yogesh Chauhan's Blog

How does Binding work in JavaScript?

in JavaScript on April 16, 2021

To store values, JavaScript has a way called a binding which is just a fancy name for a variable.

Foe e.g.


let x = 10;

I am sure we have used the above let keywords quite a few times in JavaScript. It indicates the beginning of the binding followed by the name for that binding variable and in some cases followed by the value for that variable.

You’re not required to assign the value immediately after the declaration.

The example above created a binding called x and we assigned the value 10 to it. Now, we can just use that x wherever we want in our program. Just like this:


console.log(x * x);
//100

Can you change the value of binding variable let?

Yes. We definitely can. Binding variable values are not going to stay same. It’s easily changeable.

Just assign any other value like this:


let x = 10;
console.log(x); //10
x = 20;
console.log(x); //20

Think of binding variables as normal variables. What do normal variables used for? Holding a value and changing it when required. Right? Same way we can hold a value with binding and change it when it needs to be changed.


For e.g. a simple increment or decrement in a value like this:


let x = 100;
x = x - 10;
console.log(x); //90

x = x - 20;
console.log(x); //70

x = x + 20;
console.log(x); //90

What happens when you try to print a value of empty binding?

It will just print undefined since there is no value attached to it.

Just like this:


let x;
console.log(x);
// undefined

Define multiple bindings

You can also define multiple binding in a single statement and even with a string, it doesn’t have to be a number only.

Just like this:


let x = 10, y = "hello";
console.log(x); //10
console.log(y); //hello


Can you use var and const to create bindings?

You sure can.

Just like this:


var x = 10;
const y = "hello";

console.log(x); //10
console.log(y); //hello

In ES5 and before var keyword was used to define bindings.

You can change values for the variables declared by var and let but not const.

Be careful while choosing binding variable name

JavaScript has some keywords reserved for itself so whenever you try to use those keywords as your own variable name then it will throw an error. Some of the reserved keywords are catch, try, let, break etc. There is a huge list of it.

If you really want to use a similar name to the reserved keyword then try to use it with a number or a special character. For e.g. try100 is a valid variable name.

A binding variable name can have an underscores(_) or a dollar signs ($). You CAN NOT use any other special characters.


Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 How to add Read More Read Less Button using JavaScript? #3 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #4 Solution to the error “Visual Studio Code can’t be opened because Apple cannot check it for malicious software” #5 How to uninstall Cocoapods from the Mac OS? #6 PHP Login System using PDO Part 1: Create User Registration Page

Recently Posted

#Apr 8 JSON.stringify() in JavaScript #Apr 7 Middleware in NextJS #Jan 17 4 advanced ways to search Colleague #Jan 16 Colleague UI Basics: The Search Area #Jan 16 Colleague UI Basics: The Context Area #Jan 16 Colleague UI Basics: Accessing the user interface
You might also like these
How to redirect or load a new document using JavaScript?JavaScriptWhat is a Strict Requirement in PHP 7 Function Declarations?PHPHow different is Handling Events in React vs HTML DOM?ReactThe Difference Between the echo and print Commands in PHPPHPAngular: Templates, directives, data binding, Services and dependency injectionAngularOpen Source Security Tools for Defense SecurityMiscellaneous