Ép kiểu string sang int 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.

Ép kiểu string sang int trong 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

Cùng một tác giả

Ép kiểu string sang int trong javascript

36 13

Trước khi vào nội dung bài viết. Tôi xin đính chính giúp anh trả lời những câu hỏi chỉ là tựa đề của một bài hát tôi không có ý xưng hô là anh. Bài...

36 13

Ép kiểu string sang int trong javascript

17 6

Có thể bạn thừa biết, JavaScript là một ngôn ngữ chạy (Link). Điều đó có nghĩa là nếu bạn thực hiện một tác vụ quá lớn trên giao diện chính thì khả...

17 6

Ép kiểu string sang int trong javascript

16 4

Xin chào bạn Có thể bạn đã biết, JavaScript là một ngôn ngữ lập trình rất mạnh, nhưng lại vô cùng rắc rối, phức tạp. Để có thể nắm vững được Java...

16 4

Bài viết liên quan

Ép kiểu string sang int trong javascript

69 8

Tăng sức mạnh cho javascript với lodash Lần này mình sẽ giới thiệu 1 thư viện javascript vô cùng bá đạo có tên là "lodash]1]", có thể nói nó là LI...

69 8

Ép kiểu string sang int trong javascript

10 1

_Có mấy chia sẻ nhỏ, mình muốn đưa ra để mọi người cùng thảo luận góp ý. Thread này không tập trung vào Technical nữa mà discuss về Coding Style &a...

10 1