Master JavaScript Variables With Ease: A Quick Guide

Master JavaScript Variables With Ease: A Quick Guide

Namaste, Amazing ones🙏🏼

Hey everyone, this is Aryan Sharma's blog, and I hope you're all doing well.

I'm thrilled to begin this JavaScript blog for absolute beginners with my fourth blog post.

📍You can find my blogs here↗️

What to wait? Let's go🚀

Variables What??🤔

I would like to start with some real-life examples -

  1. An E-commerce website – might include goods being sold and a shopping cart.

  2. A Blogging site - it contains information on follower count, blog, and analytics section.

    Variables are primarily used to store information.

Variable definition

The variable is a “named storage” for data. We can use variables to store name, income, and other data.

To create a variable in JavaScript, use the (var and let) and one way to define a constant value (const).

let name;

The above statement declares a "name" variable.

let name;

name = 'Aryan';

Now, we can put some data into it by using the assignment operator =

let name;

name = 'Aryan';

alert(name); // shows the information cointained in the variable

The string is now stored in the memory which is associated with the variable. Now, we can access it using the variable name.

To make the code handy and short in size

let name = 'Aryan'; // declare the variable and assigning of value

alert(name); // name

We can also declare multiple variables in one line:

let name = 'Aryan', age = 18, income = 'NULL';

⚡ But I do not recommend this practice, instead do this👇🏼

let name = 'Aryan';
let age = 18;
let income = 'NULL';

We can also write them in these 👇🏼 ways -

let user = 'John',
  age = 25,
  message = 'Hello';

...Or even using "comma-first" syntax:

let user = 'John'
  , age = 25
  , message = 'Hello';

All of these variations accomplish the same task in theory. Therefore, everything comes down to aesthetics and individual taste.

Technician example from actual life🤖

Imagine we have a box

Let's try to understand the concept of "variable" if we imagine it as a "box" for data, with a uniquely-named sticker on it

Initially, the variable message can be imagined as a box labeled "message" with the value "Hello!" in it:

Any value may be entered into the box.

Additionally, we are free to alter it as much as we like:

let name;

message = 'Aryan';

message = 'Happy'; // value changed

alert(name);

Additionally, we can declare two variables and transfer information between them.

💀 Declaring twice triggers an error

The variable should be declared only once.

The repeated declaration of the same variable gives an error.

let name = "Aryan";

// Repeated 'let' leads gives error
let name = "Happy"; // SyntaxError: 'message' has already been declared

As a result, we should only declare a variable once and then use it directly.

Variable naming

There are some limitations on variable names in JavaScript:

  1. The name must contain only letters, digits, or symbols $ and _

  2. No digits are permitted as the initial character.

let userName;
let userId;

When the name contains multiple words, camelCase is commonly used.

What’s interesting – is the dollar sign '$' and the underscore '_' can also be used in names. let $ = 1 a valid name here.

Case matters

Variables named apple and APPLE are two different variables in JavaScript like most of the programming languages.

Reserved names

There are reserved words, which cannot be used as variable names because they are used by the language itself.

For example: let, class, return, and function is reserved.

The code below gives a syntax error:

let let = 5; // can't name a variable "let", error!
let return = 5; // also can't name it "return", error!

here, we get to know about how to declare and name a variable but how to give a constant value?
So, here we have

Constants

We declare a constant variable by using const instead of let:

const myPhoneNumber = '88XXX56XX4';

We can't change the value of a constant and doing so will give an error

Uppercase constants

Constants are often employed as substitutes for hard-to-remember quantities that are known before execution.

These constants have capitalized and underscored names.

For illustration, let's create color constants in "web" (hexadecimal) format as follows:

const COLOR_RED = "#F00";
const COLOR_GREEN = "#0F0";
const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

let color = COLOR_ORANGE;
alert(color); // #FF7F00

Why do we use this?

  • COLOR_BLUE is much easier to remember than "#00F".

  • It is much easier to mistype "#00f" than COLOR_BLUE.

    Congratulations!! we come to the End🎉🎊

Wait wait...!!

Here we have some tasks for you,
if you really want to become a better developer then don't run from practises..

TASKS:--

Working with variables

  1. Declare two variables: admin and name.

  2. Assign the value "John" to name.

  3. Copy the value from name to admin.

  4. Show the value of admin using alert

  5. Giving the right name

Giving the correct information

  1. Create a variable with the total number of visitors to the mall. How would you name such a variable?

  2. Create a variable to store the name of a current visitor to a website. How would you name that variable?