ES6 series declaring variables let and const
This article mainly shares with you the declared variables let and const of the ES6 series. Interested friends can refer to the content in this article
Introduction
Concept
The first version of ES6 was released in June 2015, and its official name is "ECMAScript 2015 Standard" (ES2015 for short). ES6 is both a historical term and a general term. It means the next generation standard of JavaScript after version 5.1, covering ES2015, ES2016, ES2017, etc., while ES2015 is the official name, specifically referring to the official version of the language released that year. standard.
Support for ES6 by major browsers: kangax
Babel
Babel is a widely used ES6 transcoder that can convert ES6 code to ES5 code to execute in the existing environment.
Babel’s configuration file is .babelrc, which is stored in the root directory of the project. The first step in using Babel is to configure this file.
Declare variables
ES5 has only two ways to declare variables: the var command and the function command. ES6 adds let, const, import and class commands. Therefore, ES6 has a total of 6 ways to declare variables.
In ES5, the properties of top-level objects are equivalent to global variables. In order to change this, ES6 stipulates on the one hand that in order to maintain compatibility, global variables declared by the var command and the function command are still attributes of the top-level object; on the other hand, it stipulates that global variables declared by the let command, const command, and class command, Properties that do not belong to the top-level object. In other words, starting from ES6, global variables will gradually be decoupled from the properties of the top-level object.
let
ES6 adds a new let command to declare variables. Its usage is similar to var, but the declared variable is only valid within the code block where the let command is located.
{ let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1
Does not allow repeated declarations
let does not allow repeated declarations of the same variable in the same scope.
// 报错 function func() { let a = 10; var a = 1; } function func(arg) { let arg; // 报错 } function func(arg) { { let arg; // 不报错 } }
Block-level scope
ES6 allows arbitrary nesting of block-level scopes.
The inner scope can define variables of the same name in the outer scope.
The outer scope cannot read the variables of the inner scope.
{{{{ {let insane = 'Hello World' {let insane = 'Hello World'} } console.log(insane); // 报错 }}}};
Block-level scope and function declaration
ES5 stipulates that functions can only be declared in the top-level scope and function scope. Cannot be declared at block scope.
ES6 stipulates that in block-level scope, function declaration statements behave like let and cannot be referenced outside block-level scope.
Considering that the behavior caused by the environment is too different, you should avoid declaring functions in block-level scope. If it is really necessary, it should be written as a function expression instead of a function declaration statement.
There is no variable promotion
The variables declared by the let command must be used after declaration, otherwise an error will be reported.
// var 的情况 console.log(foo); // 输出undefined var foo = 2; // let 的情况 console.log(bar); // 报错ReferenceError let bar = 2;
Temporary dead zone
As long as the let command exists in the block-level scope, the variables it declares will be "binding" to this area and will no longer be affected by external influences.
var tmp = 123; if (true) { tmp = 'abc'; // ReferenceError let tmp; }
In the code block, the variable is not available until it is declared using the let command. Syntactically, this is called the "temporary dead zone" (TDZ).
const
const declares a read-only constant. Once declared, the value of a constant cannot be changed.
is only valid within the block-level scope where it is declared.
#The constants declared by the const command are not promoted. They also have a temporary dead zone and can only be used after the declared position.
const PI = 3.1415; PI // 3.1415 PI = 3; // TypeError: Assignment to constant variable.
Essence
What const actually guarantees is not that the value of the variable cannot be changed, but that the memory address pointed to by the variable cannot be changed. For simple types of data (numeric values, strings, Boolean values), the value is stored at the memory address pointed to by the variable, and is therefore equivalent to a constant. But for composite type data (mainly objects and arrays), the memory address pointed to by the variable only stores a pointer. Const can only guarantee that this pointer is fixed. As for whether the data structure it points to is variable, it is completely Can't control it anymore. Therefore, you must be very careful when declaring an object as a constant.
const foo = {}; // 为 foo 添加一个属性,可以成功 foo.prop = 123; foo.prop // 123 // 将 foo 指向另一个对象,就会报错 foo = {}; // TypeError: "foo" is read-only
If you really want to freeze the object, you should use the Object.freeze method.
const foo = Object.freeze({}); // 常规模式时,下面一行不起作用; // 严格模式时,该行会报错 foo.prop = 123;
The above is the detailed content of ES6 series declaring variables let and const. For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

Environment variables are the path to the location (or environment) where applications and programs run. They can be created, edited, managed or deleted by the user and come in handy when managing the behavior of certain processes. Here's how to create a configuration file to manage multiple variables simultaneously without having to edit them individually on Windows. How to use profiles in environment variables Windows 11 and 10 On Windows, there are two sets of environment variables – user variables (apply to the current user) and system variables (apply globally). However, using a tool like PowerToys, you can create a separate configuration file to add new and existing variables and manage them all at once. Here’s how: Step 1: Install PowerToysPowerTo

Strict mode was introduced in PHP7, which can help developers reduce potential errors. This article will explain what strict mode is and how to use strict mode in PHP7 to reduce errors. At the same time, the application of strict mode will be demonstrated through code examples. 1. What is strict mode? Strict mode is a feature in PHP7 that can help developers write more standardized code and reduce some common errors. In strict mode, there will be strict restrictions and detection on variable declaration, type checking, function calling, etc. Pass

Python is widely used in a wide range of fields with its simple and easy-to-read syntax. It is crucial to master the basic structure of Python syntax, both to improve programming efficiency and to gain a deep understanding of how the code works. To this end, this article provides a comprehensive mind map detailing various aspects of Python syntax. Variables and Data Types Variables are containers used to store data in Python. The mind map shows common Python data types, including integers, floating point numbers, strings, Boolean values, and lists. Each data type has its own characteristics and operation methods. Operators Operators are used to perform various operations on data types. The mind map covers the different operator types in Python, such as arithmetic operators, ratio

Using Ajax to obtain variables from PHP methods is a common scenario in web development. Through Ajax, the page can be dynamically obtained without refreshing the data. In this article, we will introduce how to use Ajax to get variables from PHP methods, and provide specific code examples. First, we need to write a PHP file to handle the Ajax request and return the required variables. Here is sample code for a simple PHP file getData.php:

Instance variables in Java refer to variables defined in the class, not in the method or constructor. Instance variables are also called member variables. Each instance of a class has its own copy of the instance variable. Instance variables are initialized during object creation, and their state is saved and maintained throughout the object's lifetime. Instance variable definitions are usually placed at the top of the class and can be declared with any access modifier, which can be public, private, protected, or the default access modifier. It depends on what we want this to be

Detailed explanation and code examples of const in C In C language, the const keyword is used to define constants, which means that the value of the variable cannot be modified during program execution. The const keyword can be used to modify variables, function parameters, and function return values. This article will provide a detailed analysis of the use of the const keyword in C language and provide specific code examples. const modified variable When const is used to modify a variable, it means that the variable is a read-only variable and cannot be modified once it is assigned a value. For example: constint

PHP function introduction—strpos(): Check whether a variable is a string In PHP, is_string() is a very useful function, which is used to check whether a variable is a string. When we need to determine whether a variable is a string, the is_string() function can help us achieve this goal easily. Below we will learn about how to use the is_string() function and provide some related code examples. The syntax of the is_string() function is very simple. it only needs to

jQuery is a JavaScript library widely used in web development. It provides many simple and convenient methods to operate web page elements and handle events. In actual development, we often encounter situations where we need to determine whether a variable is empty. This article will introduce several common methods of using jQuery to determine whether a variable is empty, and attach specific code examples. Method 1: Use the if statement to determine varstr="";if(str){co
