Làm sao để convert String sang Number trong JavaScript?

JavaScript cung cấp nhiều cách khác nhau để convert String sang Number. Và trong bài viết này, mình sẽ tổng hợp lại một số cách mà mình đã biết.

Sử dụng Number() function

Đúng vậy, đó là Number() function chứ không phải Number() constructor.

Vì Number() constructor (là khi bạn sử dụng với từ khoá new) sẽ tạo mới một Number Object với rất nhiều thứ kèm theo. Còn Number() function sẽ tạo ra một số thông thường (primitive).

const x = new Number("6666");
console.log(x); // => Number {6666}

const y = Number("6666");
console.log(y); // => 6666

Một số ví dụ khác:

const x = Number('66,66');
console.log(x); // => NaN

const y = Number('66.66');
console.log(y); // => 66.66

const z = Number('66666');
console.log(z); // => 66666

Qua ví dụ trên, bạn thấy rằng: nếu String truyền vào không phải Number thì kết quả thu được là NaN; nếu tham số truyền vào không phải số nguyên thì kết quả không bị làm tròn.

Sử dụng parseInt() và parseFloat()

Phương thức parseInt()

Phương thức parseInt() là một giải pháp thường hay được sử dụng. Phương thức này sẽ parse String tuỳ theo hệ cơ số xác định. Vì vậy, mình đã thường xuyên sử dụng cách này để convert String sang Number trong JavaScript.

Ví dụ:

const x = parseInt('1000.12', 10);
console.log(x); // => 1000

const y = parseInt('1000', 16);
console.log(y); // => 4096

const z = parseInt('1000', 8);
console.log(z); // => 512

const t = parseInt('1000', 2);
console.log(t); // => 8 

Với giá trị của hệ cơ số hợp lệ là từ 2 đến 36. Trong trường hợp bạn không truyền giá trị của hệ cơ số vào thì JavaScript sẽ tự parse theo nguyên tắc:

• String bắt đầu bằng "0x" hoặc "0X" => hệ cơ số 16 (hexadecimal)
• String bắt đầu bằng "0" => hệ cơ số 8 (octal) hoặc 10 (decimal) tuỳ thuộc vào trình duyệt
• String bắt đầu bằng các số khác thì => hệ cơ số 10 (decimal)
• String bắt đầu không phải là số => NaN

Ví dụ:

const x = parseInt('1000.12');
console.log(x); // => 1000

const y = parseInt('0x1000');
console.log(y); // => 4096

const z = parseInt('01000');
console.log(z); // => 1000

const t = parseInt('b1000');
console.log(t); // => NaN

Kết quả có vẻ hơi khó đoán nhỉ?

Theo mình, tốt nhất là luôn truyền vào giá trị của hệ cơ số muốn parse để luôn thu được giá trị như mong muốn.

Phương thức parseFloat()

Nếu như phương thức parseInt() luôn trả về kết quả là một số nguyên thì phương thức parseFloat() sẽ trả về kết quả là một số float.

Ví dụ:

const x = parseFloat('1000,12', 10);
console.log(x); // => 1000

const y = parseFloat('1000.12', 10);
console.log(y); // => 1000.12

const z = parseFloat('1000.120', 10);
console.log(z); // => 1000.12

const t = parseFloat('1000', 10);
console.log(t); // => 1000

Sử dụng toán tử +

Ví dụ:

const x = +'1000,12';
console.log(x); // => NaN

const y = +'1000.12';
console.log(y); // => 1000.12

const z = +'1000.120';
console.log(z); // => 1000.12

const t = +'1000';
console.log(t); // => 1000

Sử dụng Math.floor()

Phương thức Math.floor() khá giống với phương thức parseInt() phía trên.

Ví dụ:

const x = Math.floor('1000.12');
console.log(x); // => 1000

const y = Math.floor('0x1000');
console.log(y); // => 4096

const z = Math.floor('01000');
console.log(z); // => 1000

const t = Math.floor('b1000');
console.log(t); // => NaN

Sử dụng toán tử *

Ví dụ:

const x = '1000,12' * 1;
console.log(x); // => NaN

const y = '1000.12' * 1;
console.log(y); // => 1000.12

const z = '1000.120' * 1;
console.log(z); // => 1000.12

const t = '1000' * 1;
console.log(t); // => 1000

Sử dụng toán tử /

Ví dụ:

const x = '1000,12' / 1;
console.log(x); // => NaN

const y = '1000.12' / 1;
console.log(y); // => 1000.12

const z = '1000.120' / 1;
console.log(z); // => 1000.12

const t = '1000' / 1;
console.log(t); // => 1000

Sử dụng toán tử -

Ví dụ:

const x = '1000,12' - 0;
console.log(x); // => NaN

const y = '1000.12' - 0;
console.log(y); // => 1000.12

const z = '1000.120' - 0;
console.log(z); // => 1000.12

const t = '1000' - 0;
console.log(t); // => 1000

Sử dụng Bitwise not ~~

Ví dụ:

const x = ~~'1000,12';
console.log(x); // => 0

const y = ~~'1000.12';
console.log(y); // => 1000

const z = ~~'1000.120';
console.log(z); // => 1000

const t = ~~'1000';
console.log(t); // => 1000

Sử dụng toán tử dịch >>>

Ví dụ:

const x = '1000,12' >>> 0;
console.log(x); // => 0

const y = '1000.12' >>> 0;
console.log(y); // => 1000

const z = '1000.120' >>> 0;
console.log(z); // => 1000

const t = '1000' >>> 0;
console.log(t); // => 1000

Lời kết

Trên đây là một số cách để convert String sang Number trong JavaScript. Để so sánh tốc độ giữa các cách này, bạn có thể tham khảo và viết thêm testcase để so sánh tại Convert a string to a number using JavaScript.

Ngoài ra, bạn thường hay sử dụng cách nào để convert String sang Number trong JavaScript? Mình hy vọng được biết thêm nhiều cách khác nữa của bạn trong phần bình luận phía dưới!

Xin chào và hẹn gặp lại, thân ái!

★ Nếu bạn thấy bài viết này hay thì hãy ghé thăm Blog hoặc theo dõi mình trên Facebook để nhận được thông báo khi có bài viết mới nhất nhé:

☛ Blog: Complete JavaScript
☛ Facebook Fanpage: Complete JavaScript
☛ Facebook Group: Hỏi đáp JavaScript VN