JavaScript Data Types - Các kiểu dữ liệu trong JavaScript
Các kiểu dữ liệu trong JavaScript(JavaScript Data Types)
Các biến JavaScript có thể giữ nhiều kiểu dữ liệu: các số, các chuỗi, các đối tượng(objects) và nhiều hơn nữa:
var length = 16; // Number
var lastName = "Johnson"; // String
var x = {firstName:"John", lastName:"Doe"}; // ObjectKhái niệm về các kiểu dữ liệu(The Concept of Data Types)
Trong lập trình, các kiểu dữ liệu là một khái niệm quan trọng.
Để có thể thao tác trên các biến, việc biết chút ít về kiểu dữ liệu khá quan trọng.
Khi không có kiểu dữ liệu, một máy tính không thể an toàn giải quyết điều này:
var x = 16 + "Volvo";Việc cộng "Volvo" với 16 có nghĩa gì không? Liệu nó sẽ cho ra một lỗi hay cho ra một kết quả?
JavaScript sẽ coi ví dụ trên như thể:
var x = "16" + "Volvo";Tip: Khi công thêm một số và một chuỗi, JavaScript sẽ coi số đó là một chuỗi.
ví dụ
var x = 16 + "Volvo";<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>When adding a number and a string, JavaScript will treat the number as a string.</p>
<p id="demo"></p>
<script>
var x = 16 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>ví dụ
var x = "Volvo" + 16;<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>When adding a string and a number, JavaScript will treat the number as a string.</p>
<p id="demo"></p>
<script>
var x = "Volvo" + 16;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
JavaScript quy định một biểu thức chạy từ trái sang phải. Trường hợp khác nhau có thể cho ra các kết quả khác nhau:
JavaScript:
var x = 16 + 4 + "Volvo";<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>
<p id="demo"></p>
<script>
var x = 16 + 4 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>
</body>
</htmlKết quả:
20VolvoJavaScript:
var x = "Volvo" + 16 + 4;<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>
<p id="demo"></p>
<script>
var x = "Volvo" + 16 + 4;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
Kết quả:
Volvo164Trong ví dụ dầu tiên, JavaScript coi 16 và 4 như các chữ số, cho tới khi nó đến "Volvo".
Trong ví dụ thứ hai, từ khi toán hạng đầu tiên là một chuỗi, tất cả toán hạng sẽ được coi là các chuỗi.
Các kiểu trong JavaScript khá linh động(JavaScript Types are Dynamic)
JavaScript có các kiểu linh động. Điều này nghĩa là một biến có thể dùng để trữ các kiểu dữ liệu khác nhau:
ví dụ
var x; // Now x is undefined
x = 5; // Now x is a Number
x = "John"; // Now x is a String<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Data Types</h2>
<p>JavaScript has dynamic types. This means that the same variable can be used to hold different data types:</p>
<p id="demo"></p>
<script>
var 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>
Các chuỗi trong(JavaScript Strings)
Một chuỗi(hay một văn bản) là một tập hợp của các kí tự như "John Doe".
Các chuỗi được viết với các dấu nháy. Bạn có thể dùng dấu nháy đơn hoặc đôi:
ví dụ
var carName1 = "Volvo XC60"; // Using double quotes
var carName2 = 'Volvo XC60'; // Using single quotes<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Strings</h2>
<p>Strings are written with quotes. You can use single or double quotes:</p>
<p id="demo"></p>
<script>
var carName1 = "Volvo XC60";
var carName2 = 'Volvo XC60';
document.getElementById("demo").innerHTML =
carName1 + "<br>" +
carName2;
</script>
</body>
</html>
Bạn có thể dùng các dấu nháy bên trong một chuỗi, miễn là chúng không trùng với dấu nháy bao bọc chuỗi đó:
ví dụ
var answer1 = "It's alright"; // Single quote inside double quotes
var answer2 = "He is called 'Johnny'"; // Single quotes inside double quotes
var answer3 = 'He is called "Johnny"'; // Double quotes inside single quotes<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Strings</h2>
<p>You can use quotes inside a string, as long as they don't match the quotes surrounding the string:</p>
<p id="demo"></p>
<script>
var answer1 = "It's alright";
var answer2 = "He is called 'Johnny'";
var answer3 = 'He is called "Johnny"';
document.getElementById("demo").innerHTML =
answer1 + "<br>" +
answer2 + "<br>" +
answer3;
</script>
</body>
</html>
Bạn sẽ học được nhiều hơn về các chuỗi sau trong hướng dẫn này.
Các số trong JavaScript(JavaScript Numbers)
JavaScript chỉ có một kiểu cho các chữ số.
Các chữ số có thể viết cùng, hoặc không cùng phần thập phân.
ví dụ
var x1 = 34.00; // Written with decimals
var x2 = 34; // Written without decimals<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Numbers</h2>
<p>Numbers can be written with, or without decimals:</p>
<p id="demo"></p>
<script>
var x1 = 34.00;
var x2 = 34;
var x3 = 3.14;
document.getElementById("demo").innerHTML =
x1 + "<br>" + x2 + "<br>" + x3;
</script>
</body>
</html>
Các số cự lớn hoặc các số cực nhỏ có thể được viết với kí hiệu khoa học (số mũ):
ví dụ
var y = 123e5; // 12300000
var z = 123e-5; // 0.00123<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Numbers</h2>
<p>Extra large or extra small numbers can be written with scientific (exponential) notation:</p>
<p id="demo"></p>
<script>
var y = 123e5;
var z = 123e-5;
document.getElementById("demo").innerHTML =
y + "<br>" + z;
</script>
</body>
</html>
Bạn sẽ học thêm về các chữ số sau trong hướng dẫn này .
JavaScript Booleans
Booleans chỉ có thể có hai giá trị: true hay false.
ví dụ
var x = 5;
var y = 5;
var z = 6;
(x == y) // Returns true
(x == z) // Returns false<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Booleans</h2>
<p>Booleans can have two values: true or false:</p>
<p id="demo"></p>
<script>
var x = 5;
var y = 5;
var z = 6;
document.getElementById("demo").innerHTML =
(x == y) + "<br>" + (x == z);
</script>
</body>
</html>
Booleans thường được dùng trong việc thử nghiệm các điều kiện.
Bạn sẽ học thêm về thử nghiệm các điểu kiện sau trong hương dẫn này (??:D).
Các mảng trong JavaScript(JavaScript Arrays)
Các mảng JavaScript được viết với các dấu ngoặc vuông.
Các phần tử trong mảng được tách biệt bởi các dấu phẩy.
Đoạn code sau khai báo(tạo) một mảng gọi là cars, chứa 3 phần tử (các tên xe):
ví dụ
var cars = ["Saab", "Volvo", "BMW"];<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Arrays</h2>
<p>Array indexes are zero-based, which means the first item is [0].</p>
<p id="demo"></p>
<script>
var cars = ["Saab","Volvo","BMW"];
document.getElementById("demo").innerHTML = cars[0];
</script>
</body>
</html>
Các vị trí trong mảng bắt đầu bằng không, nghĩa là phần tử đầu tiên là [0], thứ hai là[1], và tiếp tục.
Bạn sẽ học nhiều hơn về mảng sau trong hướng dẫn này.
Các đối tượng trong JavaScript(JavaScript Objects)
Các đối tượng JavaScript được viết với các dấu ngoặc nhọn {}.
Các thuộc tính đối tượng thường được viết như - tên:giá trị, phân cách bằng dấu phẩy.
ví dụ
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Objects</h2>
<p id="demo"></p>
<script>
var person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>
</body>
</html>
Đối tượng(người) trong ví dụ trên có 4 thuộc tính: firstName, lastName, age, và eysColor.
Bạn sẽ học nhiều hơn về các đối tượng sau trong hướng dẫn này.
Toán tử typeof(The typeof Operator)
Bạn có thể dùng toán tử JavaScript typeof(kiểu của...) để tìm kiểu của một biến trong JavaScript.
Toán tử typeof trả về kiểu của một biến hoặc một biểu thức:
ví dụ
typeof "" // Returns "string"
typeof "John" // Returns "string"
typeof "John Doe" // Returns "string"<!DOCTYPE html>
<html>
<body>
<h2>JavaScript typeof</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof "" + "<br>" +
typeof "John" + "<br>" +
typeof "John Doe";
</script>
</body>
</html>ví dụ
typeof 0 // Returns "number"
typeof 314 // Returns "number"
typeof 3.14 // Returns "number"
typeof (3) // Returns "number"
typeof (3 + 4) // Returns "number"<!DOCTYPE html>
<html>
<body>
<h2>JavaScript typeof</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>
<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>Không xác định(Undefined)
Trong JavaScript, một biến không có một giá trị, sẽ có giá trị là undefined. Kiểu cũng là undefined.
ví dụ
var car; // Value is undefined, type is undefined<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>The value (and the data type) of a variable with no value is <b>undefined</b>.</p>
<p id="demo"></p>
<script>
var car;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>
</body>
</html>
Biến nào cũng có thể bị bỏ trống, bởi thiết đặt giá trị thành undefined.Kiểu cũng sẽ thành undefined.
ví dụ
car = undefined; // Value is undefined, type is undefined<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>Variables can be emptied if you set the value to <b>undefined</b>.</p>
<p id="demo"></p>
<script>
var car = "Volvo";
car = undefined;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>
</body>
</html> Các giá trị bỏ trống(Empty Values)
Một giá trị bỏ trống không có gì liên quan với undefined.
Một giá trị trống có cả một giá trị hợp lệ lẫn một kiểu hợp lệ.
ví dụ
var car = ""; // The value is "", the typeof is "string"<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>An empty string has both a legal value and a type:</p>
<p id="demo"></p>
<script>
var car = "";
document.getElementById("demo").innerHTML =
"The value is: " +
car + "<br>" +
"The type is: " + typeof car;
</script>
</body>
</html>
Null
Trong JavaScript null là "không có gì". Nó là giả định cho một thứ không tồn tại.
Nhưng không may, trong JavaScript, kiểu dữ liệu của null là một đối tượng.
Tip: Bạn có thể xem nó là một lỗi trong JavaScript khi typeof null là một đối tượng. Nó nên là null.
Bạn có thể làm trống một đối tượng bằng việc thiết đặt nó thành null:
ví dụ
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = null; // Now value is null, but type is still an object<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>Objects can be emptied by setting the value to <b>null</b>.</p>
<p id="demo"></p>
<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = null;
document.getElementById("demo").innerHTML = typeof person;
</script>
</body>
</html>
Bạn cũng có thể làm trống trải một đối tượng bằng việc thiết đặt nó là undefined:
ví dụ
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = undefined; // Now both value and type is undefined<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>Objects can be emptied by setting the value to <b>undefined</b>.</p>
<p id="demo"></p>
<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = undefined;
document.getElementById("demo").innerHTML = person;
</script>
</body>
</html> Sự khác biệt giữa không xác định và NULL(Difference Between Undefined and Null)
undefined và null là tương đương đối với giá trị nhưng khác đối với kiểu:
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>Undefined and null are equal in value but different in type:</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof undefined + "<br>" +
typeof null + "<br><br>" +
(null === undefined) + "<br>" +
(null == undefined);
</script>
</body>
</html> Dữ liệu nguyên thủy(Primitive Data)
Một dữ liệu nguyên thủy là một giá trị dữ liệu đơn giản với không có thuộc tính bổ sung và các phương thức(methods).
Toán tử typeof có thể trả về một trong các kiểu nguyên thủy sau:
stringnumberbooleanundefined
ví dụ
typeof "John" // Returns "string"
typeof 3.14 // Returns "number"
typeof true // Returns "boolean"
typeof false // Returns "boolean"
typeof x // Returns "undefined" (if x has no value)<!DOCTYPE html>
<html>
<body>
<h2>JavaScript typeof</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof "john" + "<br>" +
typeof 3.14 + "<br>" +
typeof true + "<br>" +
typeof false + "<br>" +
typeof x;
</script>
</body>
</html>
Dữ liệu phức tạp(Complex Data)
Toán tử typeof có thể trả về một hoặc loại kiểu phức tạp:
functionobject
Toán tử typeof trả về "đối tượng" cho các đối tượng, các mảng, và null.
Toán tử typeof không trả về "đối tượng" cho các hàm.
ví dụ
typeof {name:'John', age:34} // Returns "object"
typeof [1,2,3,4] // Returns "object" (not "array", see note below)
typeof null // Returns "object"
typeof function myFunc(){} // Returns "function"<!DOCTYPE html>
<html>
<body>
<h2>JavaScript typeof</h2>
<p>The typeof operator returns object for both objects, arrays, and null.</p>
<p>The typeof operator does not return object for functions.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof {name:'john', age:34} + "<br>" +
typeof [1,2,3,4] + "<br>" +
typeof null + "<br>" +
typeof function myFunc(){};
</script>
</body>
</html>
Tip: Toán tử typeof trả về "object(đối tượng)" cho các mảng bởi vì trong JavaScript các mảng là các đối tượng(objects :D).
Tags:
