Tìm hiểu các kiểu dữ liệu trong Javascript

Giới thiệu

Kiểu dữ liệu được dùng để phân loại 1 kiểu dữ liệu cụ thể trong ngôn ngữ lập trình. Ví dụ, 1 số và 1 chuỗi ký tự có kiểu dữ liệu khác nhau sẽ được Javascript sử lý khác nhau.

Điều này quan trọng vì loại dữ liệu cụ thể mà bạn sử dụng sẽ xác định giá trị nào bạn có thể gán cho nó và những gì bạn có thể làm với nó. Điều này có nghĩa là, để có thể thực hiện các phép toán với các biến trong JavaScript, điều quan trọng là phải hiểu loại dữ liệu của bất kỳ biến nào đã cho.

Trong hướng dẫn này, chúng ta sẽ xem xét các kiểu dữ liệu hoạt động như thế nào trong JavaScript cũng như các kiểu dữ liệu quan trọng của ngôn ngữ lập trình. Chúng ta không tìm hiểu đầy đủ về các kiểu dữ liệu, nhưng sẽ giúp bạn làm quen với các Kiểu dữ liệu có sẵn trong JavaScript.

Học Java cơ bản nâng cao cấp tốc 

Dynamic Typing

Javascript có các kiểu dữ liệu Dynamic, nghĩa là việc kiểm tra kiểu được thực hiện trong lúc runtime thay vì compile time. Các kiểu dữ liệu của Python cũng được nhập động.
Với ngôn ngữ được nhập động, một biến có cùng tên có thể được sử dụng để giữ các loại dữ liệu khác nhau.

Ví dụ, biến t, được định nghĩa là biến bằng từ khóa let (lưu ý rằng để giữ một biến nhất định có giới hạn trong phạm vi miền giá trị), có thể được gán để giữ các kiểu dữ liệu khác nhau hoặc có thể được khởi tạo nhưng không được xác định:

let t = 16;         // t is a number
let t = "Teresa";   // t is a string
let t = true;       // t is a Boolean
let t;              // t is undefined

Mỗi biến số ở trên có thể được đặt bằng bất kỳ loại dữ liệu nào có sẵn trong Javascript. Chúng không cần phải khai báo 1 cách rõ ràng với 1 kiểu dữ liệu trước khi chúng sử dụng.

Kiểu dữ liệu Số

Javascript chỉ có 1 kiểu dữ liệu số dành cho cả số nguyên và số dấu phẩy động. Do đó, các số có thể được viết bằng JavaScript có hoặc không có số thập phân.

let num1 = 93;
let num2 = 93.00;

Trong cả hai trường hợp trên, kiểu dữ liệu là một số và giống nhau bất kể số có dấu thập phân hay không.

Ký hiệu chữcó thể được sử dụng trong JavaScript để viết tắt các số rất lớn hoặc nhỏ, như trong các ví dụ sau: 

let num3 = 987e8;       // 98700000000
let num4 = 987e-8;      // 0.00000987

Các số trong JavaScript được coi là chính xác tới 15 chữ số. Điều đó có nghĩa là các số sẽ được làm tròn sau khi đạt đến số 16:

let num5 = 999999999999999;     // remains as 999999999999999
let num6 = 9999999999999999;    // rounded up to 10000000000000000

Ngoài các số đại diện, loại số trong JavaScript cũng có ba giá trị biểu tượng có sẵn:

Infinity - một giá trị số dương vô cùng
-Infinity— giá trị số đại diện cho số âm vô cực
NaN - một giá trị số đại diện cho không phải là số

Infinity hoặc -Infinity sẽ được trả về nếu bạn tính toán với số lớn hơn số lớn nhất có thể có trong JavaScript. Các giá trị này cũng sẽ xảy ra cho các giá trị không xác định, như khi chia cho 0:

let num7 = 5 / 0;   // will return Infinity
let num8 = -5 / 0;  // will return -Infinity

Theo thuật ngữ kỹ thuật, Infinity sẽ được hiển thị khi một số vượt quá số 1.797693134862315E + 308, đại diện cho giới hạn trên trong JavaScript.Tương tự, -Infinity sẽ được hiển thị khi một số vượt quá giới hạn dưới -1.797693134862316E + 308.

Số Infinity có thể được dùng trong vòng lặp:

while (num9 != Infinity) { 
    // Code here will execute through num9 = Infinity
}

Đối với các số không phải là số hợp lệ, NaN sẽ được hiển thị. Nếu bạn cố gắng thực hiện phép toán trên một số và một giá trị không phải là số, NaN sẽ được trả về. Đây là trường hợp trong ví dụ sau:

let x = 20 / "Shark";   // x will be NaN

Số 20 không thể chia cho chuỗi "Shark" vì nó không thể được đánh giá dưới dạng một số, giá trị trả về cho biến x là NaN.Tuy nhiên, nếu chuỗi có thể được đánh giá dưới dạng giá trị số, biểu thức toán học có thể được thực hiện bằng JavaScript:

let y = 20 / "5";   // y will be 4

Trong ví dụ trên, vì chuỗi "5" có thể được đánh giá dưới dạng giá trị số trong JavaScript, nên nó được xử lý như vậy và sẽ làm việc với toán tử toán học để chia, /.Khi gán giá trị NaN cho một biến được sử dụng trong một phép toán, nó sẽ dẫn đến giá trị của NaN, ngay cả khi toán hạng khác là một số hợp lệ:

let a = NaN;
let b = 37;
let c = a + b;  // c will be NaN

Chỉ có một kiểu dữ liệu số trong JavaScript. Khi làm việc với các số, bất kỳ số nào bạn nhập sẽ được hiểu là loại dữ liệu cho các số; bạn không bắt buộc phải khai báo loại dữ liệu nào bạn đang nhập vì JavaScript được nhập động.

Strings

Strings là một chuỗi gồm một hoặc nhiều ký tự (chữ cái, số, ký hiệu). Các chuỗi hữu ích ở chỗ chúng đại diện cho dữ liệu văn bản.

Trong JavaScript, các chuỗi đặt trong cặp dấu ngoặc đơn ' ' hoặc cặp dấu ngoặc kép " ", do đó, để tạo chuỗi, phải đặt chúng trong cặp ngoặ đơn hay ngoặc kép:

let singleQuotes = 'This is a string in single quotes.';
let doubleQuotes = "This is a string in double quotes.";

Bạn có thể chọn sử dụng dấu ngoặc đơn hoặc dấu ngoặc kép, nhưng bất kỳ điều gì bạn quyết định sẽ vẫn nhất quán trong một chương trình.

Chương trình “Hello, World!” Thể hiện cách một chuỗi có thể được sử dụng trong lập trình máy tính, vì các ký tự tạo nên cụm từ Hello, World! trong alert() bên dưới là một chuỗi.

hello.html
<!DOCTYPE HTML>
<html>
<head>
<script>
function helloFunction() {
    alert("Hello, World!");
}
</script>
</head>
<body>
<p><button onclick="helloFunction()">Click me</button></p>
</body>
</html>

Khi chúng ta chạy code và nhấp vào nút Click me , chúng ta sẽ nhận được một cửa sổ thông báo bật lên với đầu ra sau:

output
Hello, World!

Giống như với các kiểu dữ liệu khác, chúng ta có thể lưu trữ các chuỗi trong các biến:

let hw = "Hello, World!";

Và hiển thị chuỗi trong phương thức alert() bằng cách gọi biến:

hello.html
...
<script>
let hw = "Hello, World!";
function helloFunction() {
    alert(hw);
}
</script>
...

 

output
Hello, World!

Có nhiều phép tính mà chúng ta có thể thực hiện trên các chuỗi, trong các chương trình cần vận dụng chúng để đạt được kết quả mà chúng ta đang tìm kiếm. Các chuỗi rất quan trọng để truyền thông tin cho người dùng và để người dùng giao tiếp thông tin trở lại chương trình.

Booleans

Kiểu dữ liệu Boolean có thể là một trong hai giá trị, true hoặc false  Booleans được sử dụng để biểu diễn các giá trị luận lý được liên kết với nhánh logic của toán học, thông báo các thuật toán trong khoa học máy tính.

Bất cứ khi nào bạn nhìn thấy kiểu dữ liệu Boolean, nó sẽ bắt đầu bằng chữ B được viết hoa bởi vì nó được đặt tên cho nhà toán học George Boole.

Nhiều phép tính trong toán học cho chúng ta câu trả lời là true hoặc false :

  • Lớn hơn
    • 500 > 100 true 
    • 1 > 5 false 
  • Bé hơn
    • 200 < 400  true 
    • 4 < 2 false 
  • Bằng nhau
    • 5 = 5  true  
    • 500 = 400  false 

Giống như với các kiểu dữ liệu khác, chúng ta có thể lưu trữ một giá trị Boolean trong một biến:

let myBool = 5 > 8; // false

Vì 5 không lớn hơn 8, biến myBool có giá trị sai.Khi bạn viết nhiều chương trình trong JavaScript, bạn sẽ quen thuộc hơn với cách Booleans hoạt động, các hàm và các phép toán khác nhau đánh giá true hay false có thể thay đổi chương trình như thế nào.

Arrays

Một mảng có thể chứa nhiều giá trị trong một biến duy nhất. Điều này có nghĩa là bạn có thể chứa một danh sách các giá trị trong một mảng và dùng vòng lặp để duyệt các phần tử của mảng.

Mỗi mục hoặc giá trị nằm bên trong một mảng được gọi là một phần tử. Bạn có thể truy cập các phần tử của một mảng bằng cách sử dụng một số chỉ mục.

Cũng giống như các chuỗi được định nghĩa là các ký tự giữa các dấu ngoặc kép, các mảng được xác định bằng cách có các giá trị giữa các dấu ngoặc vuông [].

Một mảng các chuỗi, ví dụ:

let fish = ["shark", "cuttlefish", "clownfish", "eel"];

Nếu chúng ta gọi biến fish chúng ta sẽ nhận được giá trị sau:

["shark", "cuttlefish", "clownfish", "eel"]

Mảng là một kiểu dữ liệu rất linh hoạt vì chúng có thể thay đổi được, có thêm vào, loại bỏ hay thay đổi

Objects 

Kiểu dữ liệu đối tượng trong JavaScript có thể chứa nhiều giá trị như các cặp name: value. Các cặp này cung cấp một cách hữu ích để lưu trữ và truy cập dữ liệu. Cú pháp của đối tượng được tạo thành từ các cặp name: value được phân cách bằng dấu hai chấm có dấu ngoặc nhọn ở hai bên {}.

Thông thường được sử dụng lưu trữ dữ liệu có liên quan, chẳng hạn như thông tin chứa trong ID, một đối tượng JavaScript thường có dạng như sau:

let sammy = {firstName:"Sammy", lastName:"Shark", color:"blue", location:"ocean"};

Ngoài ra với số lượng lớn các cặp name: value chúng có thể viết kiểu dữ liệu này trên nhiều dòng với 1 khoảng trắng sau dấu 2 chấm.

let sammy = {
    firstName: "Sammy",
    lastName: "Shark",
    color: "blue",
    location: "Ocean"
};
Biến đối tượng sammy trong ví dụ trên có 4 thuộc tính: firstName, lastName, color và location. Mỗi giá trị được truyền cách nhau bằng dấu hai chấm.

Làm việc với nhiều loại dữ liệu

Mặc dù mỗi chương trình bạn tạo sẽ chứa nhiều loại dữ liệu, điều quan trọng cần lưu ý là bạn thường sẽ thực hiện các hoạt động trong cùng một loại dữ liệu. Nghĩa là, bạn sẽ thực hiện toán học về các con số hoặc cắt các chuỗi.

Khi bạn sử dụng toán tử làm việc trên các kiểu dữ liệu, như toán tử + có thể thêm số hoặc nối chuỗi, bạn có thể đạt được kết quả không mong muốn.

Ví dụ, khi sử dụng toán tử + với các số và chuỗi với nhau, các số sẽ được coi là một chuỗi (do đó chúng sẽ được nối), nhưng thứ tự của các kiểu dữ liệu sẽ ảnh hưởng đến việc nối.

let o = "Ocean" + 5 + 3;

Nếu bạn gọi biến o, bạn sẽ nhận được giá trị sau được trả về:

output
Ocean53

Tuy nhiên, nếu bạn số lên trên đầu, hai số sẽ cộng vào trước khi chúng được diễn đạt dưới dạng chuỗi khi chương trình chạy tới "Ocean", vì vậy giá trị trả về sẽ là tổng của hai số được nối với chuỗi:

let p = 5 + 3 + "Ocean";
output
8Ocean

Do những kết quả không mong muốn này, bạn có thể sẽ thực hiện các phép tính và phương thức trong một loại dữ liệu thay vì dùng chung như vậy. Tuy nhiên, không trả về lỗi khi lẫn lộn các kiểu dữ liệu, như một số ngôn ngữ lập trình khác.

Phần kết luận

Tại thời điểm này, bạn nên hiểu rõ hơn về một số loại dữ liệu chính có sẵn để bạn sử dụng trong JavaScript.

Mỗi loại dữ liệu này sẽ trở nên quan trọng khi bạn phát triển các dự án lập trình bằng ngôn ngữ JavaScript.

Bài viết được dịch từ: http://www.digitalocean.com

 

 

Lập trình Javascript trong năm 2017 Lập trình Javascript trong năm 2017 Kid Blog Home Tạo website tĩnh với Github Tạo website tĩnh với Github Đặng Quang Huy
Lê Chí Linh