Unlocking JavaScript Superpowers: The Magic of Variables

From today, we will discover a world of programming. World where you have superpowers. Yes, you read that correctly, superpowers. What is it, if not a superpower? With JavaScript, you can make things fly, move, disappear, change color, and see your friend from miles away, and that’s only a small portion of what is possible. Yes, it’s all on your screen, but still, it’s very exciting.
Like any superhero, you need to control and know your powers well. To do so, let’s start our journey by getting familiar with the most essential building block—the all-mighty Variable.
What is a variable? Imagine a magical box where you can put anything you want, regardless of size! What an amazing invention, right? But here’s the catch: it can only hold one thing at a time (and to be honest, not really any size, but let’s just pretend for now that this isn't the case).
You can put a pen, an elephant, a guitar, a bookshelf with a bunch of books, or even a piece of paper with a novel written on it—anything you want—but always only one thing at a time.
How do we create such a box with JavaScript? That's very easy!

let ourFirstBox

Two simple words. The first one is always the ‘let’ keyword, and the second one is the name of the box. You can think of 'let' as a magical keyword that lets us create a box. The name can be anything, but there are some rules.
There are hard rules (if you do not follow them, your magic won’t work).
And soft rules (mostly best practices, standardized across the industry).
Let’s start with the hard rules:

1. If you want the name to consist of several words, you can’t separate them with spaces.
2. You cannot start a variable name with a number. Now for the soft rules:
3. You should use a notation called camelCase. The first letter is always lowercase, and all subsequent words start with an uppercase letter, with no spaces.
4. Variables should be nouns.
5. If you want to store something that contains several items (for example, a bag of apples), you should use a plural noun like bagOfApples.
6. Avoid using numbers in variable names.

OK. Now we have a box. How do we put anything inside of it? Let’s see an example:

let ourFirstBox;
ourFirstBox = 100;

Just like that! You create a new line, repeat the name of the variable, but this time without the magical ‘let’ keyword because we only need it for creating the variable. After the name, you put an equal sign, which is the assignment operator. With the = sign, we say we want to put something in the variable, and after it, we put the thing we want to store in the “box.”
Now, we have a box that stores a number. For now, it’s not as useful as it may seem, but trust me, we’re slowly getting there.
Another characteristic of our magical box is that you can replace the item inside at any time.

let ourFirstBox;
ourFirstBox = 100;
ourFirstBox = 200;

Now the value inside ourFirstBox is 200.
There are two ways to create variables. You can define the name first and then, on a new line, assign a value to it. Or, you can do it all at once:

let ourFirstBox = 100;

Here, we used the keyword let to define the variable and, at the same time, assigned a value to it.
There is another type of "box." It's called a constant. As the name suggests, it’s a type of variable that can’t be changed. Once you put a value into it, that’s it—you can’t replace it.

const ourFirstConstantBox = 200;

If we try to change its value, we will get an error:

const ourFirstConstantBox = 200;
ourFirstConstantBox = 100; // Error!!!!!

Now you know how to create variables! In the next lesson, we will use a lot of variables.

The above is the detailed content of Unlocking JavaScript Superpowers: The Magic of Variables. For more information, please follow other related articles on the PHP Chinese website!