post-image

Ép kiểu trong JavaScript

Biến, kiểu dữ liệu và toán tử

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"

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); // 2

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); // NaN

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); // 4

Lưu ý: JavaScript coi 0false và tất cả các số khác 0true. 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);  // 4

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

// 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);  // NaN

É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ỗiboolean 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); // 0

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);  // 0

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); // NaN

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); // 20

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"

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); // false

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); // true

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ố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”1true
0“0”0false
“1”“1”1true
“0”“0”0true
“ten”“ten”NaNtrue
true“true”1true
false“false”0false
null“null”0false
undefined“undefined”NaNfalse
“”0false
‘ ‘” “0true

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.

Trở thành lập trình viên từ con số 0
Tags:
,

Leave a Reply

Your email address will not be published. Required fields are marked *