Kiểu dữ liệu trong javascript - Giới thiệu 8 loại và cách lưu trữ kiểm tra dữ liệu

Nội dung bài viết

Video học lập trình mỗi ngày

Kiểu dữ liệu javascript là có 8 kiểu dữ liệu trong đó có 7 kiểu dữ liệu cơ bản hay còn gọi là Kiểu dữ liệu nguyên thủy trong JavaScript, và một kiểu đó là kiểu tham chiếu. Ở đây chúng ta cùng giải thích các kiểu dữ liệu một cách rõ rằng nhất. Và nó là một trong 66 khái niệm mà đã được đưa ra cho quy trình học javascript.

Trước khi nói về kiểu dữ liệu js thì chúng ta nên đền cập đến các biến trước tiên. Vì các biến trong lập trình js là một cái gì đó nó lộn xộn và lỏng lẻo. Bởi vì sao, bởi ví nó có thể lưu bất kỳ loại dữ liệu nào mà mỗi dev muốn. Trong JavaScript, chúng ta sử dụng từ khóa var để khai báo một biến (let và const được thêm vào để khai báo biến trong es6). Và bài viết này thuộc 66 khái niệm javascript mọi lập trình viên đều biết. Chúng tôi khuyến khích các bạn tìm hiểu nhiều khái niệm hơn tại đây.

Ví dụ:

var message1 = 10; // int
var message2 = true; // boolean 
var message3 = "Học lập trình js qua blog anonystick.com"; // string

Tất nhiên do nó lộn xộn nên ta cũng có thể thay đổi kiểu giá trị của cùng một biến. Mặc dù điều này không được khuyến khích nhưng nó hoàn toàn hợp lệ trong JavaScript.

var message1 = 10;
    message1 = true;

Trước đây chúng ta học chỉ có cơ bản là 6 kiểu dữ liệu đó là Undefined, Null, Boolean, Number, String, Symbol (es6)hay còn gọi là Kiểu dữ liệu nguyên thủy JavaScript. Và gần hơn thì chúng ta có thêm một kiểu nữa đó là BigInt được giới thiệu trong ES2020. Và thêm một kiểu dữ liệu nữa đó là kiểu dữ liệu tham chiếu (Object).

Object hiểu về cơ bản bao gồm một tập hợp các cặp key-value không có thứ tự như Array. Đừng nôn nóng chúng ta sẽ đến phần giải thích ngay sau đây thôi. Về BigInt bạn có thể đọc bài viết này: Các kiểu cơ bản của JavaScript-BigInt

javascript undefined

Undefined javascript là gì? Khi một biến được khai báo mà không gán hay set giá trị cho nó thì nó sẽ có giá trị undefined.

var message;
alert(message);// undefined

Cần lưu ý rằng biến được khai báo nhưng chưa được khởi tạo không giống với biến chưa được khai báo, xem dưới đây.

var msg;
alert(msg);// "undefined"
alert(a);// Error

Giờ sử dụng toán tử typeof để xem kiểu trên để xem thử

var msg;
// var a
alert(typeof msg);// "undefined"
alert( typeof a);// "undefined"

Ta thấy đấy cả hai đều có giá trị undefined. Dừng lại 1 giây nghĩ xem... kết quả này làm cho ta ngờ ngợ nhưng hợp lý về mặt logic. Bởi vì mặc dù hai biến này về cơ bản khác nhau về quan điểm kỹ thuật, nhưng thực tế không thể thực hiện các phép toán thực trên bất kỳ biến nào trong hai biến trên. Đúng không?

Mẹo: Cứ dùng typeof check xem nó undefined hay không, nếu undefined thì biến đó chưa được gán giá trị.

null javascript

Kiểu Null là kiểu dữ liệu thứ hai chỉ có một giá trị và giá trị đặc biệt này là null. Null chỉ ra rằng một biến không có giá trị.

let foo = null;
console.log(foo);   // null

và null chính là một giá trị đặc biệt của một Object.

console.log(typeof undefined);  // 'undefined'
console.log(typeof null);       // 'object'

Chúng ta không bàn đền vấn đề sự khác nhau giữa null và undefined javascript ở đây. Ở bài viết này chúng ta chỉ làm rõ khái niệm mà thôi. Nếu bạn muốn check undefined js thì hãy xem bài viết này: mastering check data types in javascript

Boolean trong JavaScript

Tiếp theo chúng ta tiếp tục xem xét kiểu dữ liệu Boolean trong js. Kiểu Boolean JavaScript là một trong những kiểu dữ liệu cơ bản được sử dụng nhiều nhất, chỉ có hai giá trị true và false (tất cả đều là chữ thường).

var  a = true;
var  b = false;

Giá trị boolean thường được sử dụng trong các phép toán so sánh và có điều kiện. Chúng ta có thể sử dụng hàm khởi tạo Boolean () để tạo một đối tượng boolean. Tuy nhiên, đây thường được coi là một thói quen xấu và nên tránh.

let x = new Boolean(true);
typeof  x;  // boolean

Chú ý: Đừng nhầm lẫn giữa kiểu dữ liệu nguyên thuỷ boolean với một Boolean object

Number trong javascript

Kiểu dữ liệu Number trong javascript theo tôi là dữ liệu phức tạp nhất cũng không kém phần thú vị. Kiểu Number thể biểu diễn đồng thời các giá trị số nguyên và Số thập phân, đồng thời nó cũng hỗ trợ các ký hiệu khoa học và thập lục phân khác nhau.

Ví dụ như sau:

 var intNum = 55; // Sô nguyên

// Số thập phân
var floatNum1 = 1.1; 
var floatNum2 = 0.1; 
var floatNum3 = .1; 

// Ký hiệu kiểu toán học 
var floatNum = 3.125e7; // tương đương với 31250000 

// dạng giá trị bát phân
var octalNum1 = 070; 
var octalNum2 = 079; 
var octalNum3 = 08; 

// dạng thập phân
var hexNum1 = 0xA; 
var hexNum2 = 0x1f;

Trong javascript thì Number.MIN_VALUE = 5e-324, và giá trị lớn nhất Number.MAX_VALUE = 1.7976931348623157e+308. Có nhiều bạn trong qúa trình làm việc thì sẽ gặp một gía trị được return về là Infinity thì lúc đó nôm na hiểu rằng kết quả đó sẽ vượt quá giá trị Number của javascript. Có ai nhanh não thắc mắc vậy làm sao giải quyết được điều này, đó chính là BigInt nói trên ra đời. Tiếp theo chúng ta xem thêm một loại cũng là kiểu Number nhưng cũng phải học thêm đó là NaN. NaN trong javascript là gì?

Nghĩa là, giá trị không phải số, được sử dụng để chỉ ra rằng một toán hạng ban đầu dự định trả về một giá trị nhưng cuối cùng không trả về một giá trị. NaN có hai đặc điểm đặc biệt: Bất kỳ hoạt động nào liên quan đến NaN (ví dụ NaN/10) sẽ trở lại NaN; NaN không bằng bất kỳ giá trị nào, bất kể so sánh với chính nó. Thật không công bằng nếu viết về NaN. Mà không nói đến một chức năng trong javascript đó là isNaN(). isNaN() Sau khi nhận một giá trị, nó sẽ cố gắng chuyển đổi giá trị thành một giá trị và bất kỳ giá trị nào không thể chuyển đổi thành giá trị sẽ khiến hàm trả về true.

alert(isNaN(NaN)); //true 
alert(isNaN(10)); //false
alert(isNaN("10")); //false
alert(isNaN("blue")); //true
alert(isNaN(true)); //false

Chú ý: Xem thêm về parseInt và parseFloat trong javascript. Nó hay ở chỗ tìm hiểu đến chốn nhé.

String trong javascript

Kiểu chuỗi trong javascript được biểu diễn bằng một cặp dấu ngoặc kép hoặc dấu ngoặc kép đơn. Người ta nói không có sự khác biệt giữa dấu ngoặc kép đơn và dấu ngoặc kép. Nhưng có thể nó khác nhau. Vì sao? Nói sau. ở đây để giải thích. Xem ví dụ sau:

var nameSite = "anonystick.com";
var typeBlog = 'Tips and tricks javascript';

Trong javascript các chuỗi là bất biến, nghĩa là gì? Nghĩa là khi các chuỗi được tạo, giá trị của chúng không thể thay đổi. Để thay đổi chuỗi được lưu trữ trong một biến, trước tiên hãy hủy chuỗi ban đầu, sau đó điền biến bằng một chuỗi khác có chứa giá trị mới.

var   name  = "anony";
name = name + "stick.com";

Xem thêm về kỹ năng về String in js Kỹ năng xử lý chuỗi trong Javascript 5 cách chuyển value sang string trong javascript.

Symbol trong es6

Kiểu Symbol được giới thiệu trong es6 là một kiểu dữ liệu nguyên thủy mới được thêm vào đại diện cho một giá trị duy nhất và là một định danh duy nhất. Giá trị Symbol được tạo ra bởi một hàm Symbol().

let id = Symbol("anonsytick");

Tính năng Symbol chính là tính duy nhất như đã đề cập ở trên, có thể được sử dụng làm tên thuộc tính duy nhất của đối tượng, ngay cả khi giá trị được tạo ra bởi cùng một biến không bằng nhau.

 let id1 = Symbol('anonsytick');
 let id2 = Symbol('anonsytick');
 console.log(id1 == id2);  //false

Thật không công bằng nếu chỉ nói về kiểu dữ liệu Symbol chỉ như vậy. Tôi sẽ dành cho nó một bài sâu chi tiết hơn về kiểu này. Chờ đi...

Kiểu dữ liệu tham chiếu - Kiểu đối tượng trong javascript

Đến lúc chúng ta nói về một kiểu dữ liệu mà có tính đồ sộ và phức tạp nhất. Chúng tôi khuyến khích bạn nên tìm hiểu về object trong javascript. Hãy theo đường link đó nhé. ở đây chúng ta sẽ giới thiệu về Object. Nghĩa là Object một đối tượng, là một tập hợp dữ liệu và các chức năng. Đối tượng có thể new được tạo bằng cách thực hiện một toán tử theo sau là tên của loại đối tượng sẽ được tạo.

Ví dụ :

var person1 = new Object(); 
person.name = "Anonystick"; 
person.age = 38;

var person2 = {}; //cũng tương đương new Object()
person2.name = "Anonystick"; 
perso2.age = 38;

Tương tự

var person3 = {
    name: "Anonystick.com",
    age: 38,
    action: function(){
            console.log(this.name);
    }            
}

Bất kỳ phương pháp nào ở trên đều có thể tạo ra một đối tượng, tất nhiên, nhiều ý tưởng viết và thiết kế hơn sẽ được phản ánh trong các bài viết về Object trong javascript.

Tóm lại

Trên đây là những khái niệm về kiểu dữ liệu dành cho những bạn nào đang còn mông lung. Tôi cũng đã cố gắng giải thích và tham khảo rất nhiều nguồn để cho các bạn một lời giải thích chuẩn và chính xác hơn. Hy vọng rằng 66 khái niệm trong javascript, sẽ trang bị một kiến thức vững chãi cho bạn, nếu bạn xác định đi vào con đường lập trình viên.

Đọc thêm: 66 khái niệm trong javascript

Có thể bạn đã bị missing