Ép kiểu trong JavaScript

Quá trình chuyển đổi từ kiểu dữ liệu này sang kiểu dữ liệu khác được gọi là chuyển đổi kiểu hay ép kiểu. Có hai loại ép kiểu trong JavaScript.

• Ép kiểu ngầm định (Implicit Conversion)
• Ép kiểu tường minh (Explicit Conversion)

Ví dụ: alert sẽ tự động chuyển bất kỳ kiểu dữ liệu nào về string để hiển thị chúng, các toán tử toán học sẽ tự động chuyển về kiểu number để thực hiện tính toán.

Tuy nhiên trong nhiều trường hợp chúng ta muốn chuyển đổi kiểu về kiểu dữ liệu mà chúng ta mong muốn. Trong bài này chúng ta sẽ tìm hiểu về các cách thay đổi kiểu dữ liệu.

---

Ép kiểu ngầm định trong JavaScript

Trong một số tình huống nhất định, JavaScript tự động chuyển đổi từ kiểu dữ liệu này sang kiểu dữ liệu khác (chuyển sang kiểu phù hợp). Đây được gọi là Ép kiểu ngầm định.

Ví dụ 1: Ép kiểu ngầm định thành chuỗi

// numeric string used with + gives string type
let result;

result = '3' + 2; 
console.log(result) // "32"

result = '3' + true; 
console.log(result); // "3true"

result = '3' + undefined; 
console.log(result); // "3undefined"

result = '3' + null; 
console.log(result); // "3null"Code language: JavaScript (javascript)

Lưu ý: Khi một số được thêm vào một chuỗi, JavaScript sẽ chuyển đổi số đó thành một chuỗi trước khi nối.

Ví dụ 2: Ép kiểu ngầm định thành number

// numeric string used with +, - , / , * results number type

let result;

result = '4' - '2'; 
console.log(result); // 2

result = '4' - 2;
console.log(result); // 2

result = '4' * 2;
console.log(result); // 8

result = '4' / 2;
console.log(result); // 2Code language: JavaScript (javascript)

Ví dụ 3: Sử dụng các toán tử +, - , / , * với chuỗi, kết quả sẽ là NaN

// non-numeric string used with +, - , / , * results to NaN

let result;

result = 'hello' - 'world';
console.log(result); // NaN

result = '4' - 'hello';
console.log(result); // NaNCode language: JavaScript (javascript)

Ví dụ 4: Ép kiểu ngầm định Boolean thành number

// if boolean is used, true is 1, false is 0

let result;

result = '4' - true;
console.log(result); // 3

result = 4 + true;
console.log(result); // 5

result = 4 + false;
console.log(result); // 4Code language: JavaScript (javascript)

Lưu ý: JavaScript coi 0 là false và tất cả các số khác 0 là true. Và nếu true được chuyển đổi thành một số, kết quả luôn là 1.

Ví dụ 5: Ép kiểu ngầm định null thành number

// null is 0 when used with number
let result;

result = 4 + null;
console.log(result);  // 4

result = 4 - null;
console.log(result);  // 4Code language: JavaScript (javascript)

Ví dụ 6: Undefined kết hợp với number, boolean và null

// Arithmetic operation of undefined with number, boolean and null gives NaN

let result;

result = 4 + undefined;
console.log(result);  // NaN

result = 4 - undefined;
console.log(result);  // NaN

result = true + undefined;
console.log(result);  // NaN

result = null + undefined;
console.log(result);  // NaNCode language: JavaScript (javascript)

---

Ép kiểu tường minh trong JavaScript

Bạn cũng có thể chuyển đổi từ kiểu dữ liệu này sang kiểu dữ liệu khác theo ý muốn của mình. Chuyển đổi kiểu dữ liệu mà bạn thực hiện theo cách thủ công được gọi là Ép kiểu tường minh.

Trong JavaScript, các ép kiểu tường minh được thực hiện bằng cách sử dụng các phương thức có sẵn.

Dưới đây là các ép kiểu tường minh thường được sử dụng:

1. Ép kiểu tường minh thành number

Để ép kiểu chuỗi và boolean thành number, bạn có thể sử dụng Number(). Ví dụ:

let result;

// string to number
result = Number('324');
console.log(result); // 324

result = Number('324e-1')  
console.log(result); // 32.4

// boolean to number
result = Number(true);
console.log(result); // 1

result = Number(false);
console.log(result); // 0Code language: JavaScript (javascript)

Trong JavaScript, chuỗi rỗng và giá trị null trả về 0. Ví dụ:

let result;
result = Number(null);
console.log(result);  // 0

let result = Number(' ')
console.log(result);  // 0Code language: JavaScript (javascript)

Nếu một chuỗi là một số không hợp lệ, kết quả sẽ là NaN. Ví dụ:

let result;
result = Number('hello');
console.log(result); // NaN

result = Number(undefined);
console.log(result); // NaN

result = Number(NaN);
console.log(result); // NaNCode language: JavaScript (javascript)

Lưu ý: Bạn cũng có thể tạo các số từ các chuỗi bằng cách sử dụng parseInt(), parseFloat(), toán tử một ngôi + và Math.floor(). Ví dụ:

let result;
result = parseInt('20.01');
console.log(result); // 20

result = parseFloat('20.01');
console.log(result); // 20.01

result = +'20.01';
console.log(result); // 20.01

result = Math.floor('20.01');
console.log(result); // 20Code language: JavaScript (javascript)

2. Ép kiểu tường minh thành chuỗi

Để chuyển đổi các kiểu dữ liệu khác thành chuỗi, bạn có thể sử dụng String() hoặc toString(). Ví dụ:

//number to string
let result;
result = String(324);
console.log(result);  // "324"

result = String(2 + 4);
console.log(result); // "6"

//other data types to string
result = String(null);
console.log(result); // "null"

result = String(undefined);
console.log(result); // "undefined"

result = String(NaN);
console.log(result); // "NaN"

result = String(true);
console.log(result); // "true"

result = String(false);
console.log(result); // "false"

// using toString()
result = (324).toString();
console.log(result); // "324"

result = true.toString();
console.log(result); // "true"Code language: JavaScript (javascript)

3. Ép kiểu tường minh thành Boolean

Để chuyển đổi các kiểu dữ liệu khác thành boolean, bạn có thể sử dụng Boolean().

Trong JavaScript, undefined, null, 0, NaN, ' ' sẽ chuyển thành false. Ví dụ:

let result;
result = Boolean('');
console.log(result); // false

result = Boolean(0);
console.log(result); // false

result = Boolean(undefined);
console.log(result); // false

result = Boolean(null);
console.log(result); // false

result = Boolean(NaN);
console.log(result); // falseCode language: JavaScript (javascript)

Còn những giá trị khác sẽ cho kết quả là true. Ví dụ:

result = Boolean(324);
console.log(result); // true

result = Boolean('hello');
console.log(result); // true

result = Boolean(' ');
console.log(result); // trueCode language: JavaScript (javascript)

---

Bảng ép kiểu trong JavaScript

Dưới đây là bảng hiển thị việc chuyển đổi các giá trị khác nhau thành Chuỗi, Số và Boolean trong JavaScript.

Giá trị	Ép kiểu thành chuỗi	Ép kiểu thành số	Ép kiểu thành Boolean
1	“1”	1	true
0	“0”	0	false
“1”	“1”	1	true
“0”	“0”	0	true
“ten”	“ten”	NaN	true
true	“true”	1	true
false	“false”	0	false
null	“null”	0	false
undefined	“undefined”	NaN	false
”	“”	0	false
‘ ‘	” “	0	true

Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.

---

Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.