IMG-LOGO
×

Tài Liệu Học

Khoá học lập trình Javascript

Khai báo biến & hàm mặc định trong Javascript

[Video] Tạo dự án JS đầu tiên - Lập Trình JS [Video] Khai báo biến - toán tử - Lập Trình JavaScript [Video] Các hàm sẵn có trong js - Khoá Học Lập Trình JS

Mệnh đề điều kiện

[Video] Cấu trúc điều kiện if else switch - Lập trình Javascript

Vòng lặp for, while, do..while

[Video] Tìm hiểu vòng lặp for, while, do .. while trong Javascript

Array & Function & Object

[Video] Tìm hiểu Function trong Javascript [Video] Tìm hiểu Array trong Javascript [Video] Khai báo Object trong Javascript [Video] Gửi giữ liệu qua các trang html bằng javascript - HTML/CSS [Video] Bài tập - ôn tập mảng - quản lý sinh viên - Lập trình Javascript [Video] Khai báo function trong Object - Lập trình Javascript [Video] Tìm hiểu function trong string - Lập trình Javascript

Xử lý sự kiện & thao tác thẻ HTML

[Video] Event - Lập Trình JS [Video] Tương tác lên tags trong HTML bằng JS [Video] Thêm tags vào tags khác bằng javascript + ví du thêm sinh viên - lập trình JS [Video] Tương tác thẻ HTML bằng Javascript qua ví dụ đặt đơn hàng (Order Entry Form) [Video] Bài tập - Quản lý sản phẩm bằng javascript - lập trình javascript [Video] Quản lý sinh viên - Lập trình Javascript

Lưu trữ Javascript

[Video] Cookie - khoá học lập trình JavaScript [Video] Localstorage - Khoá học lập trình JavaScript [Video] Lưu trữ thông tin sinh viên bằng LocalStorage - Lập trình Javascript

Examination & Ôn Tập Tổng Quát

1000 Bài tập JavaScript - Lập Trình JavaScript




Trang Chủ Học JS JavaScript Data Types - Các kiểu dữ liệu trong JavaScript

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

by GokiSoft.Com - 09:46 20/05/2020 2,191 Lượt Xem

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"};    // Object



Khá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>
</html


Kết quả:

20Volvo


JavaScript:

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ả:

Volvo164


Trong 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:

  • string
  • number
  • boolean
  • undefined

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:

  • function
  • object

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).


Bình luận



Chia sẻ từ lớp học

Phân Loại Bài Viết

Tài Liệu Tham Khảo

Đã sao chép!!!