Tài liệu tham khảo về toán tử JavaScript
Toán tử JavaScript
Toán tử được sử dụng để gán giá trị, so sánh các giá trị, thực hiện các phép tính số học, v.v.
Có nhiều loại toán tử JavaScript khác nhau:
- Toán tử số học
- Toán tử gán
- Toán tử so sánh
- Toán tử logic
- Toán tử có điều kiện
- Toán tử kiểu
Toán tử số học JavaScript
Toán tử số học được sử dụng để thực hiện số học giữa các biến và/hoặc giá trị.
Cho y = 5 , bảng dưới đây giải thích các toán tử số học:
Oper | Name | Example | Results | Try it |
---|---|---|---|---|
+ | Addition | x = y + 2 | y=5, x=7 | Try it » |
- | Subtraction | x=y-2 | y=5, x=3 | Try it » |
* | Multiplication | x=y*2 | y=5, x=10 | Try it » |
** | Exponentiation ES2016 |
x=y**2 | y=5, x=25 | Try it » |
/ | Division | x = y / 2 | y=5, x=2.5 | Try it » |
% | Remainder | x = y % 2 | y=5, x=1 | Try it » |
++ | Pre increment | x = ++y | y=6, x=6 | Try it » |
++ | Post increment | x = y++ | y=6, x=5 | Try it » |
-- | Pre decrement | x = --y | y=4, x=4 | Try it » |
-- | Post decrement | x = y-- | y=4, x=5 | Try it » |
Để biết hướng dẫn về toán tử số học, hãy đọc Hướng dẫn số học JavaScript của chúng tôi.
Toán tử gán JavaScript
Toán tử gán được sử dụng để gán giá trị cho các biến JavaScript.
Cho rằng x = 10 và y = 5 , bảng bên dưới giải thích các toán tử gán:
Oper | Example | Same As | Result | Try it |
---|---|---|---|---|
= | x = y | x = y | x = 5 | Try it » |
+= | x += y | x = x + y | x = 15 | Try it » |
-= | x -= y | x = x - y | x = 5 | Try it » |
*= | x *= y | x = x * y | x = 50 | Try it » |
/= | x /= y | x = x / y | x = 2 | Try it » |
%= | x %= y | x = x % y | x = 0 | Try it » |
: | x: 45 | size.x = 45 | x = 45 | Try it » |
Để biết hướng dẫn về toán tử gán, hãy đọc Hướng dẫn gán JavaScript của chúng tôi.
Toán tử chuỗi JavaScript
Toán tử + và toán tử += cũng có thể được sử dụng để nối (cộng) chuỗi.
Cho rằng t1 = "Good " , t2 = "Morning" và t3 = "" , bảng bên dưới giải thích các toán tử:
Oper | Example | t1 | t2 | t3 | Try it |
---|---|---|---|---|---|
+ | t3 = t1 + t2 | "Good " | "Morning" | "Good Morning" | Try it » |
+= | t1 += t2 | "Good Morning" | "Morning" | Try it » |
Toán tử so sánh
Toán tử so sánh được sử dụng trong các câu lệnh logic để xác định sự bằng nhau hoặc khác biệt giữa các biến hoặc giá trị.
Cho rằng x = 5 , bảng dưới đây giải thích các toán tử so sánh:
Oper | Name | Comparing | Returns | Try it |
---|---|---|---|---|
== | equal to | x == 8 | false | Try it » |
== | equal to | x == 5 | true | Try it » |
=== | equal value and type | x === "5" | false | Try it » |
=== | equal value and type | x === 5 | true | Try it » |
!= | not equal | x != 8 | true | Try it » |
!== | not equal value or type | x !== "5" | true | Try it » |
!== | not equal value or type | x !== 5 | false | Try it » |
> | greater than | x > 8 | false | Try it » |
< | less than | x < 8 | true | Try it » |
>= | greater or equal to | x >= 8 | false | Try it » |
<= | less or equal to | x <= 8 | true | Try it » |
Để biết hướng dẫn về toán tử so sánh, hãy đọc Hướng dẫn so sánh JavaScript của chúng tôi.
Toán tử có điều kiện (Ternary)
Toán tử điều kiện gán giá trị cho một biến dựa trên điều kiện.
Syntax | Example | Try it |
---|---|---|
(condition) ? x : y | (z < 18) ? x : y | Try it » |
Toán tử logic
Toán tử logic được sử dụng để xác định logic giữa các biến hoặc giá trị.
Cho rằng x = 6 và y = 3 , bảng dưới đây giải thích các toán tử logic:
Oper | Name | Example | Try it |
---|---|---|---|
&& | AND | (x < 10 && y > 1) is true | Try it » |
|| | OR | (x === 5 || y === 5) is false | Try it » |
! | NOT | !(x === y) is true | Try it » |
Toán tử hợp nhất Nullish (??)
Các ??
toán tử trả về đối số đầu tiên nếu nó không có giá trị rỗng ( null
hoặc undefined
).
Nếu không nó sẽ trả về đối số thứ hai.
Toán tử nullish được hỗ trợ trong tất cả các trình duyệt kể từ tháng 3 năm 2020:
Chrome 80 | Edge 80 | Firefox 72 | Safari 13.1 | Opera 67 |
Feb 2020 | Feb 2020 | Jan 2020 | Mar 2020 | Mar 2020 |
Toán tử chuỗi tùy chọn (?.)
Các ?.
toán tử trả về undefined
nếu một đối tượng undefined
hoặc null
(thay vì đưa ra lỗi).
Ví dụ
// Create an object:
const car = {type:"Fiat", model:"500", color:"white"};
// Ask for car name:
document.getElementById("demo").innerHTML = car?.name;
Hãy tự mình thử »Toán tử chuỗi tùy chọn được hỗ trợ trong tất cả các trình duyệt kể từ tháng 3 năm 2020:
Chrome 80 | Edge 80 | Firefox 72 | Safari 13.1 | Opera 67 |
Feb 2020 | Feb 2020 | Jan 2020 | Mar 2020 | Mar 2020 |
Toán tử bitwise trong JavaScript
Toán tử bit hoạt động trên số 32 bit. Bất kỳ toán hạng số nào trong thao tác đều được chuyển đổi thành số 32 bit. Kết quả được chuyển đổi trở lại thành số JavaScript.
Oper | Name | Example | Same as | Result | Decimal | Try it |
---|---|---|---|---|---|---|
& | AND | x = 5 & 1 | 0101 & 0001 | 0001 | 1 | Try it » |
| | OR | x = 5 | 1 | 0101 | 0001 | 0101 | 5 | Try it » |
~ | NOT | x = ~ 5 | ~0101 | 1010 | 10 | Try it » |
^ | XOR | x = 5 ^ 1 | 0101 ^ 0001 | 0100 | 4 | Try it » |
<< | Left shift | x = 5 << 1 | 0101 << 1 | 1010 | 10 | Try it » |
>> | Right shift | x = 5 >> 1 | 0101 >> 1 | 0010 | 2 | Try it » |
>>> | Unsigned right | x = 5 >>> 1 | 0101 >>> 1 | 0010 | 2 | Try it » |
Ghi chú
Bảng trên sử dụng số không dấu 4 bit. Vì JavaScript sử dụng số có dấu 32 bit nên ~ 5 sẽ không trả về 10. Nó sẽ trả về -6.
~000000000000000000000000000000101 (~5)
sẽ trở lại
11111111111111111111111111111010 (-6)
Kiểu toán tử
Toán tử typeof trả về kiểu của biến, đối tượng, hàm hoặc biểu thức:
Xin vui lòng quan sát:
- Kiểu dữ liệu của NaN là số
- Kiểu dữ liệu của mảng là đối tượng
- Kiểu dữ liệu của một ngày là đối tượng
- Kiểu dữ liệu null là đối tượng
- Kiểu dữ liệu của một biến không xác định là không xác định
Ví dụ
typeof "John"
typeof 3.14
typeof NaN
typeof false
typeof [1, 2, 3, 4]
typeof {name:'John', age:34}
typeof new Date()
typeof function () {}
typeof myCar
typeof null
Hãy tự mình thử »Ghi chú
Bạn không thể sử dụng typeof để xác định xem đối tượng JavaScript là một mảng hay một ngày.
Cả mảng và ngày đều trả về đối tượng dưới dạng kiểu.
Toán tử xóa
Toán tử xóa xóa một thuộc tính khỏi một đối tượng:
Ví dụ
const person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
};
delete person.age;
Hãy tự mình thử »Toán tử xóa sẽ xóa cả giá trị của thuộc tính và chính thuộc tính đó.
Sau khi xóa, thuộc tính không thể được sử dụng trước khi nó được thêm lại.
Toán tử xóa được thiết kế để sử dụng trên các thuộc tính đối tượng. Nó không có tác dụng đối với các biến hoặc chức năng.
Ghi chú
Không nên sử dụng toán tử xóa trên các thuộc tính của bất kỳ đối tượng JavaScript được xác định trước nào (Mảng, Boolean, Ngày, Hàm, Toán, Số, RegExp và Chuỗi).
Điều này có thể làm hỏng ứng dụng của bạn.
Toán tử Spread (...)
Toán tử ... mở rộng một iterable thành nhiều phần tử hơn:
Ví dụ
const q1 = ["Jan", "Feb", "Mar"];
const q2 = ["Apr", "May", "Jun"];
const q3 = ["Jul", "Aug", "Sep"];
const q4 = ["Oct", "Nov", "May"];
const year = [...q1, ...q2, ...q3, ...q4];
Hãy tự mình thử »Toán tử ... có thể được sử dụng để mở rộng một iterable thành nhiều đối số hơn cho các lệnh gọi hàm:
Toán tử trong
Toán tử in trả về true nếu một thuộc tính nằm trong một đối tượng, nếu không thì trả về false:
Ví dụ về đối tượng
const person = {firstName:"John", lastName:"Doe", age:50};
("firstName" in person);
("age" in person);
Hãy tự mình thử »Ghi chú
Bạn không thể sử dụng in để kiểm tra nội dung mảng như ("Volvo" trong ô tô).
Thuộc tính mảng chỉ có thể là chỉ mục (0,1,2,3...) và độ dài.
Xem các ví dụ dưới đây.
Ví dụ
const cars = ["Saab", "Volvo", "BMW"];
("Saab" in cars);
Hãy tự mình thử »
const cars = ["Saab", "Volvo", "BMW"];
(0 in cars);
(1 in cars);
(4 in cars);
("length" in cars);
Hãy tự mình thử »Đối tượng được xác định trước
("PI" in Math);
("NaN" in Number);
("length" in String);
Hãy tự mình thử »Toán tử instanceof
Toán tử instanceof trả về true nếu một đối tượng là một thể hiện của một đối tượng được chỉ định:
Ví dụ
const cars = ["Saab", "Volvo", "BMW"];
(cars instanceof Array) // Returns true
(cars instanceof Object) // Returns true
(cars instanceof String) // Returns false
(cars instanceof Number) // Returns false
Hãy tự mình thử »Toán tử trống
Toán tử void đánh giá một biểu thức và trả về không xác định . Toán tử này thường được sử dụng để lấy giá trị nguyên thủy không xác định, sử dụng "void(0)" (hữu ích khi đánh giá một biểu thức mà không sử dụng giá trị trả về).
Ví dụ
<a href="javascript:void(0);">
Useless link
</a>
<a href="javascript:void(document.body.style.backgroundColor='red');">
Click me to change the background color of body to red
</a>
Hãy tự mình thử »