6 Kiểu dữ liệu Cơ bản trong Javascript

Trong hướng dẫn tự học Javascript này, bạn sẽ tìm hiểu về các loại dữ liệu có sẵn trong JavaScript.

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

Kiểu dữ liệu trong Javascript

Các kiểu dữ liệu về cơ bản chỉ định loại dữ liệu nào có thể được lưu trữ và thao tác trong một chương trình.
 

Có 6 loại dữ liệu cơ bản và 2 loại dữ liệu đặc biệt trong JavaScript và chúng có thể được chia thành ba loại chính:

- Dữ liệu nguyên thủy (hoặc chính): String, Number, Boolean

- Dữ liệu hỗn hợp (hoặc tham chiếu): Object, Array, Function

- Dữ liệu đặc biệt: Undefined, Null

Các kiểu dữ liệu nguyên thủy chỉ có thể giữ một giá trị tại một thời điểm, trong khi các kiểu dữ liệu tổng hợp có thể chứa các tập hợp các giá trị và các thực thể phức tạp hơn.

Để hiểu hơn về các kiểu dữ liệu này thì mời bạn tiếp tục đi sâu vào từng kiểu dữ liệu:

1. Dữ liệu kiểu String

Kiểu dữ liệu string được sử dụng để thể hiện dữ liệu văn bản (nghĩa là các chuỗi ký tự). Chuỗi được tạo bằng cách sử dụng dấu nháy đơn '' hoặc kép "" bao quanh một hoặc nhiều ký tự, cách tạo ra string như bên dưới:

var a = 'Hi there!';  // using single quotes
var b = "Hi there!";  // using double quotes

Bạn cũng có thể sử dụng nháy đơn / đôi bên trong nháy đơn / đôi, miễn là nó không trùng nhau.

var a = "Let's have a cup of coffee."; // Nháy đơn đặt trong nháy kép
var b = 'He said "Hello" and left.';  // Nháy kép đặt trong nháy đơn
var c = 'We\'ll never give up.';     // Chèn ký tự đặc biệt sau dấu \

Bạn sẽ được tìm hiểu kỹ hơn, nhanh hơn về Javascript nếu tham gia Khóa học Lập trình Web với PHP tại NIIT - ICT Hà Nội, hoặc đợi sang các bài học sau.

2. Kiểu dữ liệu Number

Kiểu dữ liệu number được sử dụng để biểu thị các số dương hoặc âm có hoặc không có vị trí thập phân hoặc các số được viết bằng ký hiệu số mũ, ví dụ: 1,5e-4 (tương đương 1,5x10-4).

var a = 25;         // integer
var b = 80.5;       // float
var c = 4.25e+6;    // Ký hiệu mũ, giống như 4.25e6 or 4250000
var d = 4.25e-6;    // Ký hiệu mũ, giống như 0.00000425

Kiểu dữ liệu number cũng bao gồm một số giá trị đặc biệt đó là: Vô vùng, - Vô cùng và NaN. Vô cùng đại diện cho Dương Vô cùng trong toán học, nó lớn hơn bất kỳ số nào. Vô cùng cũng là kết quả của việc chia một số khác không cho 0, như được minh họa dưới đây:

alert(16 / 0);  // Output: Vô cùng
alert(-16 / 0); // Output: - Vô cùng
alert(16 / -0); // Output: - Vô cùng

Trong khi NaN (Not - a - Number) đại diện cho một giá trị Không phải là Số đặc biệt. Nó là kết quả của một phép toán không hợp lệ hoặc không xác định, như lấy căn bậc hai của -1 hoặc chia 0 cho 0, v.v.

alert("Text" / 2);       // Output: NaN
alert("Text" / 2 + 10);  // Output: NaN
alert(Math.sqrt(-1));    // Output: NaN

Bạn sẽ tìm hiểu thêm về dữ liệu kiểu number trong các chương tiếp theo.

3. Kiểu dữ liệu Boolean

Kiểu dữ liệu Boolean chỉ có thể chứa hai giá trị: true hoặc false. Nó thường được sử dụng để lưu trữ các giá trị như có (true) hoặc không (false), on (true) hoặc off (flase), v.v. như ví dụ được trình bày dưới đây:

var isReading = true;   // Có, tôi đang đọc
var isSleeping = false; // Không, tôi không ngủ

Các giá trị Boolean cũng là kết quả của sự so sánh trong một chương trình. Ví dụ sau so sánh hai biến và hiển thị kết quả trong hộp thoại cảnh báo:

var a = 2, b = 5, c = 10;
 
alert(b > a) // Output: true
alert(b > c) // Output: false

Cách sử dụng kiểu dữ liệu Boolean để so sánh giá trị bạn sẽ được tiếp xúc trong bài Cấu trúc IF trong Javascript.

4. Kiểu dữ liệu Undefined trong Javascript

Kiểu dữ liệu undefined chỉ có thể có một giá trị đặc biệt là undefined. Nếu một biến đã được khai báo, nhưng chưa được gán một giá trị, thì mặc định nó có giá trị undefined.

var a;
var b = "Hello World!"
 
alert(a) // Output: undefined
alert(b) // Output: Hello World!

5. Kiểu dữ liệu Null trong Javascript

Đây là một loại dữ liệu đặc biệt khác chỉ có thể có một giá trị là null. Giá trị null có nghĩa là không có giá trị. Nó không phải là một chuỗi rỗng ('') hoặc 0, nó chỉ đơn giản là không có gì.

Một biến có thể được làm trống bằng cách gán cho nó giá trị null.

var a = null;
alert(a); // Output: null
 
var b = "Hello World!"
alert(b); // Output: Hello World!
 
b = null;
alert(b) // Output: null

6. Kiểu dữ liệu Object trong Javascript

Đối tượng (Object) là một kiểu dữ liệu phức tạp cho phép bạn lưu trữ các tập dữ liệu hỗn hợp.
 

Một đối tượng chứa các thuộc tính, được định nghĩa là một cặp key - value.

Tên khóa luôn là một chuỗi, nhưng giá trị có thể là bất kỳ loại dữ liệu nào như: string, number, booleans hoặc các loại dữ liệu phức tạp như mảng, hàm và các đối tượng khác.

Bạn sẽ tìm hiểu thêm về các đối tượng trong các chương sắp tới.
 

Ví dụ sau đây sẽ chỉ cho bạn cách đơn giản nhất để tạo một đối tượng trong JavaScript.

var emptyObject = {};
var person = {"name": "Clark", "surname": "Kent", "age": "36"};
 
// For better reading
var car = {
    "modal": "BMW X3",
    "color": "white",
    "doors": 5
}

Bạn có thể bỏ qua các dấu nháy xung quanh tên thuộc tính nếu tên đó là tên JavaScript hợp lệ.

Điều này có nghĩa là dấu nháy được yêu cầu xung quanh 'name' nhưng nó chỉ là tùy chọn mà thôi. Vì vậy, đối tượng car trong ví dụ trên cũng có thể được viết là:

var car = {
    modal: "BMW X3",
    color: "white",
    doors: 5
}

7. Dữ liệu kiểu mảng (Array)

Mảng (Array) là một loại đối tượng được sử dụng để lưu trữ nhiều giá trị trong một biến.

Mỗi giá trị (còn được gọi là một phần tử) trong một mảng có một vị trí số, được gọi là chỉ mục (chỉ số index) của nó và nó có thể chứa dữ liệu của bất kỳ loại dữ liệu nào: number, string, booleans, function, object và thậm chí các mảng khác.

Chỉ số mảng bắt đầu từ 0, do đó phần tử mảng đầu tiên là array[0] không phải là array[1] (Các bạnh lưu ý điều này nhé).

Cách đơn giản nhất để tạo một mảng là bằng cách chỉ định các thành phần mảng dưới dạng một danh sách được phân tách bằng dấu phẩy được bao quanh bởi dấu ngoặc vuông, như trong ví dụ dưới đây:

var colors = ["Red", "Yellow", "Green", "Orange"];
var cities = ["London", "Paris", "New York"];
 
alert(colors[0]);   // Output: Red
alert(cities[2]);   // Output: New York

Bạn sẽ tìm hiểu thêm về mảng trong chương Mảng trong Javascript.

8. Kiểu dữ liệu Function trong JS

Hàm (Function) là đối tượng có thể gọi được, thực thi một khối mã. Vì các hàm là các đối tượng, vì vậy có thể gán chúng cho các biến, như trong ví dụ dưới đây:

var greeting = function(){ 
    return "Hello World!"; 
}
 
// Kiểm tra kiểu biến là kiểu biến nào
alert(typeof greeting) // Output: function
alert(greeting());     // Output: Hello World!

Trong thực tế, các hàm có thể được sử dụng ở bất kỳ nơi nào có thể sử dụng bất kỳ giá trị nào khác.

Các hàm có thể được lưu trữ trong các biến, lưu trữ trong đối tượng và cả lưu trữ trong mảng.

Các hàm có thể được truyền dưới dạng đối số cho các hàm khác và các hàm có thể được trả về từ các hàm. Hãy xem xét các hàm sau:

function createGreeting(name){
    return "Hello, " + name;
}
function displayGreeting(greetingFunction, userName){
    return greetingFunction(userName);
}
 
var result = displayGreeting(createGreeting, "Peter");
alert(result); // Output: Hello, Peter

Bạn sẽ được tìm hiểu kỹ hơn về Hàm trong phần Hàm trong Javascript.

Toán tử typeof

Toán tử typeof có thể được sử dụng để tìm ra kiểu dữ liệu mà một biến hoặc toán hạng nó chứa. Nó có thể được sử dụng có hoặc không có dấu ngoặc đơn (typeof (x) hoặc typeof x).
 

Toán tử typeof đặc biệt hữu ích trong các tình huống khi bạn cần xử lý các giá trị của các loại dữ liệu khác nhau, nhưng bạn cần phải rất cẩn thận, vì nó có thể tạo ra kết quả không mong muốn trong một số trường hợp, như được minh họa trong ví dụ sau:

// Numbers
typeof 15;  // Returns: "number"
typeof 42.7;  // Returns: "number"
typeof 2.5e-4;  // Returns: "number"
typeof Infinity;  // Returns: "number"
typeof NaN;  // Returns: "number". Mặc dù là "Not-A-Number"
 
// Strings
typeof '';  // Returns: "string"
typeof 'hello';  // Returns: "string"
typeof '12';  // Returns: "string". Số trong dấu nháy là string
 
// Booleans
typeof true;  // Returns: "boolean"
typeof false;  // Returns: "boolean"
 
// Undefined
typeof undefined;  // Returns: "undefined"
typeof undeclaredVariable; // Returns: "undefined"
 
// Null
typeof Null;  // Returns: "object"
 
// Objects
typeof {name: "John", age: 18};  // Returns: "object"
 
// Arrays
typeof [1, 2, 4];  // Returns: "object"
 
// Functions
typeof function(){};  // Returns: "function"

Như bạn có thể thấy rõ trong ví dụ trên khi chúng ta kiểm tra giá trị null bằng cách sử dụng toán tử typeof (dòng thứ 22), nó trả về 'object' thay vì 'null'.
 

Đây là một lỗi lâu đời trong JavaScript, nhưng vì có rất nhiều code trên web đã viết như thế kể từ khi Javascript ra đời, việc khắc phục nó sẽ tạo ra nhiều vấn đề hơn. Do đó, ý tưởng sửa lỗi này đã bị ủy ban thiết kế và duy trì JavaScript từ chối.

Lời kết

Như vậy là bạn đã tìm hiểu về 6 kiểu dữ liệu cơ bản trong Javascript và 2 kiểu dữ liệu đặc biệt.

Hãy ghi nhớ một số trường hợp đặc biệt khi kiểm tra kiểu dữ liệu bằng toán tử typeof. Đây là vấn đề không thể sửa chữa vì thế hãy coi nó như là một phần cần phải học để kiểm soát.