Thứ năm, 20/07/2017 | 00:00 GMT+7

Làm thế nào để làm toán trong JavaScript với các toán tử

Các phép toán là một trong những tính năng cơ bản và phổ biến nhất của bất kỳ ngôn ngữ lập trình nào. Trong JavaScript, các con số được sử dụng thường xuyên cho các việc phổ biến như tìm kích thước kích thước cửa sổ trình duyệt, nhận giá cuối cùng của giao dịch tiền tệ và tính toán khoảng cách giữa các phần tử trong tài liệu trang web.

Mặc dù hiểu biết về toán học ở mức độ cao không phải là yêu cầu để trở thành một nhà phát triển có năng lực, nhưng điều quan trọng là phải biết những loại phép toán nào có sẵn trong JavaScript và cách sử dụng toán học như một công cụ để hoàn thành các nhiệm vụ thực tế.

Không giống như các ngôn ngữ lập trình khác, JavaScript chỉ có một kiểu dữ liệu số ; chẳng hạn như không có sự phân biệt giữa số nguyên (số nguyên dương hoặc âm) và số thực (số có dấu thập phân).

Trong hướng dẫn này, ta sẽ xem xét các toán tử số học, toán tử gán và thứ tự của các hoạt động được sử dụng với các kiểu dữ liệu số JavaScript.

Toán tử số học

Toán tử số học là các ký hiệu chỉ ra một phép toán và trả về một giá trị. Trong phương trình 3 + 7 = 10 , cú pháp + là viết tắt của phép cộng.

JavaScript có nhiều toán tử quen thuộc từ toán học cơ bản, cũng như một vài toán tử bổ sung dành riêng cho lập trình.

Đây là bảng tham chiếu của các toán tử số học JavaScript.

Nhà điều hành Cú pháp Thí dụ Định nghĩa
Thêm vào + x + y Tổng của xy
Phép trừ - x - y Sự khác biệt của xy
Phép nhân * x * y Sản phẩm của xy
Sư đoàn / x / y Thương của xy
Modulo % x % y Phần còn lại của x / y
Luỹ thừa ** x ** y x y sức mạnh y
Tăng ++ x++ x cộng một
Giảm dần -- x-- x trừ một

Ta sẽ đi vào chi tiết hơn về từng toán tử này trong suốt bài viết này.

Cộng và trừ

Các toán tử cộngtrừ có sẵn trong JavaScript và được dùng để tìm tổng và chênh lệch của các giá trị số. JavaScript có một máy tính tích hợp và các phép toán có thể được thực hiện trực tiếp trong console .

Ta có thể thực hiện một số phép cộng đơn giản với các số, ví dụ thêm 1020 , sử dụng dấu cộng ( + ).

10 + 20; 
Output
30

Ngoài cách làm toán với số đơn giản, ta cũng có thể gán số cho biến và thực hiện các phép tính tương tự. Trong trường hợp này, ta sẽ gán các giá trị số cho xy và đặt tổng bằng z .

// Assign values to x and y let x = 10; let y = 20;  // Add x and y and assign the sum to z let z = x + y;  console.log(z); 
Output
30

Tương tự, ta sử dụng dấu trừ ( - ) để trừ các số hoặc các biến biểu diễn số.

// Assign values to x and y let x = 10; let y = 20;  // Subtract x from y and assign the difference to z let z = y - x;  console.log(z); 
Output
10

Ta cũng có thể cộng và trừ với số âm và số thực (số thập phân).

// Assign values to x and y let x = -5.2; let y = 2.5;  // Subtract y from x and assign the difference to z let z = x - y;  console.log(z); 
Output
-7.7

Một điều thú vị cần lưu ý và lưu ý trong JavaScript là kết quả của việc thêm một số và một chuỗi . Ta biết rằng 1 + 1 nên bằng 2 , nhưng phương trình này sẽ có kết quả không mong muốn.

let x = 1 + "1";  console.log(x); typeof x; 
Output
11 'string'

Thay vì thêm hai số, JavaScript sẽ chuyển toàn bộ câu lệnh thành một chuỗi và nối chúng lại với nhau. Điều quan trọng là phải cẩn thận với bản chất kiểu động của JavaScript, vì nó có thể có kết quả không mong muốn.

Một lý do phổ biến để sử dụng phép cộng hoặc phép trừ trong JavaScript là cuộn đến một id trừ đi chiều cao tính bằng pixel của thanh chuyển cố định.

function scrollToId() {     const navHeight = 60;     window.scrollTo(0, window.pageYOffset - navHeight); }  window.addEventListener('hashchange', scrollToId); 

Trong ví dụ trên, nhấp vào một id sẽ cuộn đến 60 pixel phía trên id.

Phép cộng và phép trừ là hai trong số các phương trình toán học phổ biến nhất mà bạn sẽ sử dụng trong JavaScript.

Phép nhân và phép chia

Các toán tử nhânchia cũng có sẵn trong JavaScript và được sử dụng để tìm tích và thương của các giá trị số.

Dấu hoa thị ( * ) được sử dụng để biểu diễn toán tử nhân.

// Assign values to x and y let x = 20; let y = 5;  // Multiply x by y to get the product let z = x * y;  console.log(z); 
Output
100

Phép nhân được dùng để tính giá của một mặt hàng sau khi áp dụng thuế bán hàng.

const price = 26.5;    // Price of item before tax const taxRate = 0.082; // 8.2% tax rate  // Calculate total after tax to two decimal places let totalPrice = price + (price * taxRate); totalPrice.toFixed(2);  console.log("Total:", totalPrice); 
Output
Total: 28.67

Dấu gạch chéo ( / ) được sử dụng để đại diện cho toán tử chia.

// Assign values to x and y let x = 20; let y = 5;  // Divide y into x to get the quotient let z = x / y;  console.log(z); 
Output
4

Phép chia đặc biệt hữu ích khi tính toán thời gian, chẳng hạn như tìm số giờ trong một lượng phút hoặc khi tính toán phần trăm các câu trả lời đúng đã hoàn thành trong một bài kiểm tra.

Modulo

Một toán tử số học ít quen thuộc hơn một chút là toán tử modulo (đôi khi được gọi là modulus), tính toán phần còn lại của một thương sau khi chia. Modulo được biểu diễn bằng dấu phần trăm ( % ).

Ví dụ, ta biết rằng 3 đi vào 9 chính xác ba lần và không có phần dư.

9 % 3; 
Output
0

Ta có thể sử dụng toán tử modulo để xác định xem một số là số chẵn hay lẻ, như trong hàm này:

// Initialize function to test if a number is even const isEven = x => {     // If the remainder after dividing by two is 0, return true     if (x % 2 === 0) {         return true;     }     // If the number is odd, return false     return false; }  // Test the number isEven(12); 
Output
true

Trong ví dụ trên, 12 chia đều thành 2 , do đó nó là một số chẵn.

Thường trong lập trình, modulo được sử dụng cùng với các câu lệnh điều kiện để điều khiển stream .

Luỹ thừa

Luỹ thừa là một trong những toán tử mới hơn trong JavaScript và nó cho phép ta tính lũy thừa của một số theo số mũ của nó. Cú pháp cho phép tính lũy thừa là hai dấu hoa thị liên tiếp ( ** ).

10 đến lũy thừa thứ năm, hoặc 10 ^ 5, được viết như thế này:

10 ** 5; 
Output
100000

10 ** 5 tương tự như 10 nhân với 10 năm lần:

10 * 10 * 10 * 10 * 10; 

Một cách khác để viết điều này là với phương thức Math.pow() .

Math.pow(10, 5); 
Output
100000

Sử dụng toán tử lũy thừa là một cách ngắn gọn để tìm lũy thừa của một số nhất định, nhưng như thường lệ, điều quan trọng là phải phù hợp với kiểu cơ sở mã của bạn khi chọn giữa một phương pháp và một toán tử.

Tăng và giảm

Tăng và các nhà khai thác sụt lần tăng hoặc giảm giá trị số của một biến một. Chúng được biểu diễn bằng hai dấu cộng ( ++ ) hoặc hai dấu trừ ( -- ) và thường được sử dụng với các vòng lặp .

Lưu ý toán tử tăng và giảm chỉ được dùng trên các biến; cố gắng sử dụng chúng trên một số nguyên sẽ dẫn đến lỗi.

7++ 
Output
Uncaught ReferenceError: Invalid left-hand side expression in postfix operation

Toán tử tăng và giảm có thể được phân loại như một phép toán tiền tố hoặc hậu tố, tùy thuộc vào việc toán tử có được đặt trước hay sau biến hay không.

Đầu tiên, ta có thể nhắn tin tăng tiền tố, với ++x .

// Set a variable let x = 7;  // Use the prefix increment operation let prefix = ++x;  console.log(prefix); 
Output
8

Giá trị của x đã được tăng lên một. Để thấy sự khác biệt, ta sẽ kiểm tra sự gia tăng hậu tố, với y++ .

// Set a variable let y = 7;  // Use the prefix increment operation let postfix = y++;  console.log(postfix); 
Output
7

Giá trị của y không được tăng lên trong hoạt động postfix. Điều này là do giá trị sẽ không được tăng lên cho đến khi biểu thức đã được đánh giá.

Toán tử tăng hoặc giảm sẽ được thấy thường xuyên nhất trong một vòng lặp. Trong ví dụ for vòng lặp này, ta sẽ chạy hoạt động mười lần, bắt đầu bằng 0 và tăng giá trị lên 1 với mỗi lần lặp.

// Run a loop ten times for (let i = 0; i < 10; i++) {   console.log(i); } 
Output
0 1 2 3 4 5 6 7 8 9

Đoạn mã trên cho thấy sự lặp lại qua một vòng lặp đạt được thông qua việc sử dụng toán tử tăng dần.

Ta có thể coi x++ là viết tắt của x = x + 1x-- là viết tắt của x = x - 1 .

Người điều hành nhiệm vụ

Một trong những toán tử được sử dụng phổ biến nhất là toán tử gán , mà ta đã thấy và được biểu diễn bằng dấu bằng ( = ). Ta sử dụng = để gán một giá trị ở bên phải cho một biến ở bên trái.

// Assign 27 to age variable let age = 27; 

Ngoài toán tử gán tiêu chuẩn, JavaScript có các toán tử gán ghép , kết hợp toán tử số học với = .

Ví dụ, toán tử cộng sẽ bắt đầu với giá trị ban đầu và thêm một giá trị mới.

// Assign 27 to age variable let age = 27;  age += 3;  console.log(age); 
Output
30

Trong trường hợp này, age += 3 giống như viết age = age + 3 .

Tất cả các toán tử số học có thể được kết hợp với phép gán để tạo ra các toán tử gán ghép. Dưới đây là bảng tham chiếu các toán tử gán trong JavaScript.

Nhà điều hành Cú pháp
Chuyển nhượng =
Bài tập bổ sung +=
Phép trừ -=
Phép nhân *=
Phân công bộ phận /=
Bài tập còn lại %=
Phép gán lũy thừa **=

Toán tử gán ghép thường được sử dụng với các vòng lặp, tương tự như tăng và giảm, và được sử dụng khi các phương trình cần được lặp lại hoặc tự động hóa.

ưu tiên điều hành

Mặc dù ta đọc từ trái sang phải, các toán tử sẽ được đánh giá theo thứ tự ưu tiên, giống như trong toán học thông thường.

Trong ví dụ sau, phép nhân có mức độ ưu tiên cao hơn phép cộng, sẽ xác định kết quả của phương trình.

// First multiply 3 by 5, then add 10 10 + 3 * 5; 
Output
25

Thay vào đó, nếu ta muốn chạy thao tác bổ sung trước, ta nên group nó trong dấu ngoặc đơn, luôn có mức độ ưu tiên cao nhất.

// First add 10 and 3, then multiply by 5 (10 + 3) * 5; 
Output
65

Dưới đây là bảng tham chiếu về ưu tiên toán tử của các toán tử số học trong JavaScript, từ cao nhất đến thấp nhất. Đối với tăng và giảm, hậu tố có mức độ ưu tiên cao hơn tiền tố.

Tăng / giảm, nhân / chia và cộng / trừ có cùng mức độ ưu tiên.

Nhà điều hành Cú pháp
Dấu ngoặc đơn ()
Sự gia tăng ++
Sự suy giảm --
Luỹ thừa **
Phép nhân *
Sư đoàn /
Thêm vào +
Phép trừ -

Quyền ưu tiên của toán tử không chỉ bao gồm các toán tử số học mà còn bao gồm các toán tử gán, toán tử logic, toán tử điều kiện, v.v. Để có danh sách đầy đủ, hãy xem mức độ ưu tiên của toán tử trên Mạng nhà phát triển Mozilla (MDN) .

Kết luận

Trong bài viết này, ta đã đề cập đến các toán tử và cú pháp số học, bao gồm nhiều toán tử toán học quen thuộc và một số toán tử đặc trưng cho lập trình.

Ngoài ra, ta đã học cách kết hợp số học và phép gán để tạo toán tử gán ghép và thứ tự các phép toán trong JavaScript.


Tags:

Các tin liên quan

Cách lập chỉ mục, tách và thao tác chuỗi trong JavaScript
2017-07-14
Object.values và Object.entries trong JavaScript
2017-07-12
Cách làm việc với chuỗi trong JavaScript
2017-07-11
Giới thiệu về Maps bằng JavaScript
2017-07-06
Hiểu cú pháp và cấu trúc mã trong JavaScript
2017-07-05
Cách thêm JavaScript vào HTML
2017-06-30
Cách sử dụng control panel dành cho nhà phát triển JavaScript
2017-06-29
Cách viết comment bằng JavaScript
2017-06-20
Hiểu các loại dữ liệu trong JavaScript
2017-06-01
Phương thức chuỗi padStart và padEnd trong JavaScript
2017-02-17