JavaScript có nhiều kiểu dữ liệu khác nhau để biểu diễn thông tin khác nhau trong chương trình. Dưới đây là một tóm tắt về các kiểu dữ liệu quan trọng trong JavaScript:
- String: Được sử dụng để biểu diễn chuỗi ký tự. Ví dụ:
"Hello, World". - Number: Được sử dụng để biểu diễn số học, có thể là số nguyên hoặc số thập phân. Ví dụ:
42,3.14. - BigInt: Dùng để biểu diễn số nguyên lớn, thường có hậu tố “n” để chỉ ra rằng đó là kiểu BigInt. Ví dụ:
10n,1234567890123456789012345678901234567890n. - Boolean: Biểu diễn giá trị true (đúng) hoặc false (sai).
- Undefined: Đại diện cho một biến chưa được khởi tạo giá trị hoặc một tham số hàm không được gọi với đối số.
- Null: Được sử dụng để biểu diễn giá trị trống hoặc không tồn tại.
- Symbol: Được sử dụng để tạo ra giá trị duy nhất, thường được sử dụng trong cấu trúc dữ liệu như Maps và Sets.
- Object: Có thể chứa các kiểu dữ liệu khác và thường được sử dụng để tạo các đối tượng, mảng, hoặc thậm chí là hàm.
Ví dụ tổng hợp các kiểu dữ liệu của Javascript.
Numbers (Số): Trong ví dụ này, có hai biến số được khai báo: length và weight. Biến length có giá trị là 16, và biến weight có giá trị là 7.5. Điều này thể hiện rằng bạn có thể sử dụng biến để lưu trữ các giá trị số, bao gồm cả số nguyên và số thập phân.
// Numbers:
let length = 16;
let weight = 7.5;Strings (Chuỗi): Hai biến chuỗi được khai báo là color và lastName. Biến color chứa chuỗi "Yellow", trong khi biến lastName chứa chuỗi "Johnson". Chuỗi là một loại dữ liệu được sử dụng để lưu trữ văn bản.
// Strings:
let color = "Yellow";
let lastName = "Johnson";Booleans (Luận lý): Trong JavaScript, giá trị boolean có thể là true hoặc false. Hai biến boolean được khai báo là x và y. Biến x có giá trị là true, trong khi biến y có giá trị là false. Loại dữ liệu boolean thường được sử dụng để biểu thị trạng thái đúng/sai hoặc có/không có.
// Booleans
let x = true;
let y = false;Object (Đối tượng): Biến person là một đối tượng JavaScript. Đối tượng này có hai thuộc tính: firstName với giá trị là "John" và lastName với giá trị là "Doe". Điều này thể hiện cách bạn có thể tạo và sử dụng đối tượng để tổ chức thông tin.
// Object:
const person = {firstName:"John", lastName:"Doe"};Array object (Mảng đối tượng): Biến cars là một mảng JavaScript chứa ba phần tử: "Saab", "Volvo" và "BMW". Mảng cho phép bạn lưu trữ nhiều giá trị trong một biến và truy cập chúng dựa trên vị trí.
// Array object:
const cars = ["Saab", "Volvo", "BMW"];Date object (Đối tượng ngày tháng): Biến date là một đối tượng ngày tháng JavaScript được tạo với giá trị "2022-03-25". Điều này cho phép bạn làm việc với thời gian và ngày tháng trong code JavaScript.
// Date object:
const date = new Date("2022-03-25");Lưu ý là biến JavaScript có thể chứa bất kỳ loại dữ liệu nào và bạn có thể sử dụng chúng để lưu trữ và xử lý thông tin trong ứng dụng của mình.Để có thể thực hiện các phép toán trên biến, bạn cần biết về kiểu dữ liệu của chúng.
Nếu không có kiểu dữ liệu, máy tính không thể giải quyết một ví dụ như sau:
let x = 16 + "Volvo";Liệu việc thêm “Volvo” vào số 16 có ý nghĩa gì không? Liệu nó sẽ tạo ra một lỗi hay sẽ tạo ra kết quả gì đó?
Ví dụ trên sẽ được xử lý như sau:
<html>
<body>
<p id="demo"></p>
<script>
let x = 16 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>Lưu ý rằng khi bạn thực hiện phép cộng giữa một số và một chuỗi, JavaScript sẽ chuyển đổi số thành chuỗi. Điều này có nghĩa là nó sẽ nối chuỗi “16” và “Volvo” lại với nhau, thay vì thực hiện phép cộng số học. Kết quả của biến x sẽ là một chuỗi "16Volvo".
Tương tự, trong ví dụ dưới đây:
<html>
<body>
<p id="demo"></p>
<script>
let x = "Volvo" + 16;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>JavaScript cũng sẽ chuyển đổi số 16 thành chuỗi và nối chúng lại với chuỗi “Volvo” cho kết quả là "Volvo16".
Điều này thể hiện tính linh hoạt của JavaScript trong việc làm việc với các kiểu dữ liệu khác nhau, nhưng cũng đặt ra sự cẩn trọng trong việc xử lý kiểu dữ liệu để tránh các kết quả không mong muốn.
JavaScript thực hiện việc đánh giá biểu thức từ trái sang phải.
Nhưng chuỗi thứ tự của các phép toán có thể dẫn đến các kết quả khác nhau.
Trong ví dụ đầu tiên, JavaScript xử lý 16 và 4 như là số cho đến khi nó gặp chuỗi “Volvo”. Do đó, nó thực hiện phép cộng số học trước và sau đó nối với chuỗi “Volvo”.
<html>
<body>
<p id="demo"></p>
<script>
let x = 16 + 4 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>Kết quả:
20VolvoTrong ví dụ thứ hai do toán hạng đầu tiên là một chuỗi nên tất cả các toán hạng sau đó đều được coi là chuỗi. Do đó nó thực hiện phép nối chuỗi cho tất cả các toán hạng thay vì thực hiện phép cộng số học.
<html>
<body>
<p id="demo"></p>
<script>
let x = "Volvo" + 16 + 4;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>Kết quả.
Volvo164Trong JavaScript, các kiểu dữ liệu là động, có nghĩa là cùng một biến có thể được sử dụng để chứa các kiểu dữ liệu khác nhau.
Ví dụ dưới đây sẽ cho kết quả là John.
<html>
<body>
<p id="demo"></p>
<script>
let x; // Now x is undefined
x = 5; // Now x is a Number
x = "John"; // Now x is a String
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>Trong JavaScript, chuỗi (hoặc chuỗi văn bản) là một chuỗi các ký tự như “John Doe”. Chuỗi được viết bằng cách sử dụng dấu ngoặc kép hoặc dấu ngoặc đơn. Bạn có thể sử dụng dấu ngoặc kép hoặc dấu ngoặc đơn.
<html>
<body>
<p id="demo"></p>
<script>
let carName1 = "Volvo XC60";
let carName2 = 'Volvo XC60';
document.getElementById("demo").innerHTML =
carName1 + "<br>" +
carName2;
</script>
</body>
</html>Ví dụ trên đây kết quả sẽ như dưới.
Volvo XC60
Volvo XC60Bạn cũng có thể sử dụng dấu ngoặc đơn hoặc dấu ngoặc kép trong một chuỗi, miễn là chúng không trùng khớp với dấu ngoặc xung quanh chuỗi:
<html>
<body>
<p id="demo"></p>
<script>
let answer1 = "It's alright";
let answer2 = "He is called 'Johnny'";
let answer3 = 'He is called "Johnny"';
document.getElementById("demo").innerHTML =
answer1 + "<br>" +
answer2 + "<br>" +
answer3;
</script>
</body>
</html>Kết quả.
It's alright
He is called 'Johnny'
He is called "Johnny"Tất cả các số trong JavaScript được lưu trữ dưới dạng số thập phân (floating point). Số có thể được viết có hoặc không có phần thập phân:
<html>
<body>
<p id="demo"></p>
<script>
let x1 = 34.00;
let x2 = 34;
let x3 = 3.14;
document.getElementById("demo").innerHTML =
x1 + "<br>" + x2 + "<br>" + x3;
</script>
</body>
</html>Kết quả.
34
34
3.14Bạn cũng có thể biểu diễn các số rất lớn hoặc rất nhỏ bằng cách sử dụng ký hiệu exponential.
<p id="demo"></p>
<script>
let y = 123e5;
let z = 123e-5;
document.getElementById("demo").innerHTML =
y + "<br>" + z;
</script>Kết quả.
12300000
0.00123Lưu ý rằng trong hầu hết các ngôn ngữ lập trình có nhiều loại số khác nhau, chẳng hạn:
- Số nguyên (integers): byte (8-bit), short (16-bit), int (32-bit), long (64-bit)
- Số thực (floating-point): float (32-bit), double (64-bit).
Trong JavaScript, các số luôn luôn thuộc kiểu một loại: double (64-bit floating point).
Bạn cũng có kiểu dữ liệu BigInt.
Được giới thiệu trong phiên bản ES2020, BigInt được sử dụng để lưu trữ các giá trị số nguyên quá lớn để được biểu diễn bằng kiểu dữ liệu Number thông thường trong JavaScript.
<html>
<body>
<p id="demo"></p>
<script>
let x = BigInt("123456789012345678901234567890");
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>Kết quả.
123456789012345678901234567890Boolean trong JavaScript chỉ có hai giá trị true hoặc false và thường được sử dụng trong các điều kiện kiểm tra.
<html>
<body>
<p id="demo"></p>
<script>
let x = 5;
let y = 5;
let z = 6;
document.getElementById("demo").innerHTML =
(x == y) + "<br>" + (x == z);
</script>
</body>
</html>Kết quả.
true
falseMảng trong JavaScript được viết bằng dấu ngoặc vuông [] và các phần tử của mảng được phân tách bằng dấu phẩy.
Ví dụ dưới đây khai báo (tạo) một mảng có tên là cars chứa ba phần tử (tên của các loại xe):
<html>
<body>
<p id="demo"></p>
<script>
const cars = ["Saab","Volvo","BMW"];
document.getElementById("demo").innerHTML = cars[0];
</script>
</body>
</html>Kết quả.
SaabChỉ mục của mảng được đánh số từ 0, có nghĩa là phần tử đầu tiên là [0], phần tử thứ hai là [1], và cứ tiếp tục như vậy.
Đối tượng trong JavaScript được viết bằng dấu ngoặc nhọn {} và các thuộc tính của đối tượng được viết dưới dạng cặp tên:giá trị, cách nhau bởi dấu phẩy.
<html>
<body>
<p id="demo"></p>
<script>
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>
</body>
</html>Trong ví dụ trên, đối tượng (person) có 4 thuộc tính: firstName, lastName, age và eyeColor. Và kết quả sẽ như dưới.
John is 50 years old.Toán tử typeof trong JavaScript được sử dụng để xác định kiểu của biến JavaScript.
Toán tử typeof trả về kiểu của một biến hoặc biểu thức.
Ví dụ 1.
<html>
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof "" + "<br>" +
typeof "John" + "<br>" +
typeof "John Doe";
</script>
</body>
</html>Kết quả.
string
string
stringVí dụ 2.
<html>
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof 0 + "<br>" +
typeof 314 + "<br>" +
typeof 3.14 + "<br>" +
typeof (3) + "<br>" +
typeof (3 + 4);
</script>
</body>
</html>Kết quả.
number
number
number
number
numberTrong JavaScript, một biến mà không có giá trị sẽ có giá trị là undefined và kiểu dữ liệu cũng là undefined.
<html>
<body>
<p id="demo"></p>
<script>
let car;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>
</body>
</html>Kết quả.
undefined
undefinedBất kỳ biến nào cũng có thể được làm trống bằng cách gán giá trị là undefined. Kiểu dữ liệu cũng sẽ là undefined.
<html>
<body>
<p id="demo"></p>
<script>
let car = "Volvo";
car = undefined;
document.getElementById("demo").innerHTML = car + "<br>" + typeof car;
</script>
</body>
</html>Kết quả.
undefined
undefinedGiá trị rỗng không liên quan gì đến undefined.
Một chuỗi rỗng có cả giá trị hợp lệ và kiểu dữ liệu.
<html>
<body>
<p id="demo"></p>
<script>
let car = "";
document.getElementById("demo").innerHTML =
"The value is: " +
car + "<br>" +
"The type is: " + typeof car;
</script>
</body>
</html>Kết quả.
The value is:
The type is: string
