Công Cụ Chuyển Đổi String sang Number Online

Tại sao việc chuyển đổi String sang Number lại quan trọng?

Chuỗi là định dạng văn bản. Số là định dạng toán học. Khi bạn cần thao tác toán học với dữ liệu văn bản, việc chuyển đổi là bắt buộc. Tuy nhiên, quá trình này không hề đơn giản bởi các vấn đề sau:

• Dữ liệu không thuần số: Chuỗi có thể chứa khoảng trắng, ký tự đặc biệt, đơn vị đo lường (ví dụ: `42.5em`), hoặc các ký tự không phải số hoàn toàn.
• Hành vi đa dạng của phương thức: Mỗi phương thức chuyển đổi có quy tắc riêng trong việc xử lý chuỗi không hợp lệ, có thể trả về `NaN` (Not a Number), hoặc chỉ lấy phần số ở đầu chuỗi.
• Hiệu suất và mục đích: Một số phương thức phù hợp cho số nguyên, một số cho số thực, và một số khác linh hoạt hơn nhưng có thể chậm hơn.

Việc hiểu rõ từng phương thức giúp bạn chọn đúng công cụ cho đúng nhiệm vụ, tránh các lỗi logic khó chịu trong ứng dụng.

Hướng dẫn sử dụng công cụ chuyển đổi String sang Number

Để kiểm tra cách JavaScript chuyển đổi chuỗi của bạn sang kiểu Number, hãy thực hiện theo các bước sau:

• Bước 1: Nhập chuỗi bất kỳ: Gõ hoặc dán chuỗi ký tự mà bạn muốn chuyển đổi vào khung "Nhập chuỗi cần chuyển đổi sang số". Hãy thử nghiệm với nhiều loại chuỗi khác nhau như:
  • "123", " 456.78 " (có khoảng trắng)
  • "-789" (số âm)
  • "123.45" (số thập phân)
  • "abc100", "100abc", "42.5em" (chuỗi có ký tự không phải số)
  • "0", "" (chuỗi rỗng)
  • "null", "true", "false" (giá trị boolean/null)
• Bước 2: Xem kết quả tức thì: Công cụ sẽ tự động phân tích và hiển thị kết quả chuyển đổi cho từng phương thức JavaScript ở các khung kết quả bên dưới.
• Bước 3: Hiểu hành vi của từng phương thức: Đọc phần giải thích bên dưới để hiểu tại sao mỗi phương thức lại trả về kết quả đó, đặc biệt với các chuỗi không hợp lệ.
• Bước 4: Sao chép kết quả: Sử dụng nút "Copy" bên cạnh mỗi kết quả để lưu giá trị vào bộ nhớ tạm.

Các phương thức chuyển đổi String sang Number trong JavaScript

1. Hàm Number(value):

• Mô tả: Đây là hàm tạo đối tượng Number, nhưng khi gọi không dùng new, nó hoạt động như một hàm ép kiểu, chuyển đổi giá trị sang kiểu Number.
• Hành vi: Rất nghiêm ngặt.
  • Nếu chuỗi là một số hợp lệ (có thể có khoảng trắng ở đầu/cuối), nó chuyển đổi thành số.
  • Nếu chuỗi rỗng, nó trả về 0.
  • Nếu chuỗi chứa bất kỳ ký tự không phải số nào (trừ khoảng trắng ở đầu/cuối), nó trả về NaN.
• Ví dụ: `Number("123")` → `123`; `Number("123abc")` → `NaN`; `Number("")` → `0`.

2. Hàm parseFloat(string):

• Mô tả: Phân tích một chuỗi và trả về một số thực dấu phẩy động.
• Hành vi:
  • Nó bắt đầu parse từ ký tự đầu tiên và dừng lại khi gặp ký tự không phải số **đầu tiên** mà nó không thể chuyển đổi thành một phần của số.
  • Nếu ký tự đầu tiên không thể chuyển thành số, nó trả về NaN.
  • Nó bỏ qua khoảng trắng ở đầu chuỗi.
• Ví dụ: `parseFloat("123.45abc")` → `123.45`; `parseFloat("abc123")` → `NaN`; `parseFloat("42.5em")` → `42.5`.

3. Hàm parseInt(string, radix) (với `radix = 10`):

• Mô tả: Phân tích một chuỗi và trả về một số nguyên.
• Hành vi:
  • Tương tự như `parseFloat()`, nó dừng parse khi gặp ký tự không phải số **đầu tiên** mà nó không thể chuyển thành một chữ số nguyên.
  • Nếu ký tự đầu tiên không thể chuyển thành số, nó trả về NaN.
  • Tham số `radix` (cơ số) là cực kỳ quan trọng (thường là 10 cho hệ thập phân). Nếu không chỉ định, có thể parse nhầm `0x` thành hệ thập lục phân.
• Ví dụ: `parseInt("123.45abc", 10)` → `123`; `parseInt("abc123", 10)` → `NaN`; `parseInt("0xFF", 10)` → `0`.

4. Toán tử Unary Plus (+value):

• Mô tả: Một toán tử một ngôi. Nó cố gắng chuyển đổi toán hạng của nó thành một số.
• Hành vi:
  • Hoạt động tương tự như hàm Number(), nhưng cú pháp ngắn gọn hơn.
  • Nếu chuỗi là một số hợp lệ, nó chuyển đổi thành số.
  • Nếu chuỗi rỗng, nó trả về 0.
  • Nếu chuỗi chứa ký tự không phải số, nó trả về NaN.
• Ví dụ: `+"123"` → `123`; `+"123abc"` → `NaN`; `+""` → `0`.

Ứng dụng thực tế và cách xử lý lỗi trong JavaScript

Việc chuyển đổi chuỗi sang số là cốt lõi trong các tình huống:

• Xử lý đầu vào form: Dữ liệu từ input HTML luôn là chuỗi.
• Đọc giá trị từ CSS: Ví dụ: lấy giá trị `width: "100px"` để tính toán.
• API Responses: Giá trị số trong JSON có thể là chuỗi.

Để xử lý lỗi một cách an toàn, bạn nên luôn kiểm tra kết quả chuyển đổi bằng hàm isNaN() trước khi sử dụng. Hoặc sử dụng các cấu trúc `try-catch` nếu ngôn ngữ hỗ trợ.

Chọn phương thức phù hợp với mục đích:

• Sử dụng parseInt() hoặc parseFloat() khi bạn muốn trích xuất số từ đầu chuỗi (ví dụ: "100px" thành 100).
• Sử dụng Number() hoặc Unary Plus khi bạn muốn chuỗi đó phải là một số hợp lệ hoàn toàn.

Các công cụ chuyển đổi kiểu dữ liệu liên quan khác