Một trong những tính năng nổi bật của ECMAScript 2015 đó là sự bổ sung let và const phục vụ cho việc khai báo biến dữ liệu. Vậy sự khác biệt giữa biến khai báo dùng let và biến khai báo dùng var là gì, thì ở bài viết này chúng ta sẽ cùng tìm hiểu .
Nội dung chính ShowShow
- ECMAScript 2015
- Global Scope
- Function Scope
- JavaScript Block Scope
- Redeclaring [khai báo trùng lặp]
- Function Scope
- Global Scope
- Function Scope
- JavaScript Block Scope
- Redeclaring [khai báo trùng lặp]
ECMAScript 2015
Global Scope
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 và {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
3.Function ScopeBlock Scope [và constant] trong JavaScript.
JavaScript Block Scope phạm vi toàn cục [Global Scope] và phạm vi của hàm [Function Scope].
Global Scope
Function Scopephạm vi toàn cục.
JavaScript Block Scope
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
function myFunction[] {
// code ở đây cũng có thể sử dụng biến carName
}
Redeclaring [khai báo trùng lặp]toàn cục có thể được truy cập từ bất cứ đâu trong chương trình JavaScript .
Function Scope
JavaScript Block Scope [bên trong một hàm] sẽ có phạm vi cục bộ.
JavaScript Block Scope
// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
Redeclaring [khai báo trùng lặp]cục bộ chỉ có thể được truy cập từ bên trong hàm nơi chúng được khai báo.
JavaScript Block Scope
Redeclaring [khai báo trùng lặp] không thể có Block Scope.
Biến Global trong HTML [block là code trong dấu ngoặc nhọn {} ] có thể được truy cập từ bên ngoài block.
JavaScript Block Scope
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
Redeclaring [khai báo trùng lặp] Block Scope.
Biến Global trong HTML có phạm vi Block Scope.
Redeclaring [khai báo trùng lặp ] {} không thể được truy cập từ bên ngoài block:
JavaScript Block Scope
{
let x = 2;
}
// x không thể được sử dụng ở đây
Redeclaring [khai báo trùng lặp]
Biến Global trong HTML sẽ ảnh hưởng biến đó bên ngoài block:
var x = 10;
// ở đây x là 10
{
var x = 2;
// ở đây x là 2
}
// ở đây x là 2
Redeclaring [khai báo trùng lặp ] sẽ không ảnh hưởng đến biến đó bên ngoài block:
var x = 10;
// ở đây x là 10
{
let x = 2;
// ở đây x là 2
}
// ở đây x vẫn là 10
Lời kết
ES2015 đã giới thiệu 2 keywords mới quan trọng là:
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 và {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
3. {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
4 trong một vòng lặp :var i = 5;
for [var i = 0; i < 10; i++] {
// một số câu lệnh
}
// ở đây i là 10
Hai từ khóa này cung cấp các biến Block Scope [và constant] trong JavaScript.
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 trong một vòng lặp :let i = 5;
for [let i = 0; i < 10; i++] {
// một số câu lệnh
}
// Ở đây i vẫn là 5
Trước ES2015, JavaScript chỉ có 2 loại phạm vi: phạm vi toàn cục [Global Scope] và phạm vi của hàm [Function Scope].
Những biến được khai báo bên ngoài bất kì một hàm sẽ có phạm vi toàn cục.
Function Scope
JavaScript Block Scope và
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 là tương tự nhau khi được khai báo bên trong một hàm.Redeclaring [khai báo trùng lặp] Function Scope:
function myFunction[] {
var carName = "Volvo"; // Function Scope
}
function myFunction[] {
let carName = "Volvo"; // Function Scope
}
Global Scope
Biến Global trong HTML và
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 là tương tự nhau khi được khai báo bên ngoài một block.Redeclaring [khai báo trùng lặp ]Global Scope:
// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
0// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
1Function Scope
JavaScript Block Scope
Redeclaring [khai báo trùng lặp]
Biến Global trong HTML
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
4 thuộc về đối tượng window.JavaScript Block Scope
// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
2Redeclaring [khai báo trùng lặp]
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 không thuộc về đối tượng window.Biến Global trong HTMLJavaScript Block Scope
Redeclaring [khai báo trùng lặp] là được phép ở bất cứ đâu trong chương trình:
// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
4Biến Global trong HTML
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
4 với {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2, trong cùng phạm vi, hoặc cùng block, là KHÔNG được phép:// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
5Redeclaring [khai báo trùng lặp ]
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 với {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2, trong cùng
phạm vi, hoặc cùng block, là KHÔNG được phép:// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
6Lời kết
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2 với {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
4, trong cùng phạm vi, hoặc cùng block, là KHÔNG được phép:// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
7ES2015 đã giới thiệu 2 keywords mới quan trọng là:
2 và {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
3.{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
2, trong một phạm vi khác, hoặc một block khác, là được phép:// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
8Hai từ khóa này cung cấp các biến Block Scope [và constant] trong JavaScript.
Trước ES2015, JavaScript chỉ có 2 loại phạm vi: phạm vi toàn cục [Global Scope] và phạm vi của hàm [Function Scope].
Những biến được khai báo bên ngoài bất kì một hàm sẽ có phạm vi toàn cục.kéo tất cả các khai báo biến lên trên scope hiện tại.
// code ở đây không thể sử dụng biến carName
function myFunction[] {
var carName = "Volvo";
// code ở đây có thể sử dụng biến carName
}
// code ở đây không thể sử dụng biến carName
9Ví dụ:hoisting đoạn code trên được viết lại như sau:
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
0Biến toàn cục có thể được truy cập từ bất cứ đâu trong chương trình JavaScript .
{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
1Redeclaring [khai báo trùng lặp]
Biến Global trong HTML
2 và biến {
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
4{
var x = 2;
}
// x CÓ THỂ được sử dụng ở đây
0 trong Javascript, thông qua bài viết hi vọng các bạn sẽ biết cách khai báo biến một cách hợp lí hơn. var x = 10;
// ở đây x là 10
{
let x = 2;
// ở đây x là 2
}
// ở đây x vẫn là 10
Redeclaring [khai báo trùng lặp ]
Lời kết