Tôi không có tài năng gì cả. Tôi chỉ đam mê hiểu biết
Các Phương Thức Number Javascript

Các Phương Thức Number Javascript


Ngày 2 Tháng 2 Năm 2021

Hôm nay bạn hãy cùng mình đi vào tìm hiểu khái niệm cũng như các phương thức sử dụng với số trong ngôn ngữ lập trình Javascript để phát triển web nhé.

Bạn nên tham khảo lại về định nghĩa kiểu dữ liệu số và các thuộc tính của nó trước khi ta đi vào tìm hiểu các phương thức được sử dụng cho kiểu dữ liệu này nhé. Đường dẫn tham khảo: Kiểu dữ liệu số.

Phương Thức toFixed() Number Javascript

Phương thức toFixed() thường được áp dụng đối với các số thập phân. Nó giúp chúng ta xác định bao nhiêu số đằng sau dấu thập phân(.) sẽ được hiển thị và kết quả trả về là một số với kiểu dữ liệu là chuỗi . Để hiểu rõ hơn bạn xem cú pháp của nó sau đây nhé:

 (Số).toFixed(Số lượng number mà ta muốn hiển thị);

Bây giờ chúng ta sẽ đi vào ví dụ thực tế để hiểu về cách sử dụng nó nhé:

Đoạn Code:

 let tongGia = 0.56894;
let tongGiaChuyenDoi = tongGia.toFixed(2);

console.log(tongGiaChuyenDoi);
console.log(typeof tongGiaChuyenDoi);

Kết Quả:

Phương thức toFixed() trong javascript

Tại sao kết quả là 0.57 chứ không phải 0.56 ?

Thì ở đây mình xin giải thích là khi ta chọn 2 chữ số sau dấu thập phân thì phương thức này sẽ xem xét giá trị của chữ số thứ 3 sau dấu thập phân nếu:

  • Nếu nó >= 5 : thì số trước nó tăng lên một đơn vị.
  • Nếu nó < 5 : thì số trước nó giữ nguyên giá trị.
Do đó số 8 > 5 nên kết quả sẽ là 0.57.

Để hiểu nhiều hơn chúng ta hãy xem ví dụ với các số khác nhau trong phương thức toFixed() ở đoạn code dưới đây nhé:

Đoạn Code:

 let soThapPhan = 124.654;

console.log(soThapPhan.toFixed(0));
console.log(soThapPhan.toFixed(1));
console.log(soThapPhan.toFixed(2));
console.log(soThapPhan.toFixed(8));

Kết Quả:

Các ví dụ về toFixed() trong javascript

Phương Thức toPrecision() Number Javascript

Phương thức này có cách hoạt động khá giống với phương thức toFixed() , điểm khác biệt chú ý ở đây là nó cho phép chúng ta xác định chiều dài của số chứ không phải là xác định bao nhiêu số đằng sau dấu thập phân. Trước khi đi vào so sánh thì bạn xem cú pháp của nó trước nhé:

(Số).toPrecision(Chiều dài của số);

Bây giờ ta sẽ đi vào ví dụ cụ thể so sánh hai phương thức trên nhé:

Đoạn Code:

 let soTong = 2.548;

console.log(soTong.toPrecision(2));
console.log(soTong.toFixed(2));

Kết Quả:

Phương Thức toPrecision() trong javascript

Với tham số chiều dài(length) trong phương thức toPrecision thì bạn chỉ sử dụng được từ 1 đến 100 thôi nhé.

Tiếp theo chúng ta sẽ đi vào ví dụ cụ thể khi sử dụng phương thức toPrecision() với nhiều chiều dài khác nhau ở đoạn code sau nhé:

Đoạn Code:

 let soThapPhan = 124.654;

console.log(soThapPhan.toPrecision(3));
console.log(soThapPhan.toPrecision(4));
console.log(soThapPhan.toPrecision(8));
console.log(soThapPhan.toPrecision(0));/* Sẽ xảy ra lỗi*/

Kết Quả:

Các ví dụ về toPrecision() trong javascript

Phương Thức parseInt() Number Javascript

Phương thức parseInt() giúp chúng ta chuyển các kiểu dữ liệu khác (chuỗi, boolean...) sang kiểu số nguyên. Để hiểu rõ hơn bạn xem cú pháp sau nhé:

 parseInt(Kiểu dữ liệu ta muốn chuyển sang số nguyên);

Bây giờ chúng ta đi vào ví dụ để hiểu hơn nhé:

Đoạn Code:

 console.log(parseInt("20"));
console.log(parseInt("20.68"));

Kết Quả:

Phương thức parseInt() trong javascript

Nếu như ta có chuỗi là "20 học sinh""học sinh thứ 20" thì bạn nghĩ phương thức này có thể chuyển sang kiểu số được không?

Để trả lời câu hỏi trên chúng ta thử đi vào ví dụ với hai chuỗi trên để xem sao nhé:

Đoạn Code:

 console.log(parseInt("20 học sinh"));
console.log(parseInt("học sinh thứ 20"));

Kết Quả:

Chuyển chuỗi sang số bằng phương thức parseInt() trong javascript

Vậy chúng ta có thể rút ra kết luận là đối với chuỗi có số đầu tiên thì phương thức này có thể chuyển sang kiểu number và bỏ các ký tự chữ còn lại. Còn nếu chuỗi có chữ đầu tiên thì nó sẽ trả về kiểu dữ liệu NaN(Not a Number).

Phương Thức parseFloat() Number Javascript

Phương thức parseFloat() giúp chúng ta chuyển các kiểu dữ liệu khác (chuỗi, boolean...) sang kiểu số số thập phân. Để hiểu rõ hơn bạn xem cú pháp sau nhé:

 parseFloat(Kiểu dữ liệu ta muốn chuyển sang số thập phân);

Bây giờ để hiểu rõ hơn bạn cùng mình xem ví dụ sau đây nhé:

Đoạn Code:

 console.log(parseFloat("12.65"));
console.log(parseFloat("1.5rem"));
console.log(parseFloat("1.2.6"));

Kết Quả:

Phương thức parseFloat() trong javascript

Những Cách Viết Khác Number(Số) Trong Javascript

Ví dụ khi bạn ghi một số có chiều dài quá lớn như đơn vị triệu, đơn vị tỷ thì việc thường nhập sai là điều khó tránh khỏi. Vị dụ như sau đây:

 let haiTy = 2000000000;

Trong Javascript có cho phép chúng ta sử dụng chữ e để xác định có bao nhiều số 0 được hiển thị trong number. Để hiểu rõ hơn bạn xem đoạn code sau nhé:

Đoạn Code:

 let haiTy = 2000000000;
console.log(haiTy);

let haiTyChuyenDoi = 2e9;
console.log(haiTyChuyenDoi);

Kết Quả:

Sử dụng e trong số javascript

Ở đây mình sẽ giải thích một tý về cách hoạt động của chữ e trong kiểu dữ liệu số ở dưới đây nhé:

 2e9 = 2 * 1000000000; 
1e3 = 1 * 1000;

Sử Dụng Math Method Với Number Javascript

Đầu tiên là mình muốn giới thiệu đến các bạn ba phương thức Math giúp chúng ta có thể dễ dàng làm tròn số là:

Math.floorMath.ceilMath.round
Ý NghĩaLàm tròn số xuống.Làm tròn số lên.Làm tròn tới số gấn nhất.
Cú PhápMath.floor(Số)Math.ceil(Số)Math.round(Số)

Bây giờ để hiểu rõ hơn chúng ta đi vào ví dụ cụ thể sau nhé:

Đoạn Code:

 let so1 = 4.1;
let so2 = 4.6;

console.log(`Sử dụng Math.floor với số ${so1} : ` + Math.floor(so1));
console.log(`Sử dụng Math.floor với số ${so2} : ` + Math.floor(so2));

console.log(`Sử dụng Math.ceil với số ${so1} : ` + Math.ceil(so1));
console.log(`Sử dụng Math.ceil với số ${so2} : ` + Math.ceil(so2));

console.log(`Sử dụng Math.round với số ${so1} : ` + Math.round(so1));
console.log(`Sử dụng Math.round với số ${so2} : ` + Math.round(so2));

Kết Quả:

Sử dụng Math() trong số javascript

Tùy vào trường hợp thực tế mà bạn lựa chọn phương thức làm tròn số cho hợp lý nhé.

Sử Dụng Math.random():

Tạo một số ngẫu nhiên từ 0 đến 1 (không có số 1 nhé). Bây giờ để hiểu rõ hơn bạn xem đoạn cod sau nhé:

Đoạn Code:

 console.log(Math.random());
console.log(Math.random());

Kết Quả:

Sử dụng Math.random() trong số javascript

Sử Dụng Math.max() và Math.min():

Giúp chúng ta trả về giá trị lơn nhất hay nhỏ nhất với các số đã cho. Để hiểu rõ hơn bạn xem cú pháp sau nhé:

 Math.max(Số 1, Số 2, Số 3... Số n)
Math.min(Số 1, Số 2, Số 3... Số n)

Bây giờ để hiểu rõ hơn chúng ta cùng di vào ví dụ sau nhé:

Đoạn Code:

 let soLonNhat = Math.max(20, 50, 44, 60, 90, 80);
let soNhoNhat = Math.min(20, 50, 44, 60, 90, 80);

console.log(`Số lớn nhất là : ${soLonNhat}`)
console.log(`Số nhỏ nhất là : ${soNhoNhat}`)

Kết Quả:

Sử dụng Math.min() và Math.max() trong số javascript

Chuyển Đổi Number Sang String Trong Javascript

Thông thường chúng ta sẽ sử dụng phương pháp toString() để chuyển đổi kiểu dữ liệu từ số sang chuỗi. Nhưng trong phần này mình muốn giới thiệu thêm về phương thức toString khi sử dụng với tham số. Để hiểu rõ hơn bạn xem cú pháp sau nhé:

 (Number).toString(Tham Số);

Với tham số ở đây nằm trong khoảng từ 2 đến 36 và thông thường chúng ta sẽ sử dụng các tham số dưới đây để sử dụng trong hệ thống số là:

  • Phương thức toString() nếu không có tham số thì sẽ mặc định là 10.
  • tham số = 2 thì được dùng để hiển thị số dưới dạng nhị phân(Chỉ bao gồm số 0 và số 1).
  • tham số = 8 được dùng để hiển thị số bát phân.
  • tham số = 16 được dùng để hiển thị hex color, mã hóa ký tự...
  • tham số = 32 được dùng để hiển thị số thông qua các chữ cái latin.

Nếu thấy khó hiểu cũng không sao nha vì mình viết thêm phần này để giúp bạn tham khảo chứ đối với lập trình web bình thường cũng ít khi sử dụng tới nha. Bây giờ chúng ta cùng nhau đi vào tìm hiểu ví dụ thực tế sau đây nhé:

Đoạn Code:

 let num = 140;
console.log(num.toString(2));
console.log(num.toString(8));
console.log(num.toString(16));
console.log(num.toString(32));
console.log(num.toString(10));//Sử dụng mặc định

Kết Quả:

Sử dụng tham số với toString() trong số javascript

Tổng kết:

Qua đây mình mong bài viết sẽ giúp bạn hiểu được cách sử dụng các phương thức đối với số trong ngôn ngữ Javascript và nếu có thắc mắc gì cứ gửi email mình sẽ phản hồi sớm nhất có thể. Rất mong bạn tiếp tục ủng hộ trang web để mình có thể viết nhiều bài hay hơn nữa nhé. Chúc bạn có một ngày vui vẻ!