[JavaScript] Bài 10 - Kiểu & Hằng

Giống với lộ trình học CSS mà chúng ta đã đi qua trước đó, chúng ta lại bắt đầu một chu kỳ mới trong vòng xoáy đệ quy mang tên học JavaScript.

Trích đoạn bài viết [CSS] Bài 9 - Kết Hợp Các Bộ Chọn:

Trong mọi khía cạnh của cuộc sống, cách tự nhiên nhất mà chúng ta học bất kỳ thứ gì, chắc chắn không bao giờ là một lộ trình học tập thẳng tắp. Chặng đường mà chúng ta phải đi qua luôn luôn là các đường xoáy đệ quy liền mạch và tiếp diễn không ngừng.

Một đường xoáy đệ quy

Chúng ta khởi đầu bằng việc học một vài thứ cơ bản và rồi bắt đầu tạo ra thứ gì đó; Sau đó chúng ta lại quay trở lại với những kiến thức trọng tâm để học nhiều thêm một chút nữa, và tạo ra những thứ mới tốt đẹp hơn một chút; Và cứ như vậy.... Và bây giờ thì chúng ta đang bắt đầu một chu kỳ mới bằng việc học thêm về các bộ chọn CSS. 😄

Trong bài viết này, chúng ta sẽ quay lại với chủ đề về Kiểu đã được giới thiệu trong bài JavaScript số 2. Tuy nhiên thì thay vì gặp lại Biến ở phần sau, chúng ta sẽ được gặp gỡ một khái niệm mới có tên gọi là Hằng. Trông tên gọi khác nhau vậy thôi chứ Biến và Hằng có nhiều điểm giống nhau lắm.

Các kiểu dữ liệu trong JavaScript & Chuyển kiểu dữ liệu

Từ góc nhìn tổng quan nhất về các Kiểu dữ liệu mà chúng ta đã đi qua thì về cơ bản JavaScript có 2 nhóm dữ liệu chính là các giá trị nguyên thủy primitive và các đối tượng object.

Các giá trị primitive là các giá trị không thay đổi và được biểu thị ở cấp độ lưu trữ dữ liệu bậc thấp nhất của ngôn ngữ, và được JavaScript phân bổ thành 7 kiểu dữ liệu với tên gọi lần lượt là:

• number - biểu thị các giá trị số học, được chia thành 2 nhóm Number và BigInt. Trong đó BigInt được sử dụng để biểu thị các giá trị số học rất rất lớn.
• string - biểu thị các dữ liệu văn bản, là một dãy các ký tự được biểu thị trong bộ nhớ của máy tính ở dạng các giá trị số nguyên dương.
• boolean - biểu thị 2 trạng thái của 1 đồng xu xoay lật. Kiểu này chỉ có 2 giá trị: true và false.
• null - kiểu dữ liệu đại diện cho trạng thái dữ liệu được lưu trữ là vô nghĩa; Có 1 giá trị duy nhất là null.
• undefined - một biến chưa được gán giá trị nào thì sẽ có giá trị mặc định là undefined và thuộc kiểu undefined.
• symbol - một biểu tượng symbol là một giá trị không trùng lặp ở bất kỳ đâu khác, và thường được sử dụng làm thành phần định danh cho một Object, giống như id trong HTML, hoặc số CMND của bạn.

Nhóm dữ liệu thứ 2 là các object thì chúng ta không thể liệt kê phân loại được vì về cơ bản là không có giới hạn. Mỗi một class có thể được xem là một kiểu dữ liệu và chúng ta có thể thực hiện phép kiểm tra một object bất kỳ có thuộc class đó hay không. Tuy nhiên, chúng hãy cùng nói một nút về các class đại diện cho các kiểu primitive.

Với mỗi một kiểu primitive được liệt kê ở trên thì JavaScript có định nghĩa sẵn một class tương ứng để biểu thị và cung cấp các công cụ để làm việc với kiểu dữ liệu đó. Ví dụ như đối với kiểu number thì chúng ta có class Number và BigInt cung cấp các công cụ để làm việc với các giá trị số học. Chúng ta cũng có thể sử dụng các class này để tạo ra các object bao quanh một giá trị số học primitive.

number.js

var primitiveTen = 10;
var objectTen = new Number(primitiveTen);
var binaryTen = objectTen.toString(2);
console.log(binaryTen);
// kết quả: '1010'

Khi chúng ta gọi phương thức từ một giá trị primitive như một object, các môi trường chạy JavaScript đều xử lý bằng cách tạo ra một object vỏ bọc tạm thời để dòng lệnh có thể được thực thi, và sau đó object tạm sẽ được xóa đi.

number.js

// `objectTen` sẽ được tạo ra tạm thời
// để thay vào vị trí của `10`
var binaryTen = 10.toString(2);
console.log(binaryTen);
// kết quả: '1010'

Object cơ sở Number thực chất là một hàm function và có thể được sử dụng để chuyển đổi một giá trị từ một kiểu dữ liệu khác thành một giá trị number ở dạng primitive. Tính năng này được JavaScript triển khai tương tự ở các class tương ứng với các kiểu primitive khác.

number.js

var stringTen = '10';
var numberTen = Number(stringTen);
console.log(numberTen);
// kết quả: 10

Và khi một phép toán được thực hiện giữa các giá trị khác kiểu, thì các môi trường chạy JavaScript sẽ tự động tạm thời quy đổi các giá trị sang cùng kiểu để thực hiện tính toán. Về quy tắc chuyển đổi thì 1 phần sẽ phụ thuộc vào mong muốn của chúng ta khi thực hiện thao tác giữa 2 giá trị, và 1 phần là phụ thuộc vào quy ước định trước của ngôn ngữ.

Ví dụ như phép + giữa 1 string và 1 number, từ góc nhìn của nhiều người có thể sẽ là muốn tự động chuyển string thành một giá trị number và thực hiện phép cộng số học. Nhưng quy ước định trước của JavaScript đã được đồng thuận và sử dụng từ khi ngôn ngữ này xuất hiện, đó là biểu thị cho một phép nối chuỗi.

Vì vậy nên nếu như chúng ta muốn viết ra những đoạn code để bất kỳ ai cũng có thể đọc hiểu được (kể cả người chưa từng lập trình), thì JavaScript có cung cấp các hàm để thể biểu thị thao tác mà chúng ta muốn thực hiện rõ nghĩa hơn.

string.js

var template = 'Ý nghĩa của vũ trụ: ';
var message = template.concat(42);
console.log(message);
// kết quả: 'Ý nghĩa của vũ trụ: 42'

Sử dụng Hằng trong JavaScript

Một Hằng hay constant cũng là một chiếc hộp để lưu trữ giá trị giống như một Biến variable mà chúng ta đã biết trước đó. Điểm khác biệt cơ bản nhất là chúng ta sẽ không thể bỏ giá trị đang được lưu trữ ra - để thay một giá trị mới vào trong hộp. Lấy ra để xem thì được, nhưng thay thế thì không!

constant.js

const infinity = 10.01;
infinity = 10;
// console hiện thông báo lỗi

Ngoài ra thì hằng còn giúp chúng ta tránh được trường hợp khai báo lặp khi chúng ta có nhiều hàm trong một tệp JavaScript được viết khá dài.

library.js

const doubleIt = function(num) { return num * 2; }
/* 1001 hàm khác ở đoạn giữa */
const doubleIt = function(str) { return str.concat(str); }
// console hiện thông báo lỗi

Nếu chúng ta sử dụng cú pháp khai báo hàm function doSomeThing() hoặc gán hàm không tên vào biến var doSomeThing = function(), thì khi trình chạy JavaScript đi tới đoạn khai báo lặp sẽ ngầm hiểu là chúng ta muốn ghi đè đoạn code đã viết trước đó.

Đâu đó xen giữa Biến và Hằng

Chúng ta cũng có thể tạo ra những chiếc hộp lưu trữ dữ liệu bằng từ khóa let (hãy để).

let.js

let itBe = 'Connie Talbot';

Về cơ bản thì những chiếc hộp let giống với những chiếc hộp var ở chỗ là chúng ta có thể thay thế giá trị đang lưu trữ bằng một giá trị khác; Và giống với những chiếc hộp const ở chỗ là chúng ta không thể tạo ra những chiếc hộp mới trùng tên với những chiếc đã tồn tại.

let.js

let itBe = 'Connie Talbot';
let itBe = 1001;
// console hiện thông báo lỗi

Thực ra giữa những chiếc hộp var và 2 nhóm hộp mới cũng còn một chút sự khác biệt nữa nhưng chúng ta sẽ để dành cho bài viết tiếp theo về Hàm & Vùng. Hẹn gặp lại bạn trong bài viết tiếp theo.

Let It Be - Connie Talbot

(Sắp đăng tải) [JavaScript] Bài 11 - Hàm & Vùng