dir.by  
  Поиск  
Компьютер, программы
JavaScript - programming language for HTML
 Variable scope var, let, const in the JavaScript | standard ES5 
посмотрели 9912 раз
обновлено: 1 Augusta 2020
In the JavaScript variables are declared in different ways:
Example
What does that mean?
var
var a = 10;
1. If the variable is declared at the beginning of the file, it is visible everywhere (inside all functions) that is, it is a global variable. Example...

2. If a variable is declared inside a function, it is visible only within that function. Example...

3. If the variable is declared at the beginning of the file and the same variable is declared inside the function, then the variable inside the function DOES NOT affect the variable at the beginning of the file (these are different variables). Example...

4. If a variable is declared anywhere and the same variable is declared just below inside block then variable inside block AFFECTS the variable above (it's the same variable). Example...
let
let b = 20;
1. same behavior as var. Example...

2. same behavior as var. Example...

3. same behavior as var. Example...

4. If a variable is declared let anywhere and same variable let announced just below inside block then variable inside block DOES NOT AFFECT THE VARIABLE ABOVE (these are different variables). Example...
const
const c = 30;
const the variable is the same as let only cannot change its meaning. Example...
d = 40;
If d the variable exists then replace the value
if d the variable does not exist then the variable will be declared as var
Example...
var
  JavaScript      Example 1. var variable declared at the beginning of the file is a global variable
// declare a global variable
var a = 10;

// a the variable is visible inside the loop
for (var i=1; i<=1; i++)
{
     // a = 10
}

// a the variable is visible inside the function
function ShowValue()
{
     // a = 10
}
  JavaScript      Example 2. var variable declared Inside function is a local variable
function SetValue()
{
     // declare a local variable
     var a = 15;
}

// call the function SetValue()
SetValue();

// after the function is executed SetValue
// a variable not defined
  JavaScript      Example 3. var the variable is declared at the beginning of the file and the same variable is declared inside the function
// declare a global variable
var a = 10;
var t = 30;

// declare the same variable inside the function
function SetValue()
{
     var a = 100;
     t = 300;
}

// call the function SetValue()
SetValue();

// after the function is executed SetValue
// variable a = 10
// variable t = 300
  JavaScript      Example 4. var variable and the same variable declared just below inside block
// declare a global variable
var a = 10;

// declare a variable inside block if
if (777==777)
{
     var a = 56;
}

// after release from the block if
// a = 56
let
  JavaScript      Example 1. let variable declared at the beginning of the file is a global variable
// declare a global variable
let b = 20;

// b the variable is visible inside the loop
for (var i=1; i<=1; i++)
{
     // b = 20
}

// b the variable is visible inside the function
function ShowValue()
{
     // b = 20
}
  JavaScript      Example 2. let variable declared Inside function is a local variable
function SetValue()
{
     // declare a local variable
     let b = 15;
}

// call the function SetValue()
SetValue();

// after the function is executed SetValue
// b variable not defined
  JavaScript      Example 3. let variable declared at the beginning of the file and the same variable is declared inside a function
// declare a global variable
let b = 20;
let t = 30;

// declare the same variable inside the function
function SetValue()
{
     let b = 200;
     t = 300;
}

// call the function SetValue()
SetValue();

// after the function is executed SetValue
// b = 20
// t = 300
  JavaScript      Example 4. let variable and the same variable declared just below inside block
// declare a global variable
let b = 10;

// declare a variable inside the block if
if (777==777)
{
     let b = 56;
}

// after release from block if
// b = 10
const
  JavaScript       Example
// declare a variable const
const c = 30;

c = 120; // error! the second time you cannot set the value
  empty variable declaration
  JavaScript      Example
// declare a global variable
var e = 10;

function SetValue()
{
     // e variable already exists therefore, let's replace the value
     e = 40;
}

// call the function SetValue()
SetValue();

// after the function is executed
// e = 40
 
← Previous topic
Accessing Variables Before Defining Them (Hoisting) in the JavaScript | standard ES5
 
Next topic →
Text in the JavaScript. Class String. Example: var myText = String("World"); | standard ES5
 
Your feedback ... Comments ...
   
Your Name
Your comment (www links can only be added by a logged-in user)

  Объявления  
  Объявления  
 
In which editor (program) is it convenient to write JavaScript code?
[bgcolor=#D0F2A0]New app[/bgcolor]
Create a new application JavaScript in a text editor
Create a new application JavaScript in Visual Studio Code. Debug the application. See in debugging how to perform JavaScript
[bgcolor=#D0F2A0]Debugging JavaScript, HTML[/bgcolor]
Debug JavaScript in Google Chrome. Using debugger
How to find out (see) where the error is when executing HTML, JavaScript in Google Chrome
Debugging JavaScript in the Google Chrome. Use console.log("Hello!")
JavaScript standard ES5. It was published in 2009. Supported by all browsers
[bgcolor=#D0F2A0]Function
Function in the JavaScript. Example: function CalculateSum(value1, value2) { ... } | standard ES5
Function return || in the JavaScript. Example: function getPersonName(name) { return name || "Evgen" } | standard ES5
Call a function before it is defined (Hoisting) in the JavaScript | standard ES5
Variables within a function (lifetime of variables within a function) JavaScript | standard ES5
Pass parameters by value and by reference to the function in the JavaScript | standard ES5
How to find out... whether there is a function by name in the JavaScript? Example: typeof calcSum == "function" | standard ES5
The function described inside the function. JavaScript | standard ES5
[bgcolor=#D0F2A0]Unnamed function[/bgcolor]
Unnamed function in the JavaScript . Using an unnamed function: create a new variable and assign an unnamed function to a new variable. Example: var myFunc1 = function (a, b) { return a + b; } ; | standard ES5
Unnamed function in the JavaScript . Using an unnamed function: pass an unnamed function as a parameter to another function. Example: Calculate(15, 7, function(v1, v2) {return v1+v2;}); | standard ES5
[bgcolor=#D0F2A0]Self-calling unnamed function[/bgcolor]
Self-calling unnamed function in the JavaScript. Where is it used? Used in Yandex advertising. Example: ( function(){ ... } )(); | standard ES5
Create a file js with an object containing export variables and functions. This is an example of using a self-calling unnamed function | standard ES5
[bgcolor=#D0F2A0]Lambda function (abbreviated version of the unnamed function)[/bgcolor]
Lambda function in the JavaScript . Use the lambda function. [Example1] var myFunc1 = (a, b) => a + b; [Example2] Calculate(15, 7, (v1, v2) => {return v1+v2;}); | standard ES5
[bgcolor=#D0F2A0]Variables[/bgcolor]
Variables in the JavaScript (text, number, flag, date and time) | standard ES5
Accessing Variables Before Defining Them (Hoisting) in the JavaScript | standard ES5
Variable scope var, let, const in the JavaScript | standard ES5
Text, strings in the JavaScript
Text in the JavaScript. Class String. Example: var myText = String("World"); | standard ES5
Length (string length in the JavaScript) | standard ES5
Function replace(text1, text2) replace text in the JavaScript | standard ES5
Function toUpperCase() converts text to uppercase JavaScript | standard ES5
Function toLowerCase() lowercase text JavaScript | standard ES5
Function split(delimiter) splits a string into substrings JavaScript | standard ES5
Function charAt(position) get a symbol by position JavaScript | standard ES5
Function substr(pos, len) returns a substring JavaScript | standard ES5
Function slice(pos1, pos2) returns a substring JavaScript | standard ES5
Function substring(pos1, pos2) returns a substring JavaScript | standard ES5
Function indexOf(text, startPos) searches for a substring and returns an index JavaScript | standard ES5
Function startsWith(text) Checks, whether the line begins with the specified substring JavaScript | standard ES5
Function trim() remove spaces at the beginning and end of a line JavaScript | standard ES5
The padStart(length, symbol) function appends characters at the beginning of a line up to the desired JavaScript line length | ES5 standard
The padEnd(length, symbol) function appends characters at the end of a line up to the desired JavaScript line length | ES5 standard
You can assign text as many lines to a text variable. Example: var myText = `Hello \n Thanks \n Bye` | JavaScript ES6 standard
In a text variable, you can write expressions with variables (formatting, string interpolation). Example: var myText = `Hello ${a}` | JavaScript standard ES6
[bgcolor=#D0F2A0]Regular expressions[/bgcolor]
Regular expressions in JavaScript | ES5 standard
Write a regular expression to remove all special characters except letters and numbers | Regex JavaScript | standard ES5
[bgcolor=#D0F2A0]Numbers and mathematical functions[/bgcolor]
Number in the JavaScript. Convert text to a number. Rounding a number. Convert hexadecimal to decimal. | standard ES5
Mathematical functions from the library Math: Sin, cos, log, pow and so on in the JavaScript | standard ES5
[bgcolor=#D0F2A0]Date & Time[/bgcolor]
Date & Time (year, month, date, hours, minutes, seconds) in the JavaScript. Class Date | standard ES5
[bgcolor=#D0F2A0]Array[/bgcolor]
Array in the JavaScript This is [] or class Array | standard ES5
What does 3 dots mean... items | Example 1: Math.max(... prices) | Example 2: books.push(... items) | JavaScript, ES5 standard
Difference between push(items) and push(...items) | Adding an Array to an Array in the JavaScript | standard ES5
Find max prices in a complex array: [ {name:"Tomate", price:10}, {name:"Apple", price:17}, {name:"Orange", price:15} ] in JavaScript | ES5 standard
Find min prices in a complex array: [ {name:"Tomate", price:10}, {name:"Apple", price:17}, {name:"Orange", price:15} ] in JavaScript | ES5 standard
[bgcolor=#D0F2A0]Collection Map and Set[/bgcolor]
Collection "The key-meaning" in the JavaScript. Class Map | standard ES5
Collection of unique values in the JavaScript. Class Set | standard ES5
[bgcolor=#D0F2A0]Object {set of properties and functions}[/bgcolor]
{} it"s an object in the JavaScript. An object contains a set of properties and functions. Example var book = {Name: "Wizard of the Mediterranean", Price: 120}; | standard ES5
{...} = object in JavaScript is populated from class variables or another object. Example: const {name, total, price} = b.myProps; | ES5 standard
[bgcolor=#D0F2A0]Class (it is a function using new) | ES5 standard[/bgcolor]
Class in the JavaScript this is a common constructor function. Such a constructor function contains simple data, objects, internal functions in the JavaScript. To create a class object, use new Example: function Book() { ... } ... var obj1 = new Book(); | ES5 standard
Encapsulating variables (hiding variables for access) in the function (as a class) in the JavaScript | standard ES5
prototype - is a set of functions, variables for all instances of the class (as a function) in the JavaScript | standard ES5
[bgcolor=#D0F2A0]try catch[/bgcolor]
Why you need to use try and catch in the JavaScript? | standard ES5
[bgcolor=#D0F2A0]Closing (closure) in the Javascript[/bgcolor]
What are closures? (closure) in the JavaScript ? Standard ES5
[bgcolor=#D0F2A0]Memory management in JavaScript[/bgcolor]
Memory management in JavaScript | ES5 standard
[bgcolor=#D0F2A0]Examples of picture movement and animation[/bgcolor]
Animation of the little man on the spot. Use the HTML element <div>. For animation, we use CSS styles: "animation", "background-image", "background-position", "keyframes" | ES5 standard
Animation of a man in motion (sprite). Use HTML elements <div>, <img>. For animation, we use CSS styles: "animation", "background-image", "background-position", "keyframes" | ES5 standard
Draw a picture with movement. Use the HTML element<canvas>. Use JavaScript for movement: var img = new Image(), img.src = url, drawImage, timer, window.setInterval | standard ES5
Drawing a picture with movement and animation (sprite). Use the HTML element <canvas>. Use JavaScript for movement: var img = new Image(), img.src = url, drawImage, timer, window.setInterval | standard ES5
[bgcolor=#D0F2A0]Examples[/bgcolor]
How to identify a device (tablet, computer, phone) that is currently used in JavaScript, HTML | ES5 standard
Text Editor write in HTML, JavaScript | standard ES5
Do Popup using HTML and Javascript
How to make a Popup window in a HTML page | Javascript, HTML, CSS
My Game (HTML, JavaScript)
My game "Wizard World" | HTML, JavaScript
PDF readers. Upload and display a PDF file (JavaScript, HTML)
PDF reader. Download and display a PDF file (adobe JavaScript, HTML) | PDF JavaScript implemented by Adobe
PDF reader. Download and display a file PDF (JavaScript, HTML) | PDF JavaScript implemented by Mozilla
JavaScript standard ES6. It was published in 2015. Not supported by all browsers. Synonyms ES6, ES2015, ECMAScript 2015
In a text variable, you can write expressions with variables (formatting, string interpolation). Example: var myText = `Hello ${a}` | JavaScript standard ES6
class | Class in the JavaScript. Example: class Book {...} ... var obj1 = new Book(); | ES6 standard
promise in the JavaScript | standard ES6

  Ваши вопросы присылайте по почте: info@dir.by