React Biến Variables

1. React Variables là gì?

React Variables nó có nghĩa là Biến trong React.

Biến Variables trong React là nơi chứa và lưu trữ dữ liệu.

Trước ES6 bạn chỉ có thể khai báo biến với từ khóa var.Tuy nhiên bây giờ với ES6 bạn có thể khai báo biến trong React với 3 từ khóa như: var, let, const.

 

2. Cách khai báo biến và gán giá trị trong React

Quy tắc đặt tên biến:

    Tên biến phải là các chữ không dấu viết hoa hoặc viết thường, các chữ số từ 0-9 và dấu gạch dưới _.

    Tên biến bắt đầu phải là chữ hoặc dấu gạch dưới _, không được đặt tên biên bắt đầu bằng số, nếu tên biến bắt đầu là số thì chương trình sẽ báo lỗi.

Ví dụ đặt tên biến đúng như sau: var  emp_ID, _empID, emp_123 ;   đây là cách khai báo đúng.

Ví dụ đặt tên biến:  var  1emp_ID ; đây là khai báo sai, chương trình sẽ báo lỗi.

 

Cách khai báo biến và gán giá trị với từ khóa var.

Biến var được khai báo trong phạm vi hàm (function scope).

Cú pháp khai báo và gán giá trị cho biến var như sau:

      var  Ten_Bien ;

      Ten_Bien = "Gia Tri Value";

Ví dụ

import React, {Component} from "react";

var emp_Ten ;

var emp_Phone;

function Show_Employee_Infor(){

    emp_Ten = " Hoàng Hồng Phong ";

    emp_Phone = "0973551833";

    var emp_Infor = emp_Ten  + emp_Phone ;

   

    return(

        <h2>Họ Tên: {emp_Infor} </h2>

    );

}

export class Variables_Demo extends Component{

    render(){

        return(

            <Show_Employee_Infor />

        );

    }

}

Cách khai báo biến với từ khóa let

Biến let được khai báo trong phạm vi khối (block scope). Nếu bạn sử dụng let bên trong một khối if hoặc khối vòng lặp for, thì biến đó chỉ khả dụng bên trong khối if hoặc vòng lặp đó

Cú pháp khai báo biến let như sau:

      let  Ten_Bien;

      Ten_Bien = "Gia Tri Value"; 

Ví dụ: Chương trình sẽ báo lỗi biến không tồn tại do từ khóa let nằm ngoài phạm vi block sope mà biến đang nằm.Như trong ví dụ này thì biến bien_let chỉ có phạm vi trong lệnh if mà thôi.

Ví dụ

if(emp_Phone='0973551833')

    {

        let bien_let ='OK';

    }

 

var Message_box = "Khai báo biến " +  bien_let;

//Chương trình báo lỗi bien_let vì biến let này ngoài phạm vi khối

Nhưng nếu bạn thay bằng từ khóa var thì Ok.Bởi vì biến var có thể sử dụng ngoài phạm vi một khối.

Ví dụ

if(emp_Phone='0973551833')

    {

        var bien_let ='OK';

    }

   

    var Message_box = "Khai báo biến " +  bien_let;

 //Chương trình chạy OK.

Cách khai báo biến với từ khóa const

Biến const được khai báo trong phạm vi khối (block scope).

Biến const là một hằng số.Nó là một biến mà một khi đã được tạo thì giá trị của nó không bao giờ thay đổi.Bạn không thể thay đổi giá trị của biến const khi nó đã được gán giá trị.

Cú pháp khai báo biến const như sau:

      Const Ten_Bien = “Gia Tri”;

 

Ví dụ: Giả sử chúng ta thay đổi giá trị của biến const web_name nó sẽ báo lỗi.

Ví dụ

const Web_name ="https://ihoclaptrinh.com";

          Web_name = "https://www.google.com";

          //Chương trình sẽ báo lỗi.Vì biến const không được phép thay đổi giá trị.