openplanning

Biến (Variable) trong JavaScript

  1. Biến (Variable) là gì?
  2. Khai báo biến

1. Biến (Variable) là gì?

Một biến (variable) là một "vị trí bộ nhớ" (Memory location) mà một chương trình sử dụng để lưu trữ các giá trị. Tên của biến được gọi là một định danh (identifier).
Tên của biến phải được đặt theo một quy tắc, dưới đây là các quy tắc để đặt tên biến:
  • Tên biến không được phép giống với các từ khóa (keyword).
  • Tên biến có thể chứa các chữ cái (alphabets) hoặc các con số, nhưng không bắt đầu bởi một con số.
  • Tên biến không thể chứa các khoảng trắng (white space), hoặc các ký tự đặc biệt ngoại trừ ký tự ngạch dưới (underscore) (_) và ký tự dolar ($).

2. Khai báo biến

Khai báo biến là cần thiết vì bạn cần phải làm như vậy trước khi sử dụng nó. Cú pháp ES5 sử dụng từ khóa var để khai báo một biến. ES6 thêm vào 2 từ khóa mới là let & const để khai báo một biến.
// 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
Khối lệnh (block) là một một tập hợp các lệnh nằm trong một "cặp ngoặc xoắn" (Curly brackets) { }.
let
Từ khóa let được sử dụng để khai báo một biến có phạm vi khối (block scope), điều này có nghĩa là biến này sẽ được chương trình nhận biết trong khối đó hoặc bên trong các khối con, nhưng không được chương trình nhận biết bên ngoài khối đã định nghĩa ra nó.
if(true) {
   let a = 200;
   console.log(a); // 200
}   
// Program will ignore this statement:
console.log(a);
Nếu bạn sử dụng từ khóa let để định nghĩa 2 biến có tên giống nhau, một biến khai báo ở khối cha, một biến khai báo ở khối con, chương trình sẽ coi đó là 2 biến khác nhau.
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
Từ khóa var được sử dụng để khai báo một biến, biến này có phạm vi (scope) rộng hơn so với biến let. Nó được chương trình nhận biết ở bên trong khối định nghĩa ra nó, trong các khối con, thậm trí được nhận biết ở bên ngoài khối đã khai báo nó.
if(true) {
   var a = 200;
   console.log(a); // 200
}    
console.log(a); // 200
Nếu bạn khai báo 2 biến cùng tên với từ khóa var, một biến khai báo trong khối cha, một biến trong khối con, chương trình sẽ coi 2 biến đó là giống nhau (Cùng một vị trí trên bộ nhớ).
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
Các biến được khai báo với từ khóa var trong một hàm sẽ chỉ được chương trình nhận biết trong hàm đó, nó không được nhận biết bên ngoài hàm.
// A function
var test = function()  {
    var a = 200;
    console.log(a); // 200
}
// Call function.
test();
console.log(a); // Not work!!
const
Từ khóa const được sử dụng để khai báo một hằng số (constant). Khi khai báo một hằng số bạn phải gán luôn giá trị cho nó. Nhưng bạn không thể gán giá trị mới cho biến này. Chú ý: Giống với biến let, biến const có phạm vi khối (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!!
Một biến được khai báo với từ khóa const, nó sẽ là một hằng số theo nghĩa bạn không thể gán giá trị mới cho nó, nhưng nó không phải là bất biến (imutable), bạn vẫn có thể thay đổi các property của nó.
Hãy xem ví dụ dưới đây, một biến được khai báo với từ khóa const, giá trị của nó là một đối tượng có nhiều property. Bạn có thể gán giá trị mới cho các property của đối tượng này.
// 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()
Phương thức Object.freeze() giúp đóng băng (freeze) một đối tượng, bạn không thể thay đổi gán giá trị mới cho các property của nó.
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

Các hướng dẫn ECMAScript, Javascript

Show More

Các hướng dẫn ECMAScript, Javascript

Show More

Các bài viết mới nhất

Show More