Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

This article also participated in the “Digitalstar Project” to win a creative gift package and creative incentive money

Learn something new/review something old in just a cup of tea!

On the key

👉 Meng Xin how to understand variables? (A picture to explain it to you)

👉 let $= 1; And let _ = 2; Is it true or false?

👉 Are constants capitalized or not capitalized?

👉 Previous review: Learning JavaScript from scratch

Variable basis

Variables are “named stores” of data. We can use variables to hold some information.

How do I create it?

JavaScript uses the keyword let to create variables such as

This statement creates (or declares/defines) a variable named "message" let messageCopy the code

How do I assign?

Add data to a variable using the operator =, as in

let message; message = 'Hello'; // Save the string 👇 or simply merge it into a line 👇 let message = 'Hello! '; // Define variables and assign valuesCopy the code

Declare multiple variables?

Single line separated by commas

let user = 'John', age = 25, message = 'Hello';
Copy the code

Multiple lines separated by a semicolon

let user = 'John';
let age = 25;
let message = 'Hello';
Copy the code

The keyword var, like let, is used to declare variables, but is no longer recommended

Analogical understanding variable

Variable to delete

We can put any value in the box, and the value can be changed at will. When the value changes, the previous data is deleted from the variable

let message; message = 'Hello! '; message = 'World! '; // Value changed alert(message)Copy the code

Copy the variable

You can declare two variables and then copy the data from one variable to the other.

let hello = 'Hello world! '; let message; // Copy the string 'Hello world' from the variable Hello to message message = Hello; // Now both variables hold the same data alert(hello); // Hello world! alert(message); // Hello world!Copy the code

Variable naming

JavaScript variable naming restrictions

• Variable names must contain only letters, numbers, and symbols$ 和 _.
• The first character must be a non-digit.

✅ Examples of valid naming

let userName; let test123; let $ = 1; // declare a variable with "$" let _ = 2; // Now declare a variable with "_" alert($+ _); / / 3Copy the code

❌ Incorrect name

let 1a; // let my-name; // The hyphen '-' is not allowed in variable namingCopy the code

Note:

1. Variable names are case sensitive, such as Message and message, which are different variables

2, reserved words cannot be used as variable names, such as let, class, return, function are reserved;

❌ let let = 5; ❌ let return = 5; // Again, "return "cannot be usedCopy the code

For more reserved words, see 👉keywords

constant

Constant (invariant) variables, that is, variables that never change, are declared with the keyword const

• If constants are declared using const, they cannot be modified or an error will be reported.

Such as:

// Set PI to constant const PI = 3.14; // If you try to reassign ❌ PI = 4.66; Invalid Assignment to const 'PI'Copy the code

Classification and naming conventions for constants

Being a “constant” means, first of all, that the value never changes. Secondly, it can be roughly divided into two situations:

1. It is known before execution (e.g., the color of the hexadecimal value, #000000, represents black)

2. It is “computed” during execution, but does not change after initial assignment. (such as page load time)

Depending on the situation, the naming method is a little different:

• Case 1: It is recommended to use [uppercase letter + underscore]

  Const COLOR_RED = "#F00"; const COLOR_GREEN = "#0F0"; const COLOR_BLUE = "#00F"; const COLOR_ORANGE = "#FF7F00"; / /... When we need to select a color let color = COLOR_ORANGE; alert(color); // #FF7F00Copy the code

Advantages: COLOR_RED is instantly recognizable as red, which is easier to remember than #F00 and improves code readability.

• Case two: Use normal variable names

  Const pageLoadTime = /* pageLoadTime */;Copy the code

Because pageLoadTime is a constant, meaning the value doesn’t change after assignment. But its value is not known until the page loads, so the normal name is used.

conclusion

Articles will be updated, optimized, and refactored constantly!

Join the discussion in the comments section and you will have a chance to join the [100 Nuggets around] 💥 raffle 💥, badges, slippers, mugs, canvas bags waiting for you to pick up, 👉 event details.

References:

JavaScript Variables

---

🎨 [thumbs up] [concerns] don’t get lost, more front-end dry goods waiting for you to unlock

Phase to recommend

👉 What’s new with the latest version of chrome developer tools?

👉 layui image collection + how to copy the whole website down

👉 applet template template usage details

Memo | 👉 HTTP status code is commonly used & request & response header & Cookies and collection request method