Переменные (Variable) в JavaScript
1. Что такое Переменная (Variable)?
Одна переменная (variable) это "расположение памяти" (Memory location) которая используется программой для хранения значений. Название переменной называется идентификатором (identifier).
![](https://s1.o7planning.com/web-rs/web-image/ru/arf-1131160-vi.webp)
Название переменной должно следовать по правилу, ниже являются правила названия переменной:
- Название переменной не должно совпадать с ключевыми словами (keyword).
- Название переменной может содержать буквы (alphabets) или цифры, но не начинается с цифр.
- Название переменной не должно содержать пробелы (white space), или специальные знаки, кроме нижней черты (underscore) (_) и знака доллара ($).
![](https://s1.o7planning.com/web-rs/web-image/ru/arf-1131181-vi.webp)
2. Объявить переменную
Объявление переменной является нужным, так как вам нужно это сделать перед тем как использовать ее. Синтаксис ES5 использует ключевое слово var для объявления переменной. ES6 добавляет 2 новых ключевых слова это let & const чтобы объявить переменную.
// Declare variables:
var a1;
console.log(a1); // undefined
var a2 = 100;
console.log(a2); // 100
var a3, a4;
var a5, a6 = 200;
console.log(a5); // undefined
console.log(a6); // 200
var a7= 100, a8 = 300;
let b1;
console.log(b1); // undefined
let b2 = "Hello";
console.log(b2); // Hello
const c = 100;
console.log(c); // 100
block
Блок (block) является набором команд расположенных в "фигурных скобках" (Curly brackets) { }.
let
Ключевое слово let используется для объявления переменной с диапазоном блока (block scope), это значит данная переменная будет распознаваться программой в том блоке или в подблоках, но не распознается программой вне блока, который определил его.
if(true) {
let a = 200;
console.log(a); // 200
}
// Program will ignore this statement:
console.log(a);
Если вы используете ключевое слово let чтобы определить 2 переменные с одинаковыми названиями, одна переменная объявляется в родительском блоке, другая переменная определяется в подблоке, программа будет их считать 2-мя разными переменными.
let i = 1000;
let j = 2000;
if(true) {
i = 100; // Assign new value to 'i'
let j = 200; // A new variable (***)
console.log("Test1: " + i + " : " + j); // Test1: 100 : 200
}
console.log("Test2: "+ i + " : " + j); // Test2: 100 : 2000
var
Ключевое слово var используется для объявления переменной, данная переменная имеет диапазон (scope) шире по сравнению с переменной let. Она распознается программой внутри блока, который определил ее, в подблоках, даже распознается вне блока, который определил ее.
if(true) {
var a = 200;
console.log(a); // 200
}
console.log(a); // 200
Если вы объявляете 2 переменные с одинаковыми названиями с ключевым словом var, одна переменная объявлена в родительском блоке, другая переменная в подблоке, программа будет считать эти 2 переменные одинаковыми (Одно расположение в памяти).
var i = 1000;
var j = 2000;
if(true) {
i = 100; // Assign new value
var j = 200; // Assign new value
console.log("Test1: " + i + " : " + j); // Test1: 100 : 200
}
console.log("Test2: "+ i + " : " + j); // Test2: 100 : 200
Переменные объявленные с ключевым словом var в одной функции будут распознаваться программой в той функции, она не будет распознаваться вне функции.
// A function
var test = function() {
var a = 200;
console.log(a); // 200
}
// Call function.
test();
console.log(a); // Not work!!
const
Ключевое слово const используется для объявления константы (constant). При объявлении константы вам нужно всегда прикрепить к ней значение. Но вы не можете прикрепить новое значение для данной переменной. Примечание: Как и переменная let, переменная const имеет диапазон блока (block scope).
// Declare a constant with a value
const greeting = "Hello";
// Assign new value to 'greeting'
greeting = "Hi"; // ==> Error!!
// Declare a constant without a value
const i ; // ==> Error!!
Переменная может быть объявлена с ключевым словом const, она будет константой в определении вы не сможете ей прикрепить значение, но она не является неизменной (imutable), вы все так же можете изменить ее property (свойства).
Смотрите пример ниже, переменная объявлена с ключевым словом const, ее значение это объект со многими property (свойствами). Вы можете прикрепить новое значение property (свойствам) данного объекта.
// Declaring a constant is an object
const person = {
name: "Clinton",
gender : "Female"
};
console.log(person.name); // Clinton
// Can assign new values to properties of const object.
person.name = "Trump";
person.gender = "Male";
console.log(person.name); // Trump
// ** Error! (Cannot assign new value to const variable).
person = {
name : "Trump";
}
+ const: Object.freeze()
Метод Object.freeze() зафиксировать (freeze) объект, вы не сможете поменять или прикрепить новое значение для своих property (свойств).
Object.freeze()
// Declaring a constant is an object
const person = {
name: "Clinton",
gender : "Female"
};
console.log(person.name); // Clinton
Object.freeze(person); // Freeze object 'person'.
person.name = "Trump";
console.log(person.name); // Clinton
Pуководства ECMAScript, Javascript
- Введение в Javascript и ECMAScript
- Быстрый старт с Javascript
- Диалоговое окно Alert, Confirm, Prompt в Javascript
- Быстрый запуск с JavaScript
- Переменные (Variable) в JavaScript
- Битовые операции
- Массивы (Array) в JavaScript
- Циклы в JavaScript
- Руководство JavaScript Function
- Руководство JavaScript Number
- Руководство JavaScript Boolean
- Руководство JavaScript String
- Заявление if/else в JavaScript
- Заявление Switch в JavaScript
- Обработка ошибок в JavaScript
- Руководство JavaScript Date
- Руководство JavaScript Module
- Функция setTimeout и setInterval в JavaScript
- Руководство Javascript Form Validation
- Руководство JavaScript Web Cookie
- Ключевое слово void в JavaScript
- Классы и объекты в JavaScript
- Техника симулирования класса и наследственности в JavaScript
- Наследование и полиморфизм в JavaScript
- Понимание Duck Typing в JavaScript
- Руководство JavaScript Symbol
- Руководство JavaScript Set Collection
- Руководство JavaScript Map Collection
- Понимание JavaScript Iterable и Iterator
- Руководство Регулярное выражение JavaScript
- Руководство JavaScript Promise, Async Await
- Руководство Javascript Window
- Руководство Javascript Console
- Руководство Javascript Screen
- Руководство Javascript Navigator
- Руководство Javascript Geolocation API
- Руководство Javascript Location
- Руководство Javascript History API
- Руководство Javascript Statusbar
- Руководство Javascript Locationbar
- Руководство Javascript Scrollbars
- Руководство Javascript Menubar
- Руководство JavaScript JSON
- Обработка событий в Javascript
- Руководство Javascript MouseEvent
- Руководство Javascript WheelEvent
- Руководство Javascript KeyboardEvent
- Руководство Javascript FocusEvent
- Руководство Javascript InputEvent
- Руководство Javascript ChangeEvent
- Руководство Javascript DragEvent
- Руководство Javascript HashChangeEvent
- Руководство Javascript URL Encoding
- Руководство Javascript FileReader
- Руководство Javascript XMLHttpRequest
- Руководство Javascript Fetch API
- Разбор XML в Javascript с помощью DOMParser
- Введение в Javascript HTML5 Canvas API
- Выделение кода с помощью библиотеки Javascript SyntaxHighlighter
Show More