How to declare read-only constants in es6

In es6, you can use the const keyword to declare read-only constants, the syntax is "const constant name = constant value;"; once declared, the constant must be initialized and the initialized value cannot be changed. Constants declared by const belong to the block scope and are subject to the "temporary dead zone". They will not create any global properties on the window and cannot be reassigned or redeclared.

The operating environment of this tutorial: Windows 7 system, ECMAScript version 6, Dell G3 computer.

In es6, you can use the const keyword to declare read-only constants.

es6 const keyword

const declares a read-only constant. Once declared, a constant must be initialized and the initialized value cannot be changed.

const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable.

const constants comply with the following rules:

• belongs to the block scope.

• is subject to the "temporary dead zone".

• It does not create any global properties on window.

• Not reassignable.

• Cannot be redeclared.

const Once a variable is declared, it must be initialized immediately.

const foo;
// SyntaxError: Missing initializer in const declaration

The above code indicates that for const, if you just declare without assigning a value, an error will be reported.

The scope of const is the same as that of the let command: it is only valid within the block-level scope where it is declared.

if (true) {
  const MAX = 5;
}

MAX // Uncaught ReferenceError: MAX is not defined

The constants declared by the const command are not promoted. There is also a temporary dead zone and can only be used after the declared position.

if (true) {
  console.log(MAX); // ReferenceError
  const MAX = 5;
}

The above code is called before the constant MAX is declared, and an error is reported.

Constant declared by const cannot be declared repeatedly like let.

var message = "Hello!";
let age = 25;

// 以下两行都会报错
const message = "Goodbye!";
const age = 30;

The essence of const

What const actually guarantees is not that the value of the variable cannot be changed, but that the data stored in 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 to the actual data. Const can only guarantee that this pointer is fixed (that is, it always points to another fixed address) , as for whether the data structure it points to is variable, it is completely out of control. 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

In the above code, the constant foo stores an address, which points to an object. What is immutable is only this address, that is, foo cannot be pointed to another address, but the object itself is mutable, so new properties can still be added to it.

Here is another example.

const a = [];
a.push('Hello'); // 可执行
a.length = 0;    // 可执行
a = ['Dave'];    // 报错

In the above code, the constant a is an array. The array itself is writable, but if another array is assigned to a, an error will be reported.

If you really want to freeze the object, you should use the Object.freeze method.

const foo = Object.freeze({});

// 常规模式时，下面一行不起作用；
// 严格模式时，该行会报错
foo.prop = 123;

In the above code, the constant foo points to a frozen object, so adding new attributes will not work, and an error will be reported in strict mode.

In addition to freezing the object itself, the properties of the object should also be frozen. Below is a function that completely freezes an object.

var constantize = (obj) => {
  Object.freeze(obj);
  Object.keys(obj).forEach( (key, i) => {
    if ( typeof obj[key] === 'object' ) {
      constantize( obj[key] );
    }
  });
};

【Related recommendations: javascript video tutorial, programming video】

The above is the detailed content of How to declare read-only constants in es6. For more information, please follow other related articles on the PHP Chinese website!