Trong JavaScript, việc chuyển đổi một giá trị từ kiểu dữ liệu khác (thường là chuỗi) sang kiểu số là một tác vụ phổ biến. Tuy nhiên, ba phương thức Number(), parseInt() và parseFloat() có cơ chế hoạt động và kết quả trả về khác nhau tùy thuộc vào dữ liệu đầu vào.
1. Phương thức Number()
Number() là một hàm chuyển đổi kiểu dữ liệu (type conversion) có tính chất nghiêm ngặt nhất. Nó cố gắng chuyển đổi toàn bộ giá trị đầu vào thành một con số.
Quy tắc chuyển đổi:
- Boolean:
truechuyển thành 1,falsechuyển thành 0. - Null: Chuyển thành 0.
- Undefined: Chuyển thành
NaN. - Chuỗi ký tự:
- Nếu chuỗi chỉ chứa số (có thể có dấu âm/dương), trả về số thập phân tương ứng.
- Nếu chuỗi là định dạng Hexadecimal (ví dụ: "0xf"), trả về giá trị thập phân.
- Nếu chuỗi rỗng hoặc chỉ có khoảng trắng, trả về 0.
- Nếu chuỗi chứa bất kỳ ký tự không hợp lệ nào (ngoài các quy tắc trên), trả về
NaN.
const inputA = "42";
const inputB = " 100 ";
const inputC = "3.14.15";
const inputD = "";
console.log(Number(inputA)); // 42
console.log(Number(inputB)); // 100 (tự động loại bỏ khoảng trắng hai đầu)
console.log(Number(inputC)); // NaN (do có hai dấu chấm)
console.log(Number(inputD)); // 0
console.log(Number(true)); // 1
2. Hàm parseInt()
parseInt() được sử dụng để trích xuất một số nguyên từ một chuỗi. Khác với Number(), hàm này sẽ phân tích chuỗi từ trái sang phải cho đến khi gặp ký tự không hợp lệ.
Đặc điểm chính:
- Bỏ qua khoảng trắng ở đầu chuỗi.
- Nếu ký tự đầu tiên không phải là số hoặc dấu (+/-), hàm sẽ trả về
NaNngay lập tức. - Nếu gặp một ký tự không phải là số trong quá trình phân tích, nó sẽ dừng lại và trả về phần số đã thu thập được trước đó.
- Hỗ trợ tham số thứ hai (radix) để xác định hệ cơ số (từ 2 đến 36).
const text1 = "10.5 pixels";
const text2 = "ABC123";
const text3 = "1010";
console.log(parseInt(text1)); // 10 (dừng lại tại dấu chấm)
console.log(parseInt(text2)); // NaN (ký tự đầu tiên không phải số)
console.log(parseInt(text3, 2)); // 10 (chuyển từ hệ nhị phân sang thập phân)
console.log(parseInt("0x10")); // 16 (tự động nhận diện hệ 16)
3. Hàm parseFloat()
parseFloat() tương tự như parseInt() nhưng được thiết kế để xử lý các số thập phân (số thực dấu phẩy động).
Quy tắc hoạt động:
- Chỉ phân tích chuỗi ở hệ thập phân, không hỗ trợ tham số cơ số (radix).
- Chấp nhận dấu chấm thập phân đầu tiên gặp phải. Dấu chấm thứ hai sẽ khiến hàm dừng phân tích.
- Có thể xử lý các số ở định dạng khoa học (ví dụ: 10e2).
- Nếu chuỗi bắt đầu bằng "0x", nó sẽ trả về 0 vì không hiểu hệ thập lục phân.
const data1 = "3.14.15";
const data2 = "1.5e2";
const data3 = " 007.5 ";
console.log(parseFloat(data1)); // 3.14 (dừng ở dấu chấm thứ hai)
console.log(parseFloat(data2)); // 150 (hiểu ký tự e)
console.log(parseFloat(data3)); // 7.5 (bỏ qua số 0 và khoảng trắng ở đầu)
console.log(parseFloat("40 years")); // 40
So sánh sự khác biệt chính
| Tiêu chí | Number() | parseInt() | parseFloat() |
|---|---|---|---|
| Tính nghiêm ngặt | Rất cao (toàn bộ chuỗi phải là số) | Thấp (trích xuất phần đầu) | Thấp (trích xuất phần đầu) |
| Chuỗi rỗng | Trả về 0 | Trả về NaN | Trả về NaN |
| Số thập phân | Giữ nguyên | Làm tròn xuống (cắt bỏ phần thập phân) | Giữ nguyên |
| Hệ cơ số (Radix) | Không hỗ trợ | Có hỗ trợ | Không hỗ trợ |