Toán tử trong JavaScript

Toán tử trong JavaScript
Toán tử trong JavaScript

Chức năng của Toán tử trong JavaScript

Toán tử trong JavaScript dùng để tính toán các phép tính, so sánh các con số, so sánh các kiểu dữ liệu,...

Toán tử toán học trong javascript

Toán tử toán học Chức năng
+ Phép cộng nhiều biến số với nhau
- Phép trừ nhiều biến số với nhau
* Phép nhân nhiều biến số với nhau
/ Phép chia nhiều biến số với nhau
% Phép chia lấy số dư
++ Tăng lên 1
-- Giảm xuống 1
<script>
var a = 4;
var b  = 5;
var d  = 8;
// Phép cộng
var c = a + b;
document.write(a+"+"+b+"="+c+"<br>"); // Kết quả 4+5=9
// Phép trừ
var c = b - a;
document.write(b+"-"+a+"="+c+"<br>"); // Kết quả 5-4=1
// Phép nhân
var c = b * a;
document.write(b+"*"+a+"="+c+"<br>"); // Kết quả 5*4=20
// Phép chia
var c = d / a;
document.write(d+"/"+a+"="+c+"<br>"); // Kết quả 8/4=2
// Phép lấy số dư
var c = d % b;
document.write(d+"%"+b+"="+c+"<br>"); // Kết quả 8%5=3
// ++
// m++ (lấy giá trị rồi tăng lên)
document.write("<b>lấy giá trị rồi tăng lên</b><br>");
var m = 7;
document.write(m++); // Kết quả: 7
document.write("<br>");
document.write(m); // Kết quả: 8
document.write("<br>");
// ++m (tăng trước khi lấy giá trị)
document.write("<b>tăng trước khi lấy giá trị</b><br>");
var m = 7;
document.write(++m); // Kết quả: 8
document.write("<br>");
document.write(m); // Kết quả: 8
document.write("<br>");
// --
// m-- (lấy giá trị rồi giảm xuống)
document.write("<b>lấy giá trị rồi giảm xuống</b><br>");
var m = 7;
document.write(m--); // Kết quả: 7
document.write("<br>");
document.write(m); // Kết quả: 6
document.write("<br>");
// --m (giảm trước khi lấy giá trị)
document.write("<b>giảm trước khi lấy giá trị</b><br>");
var m = 7;
document.write(--m); // Kết quả: 6
document.write("<br>");
document.write(m); // Kết quả: 6
</script>

Kết quả:

4+5=9
5-4=1
5*4=20
8/4=2
8%5=3
lấy giá trị rồi tăng lên
7
8
tăng trước khi lấy giá trị
8
8
lấy giá trị rồi giảm xuống
7
6
giảm trước khi lấy giá trị
6
6

Chạy Thử

Toán tử gán trong javascript

Toán tử Ví dụ Mô tả
= c= a+b
+= a -= b a = a-b
-= a += b a = a+b
*= a *= b a = a*b
/= a /= b a = a/b
*= a %= b a = a%b
<script>
document.write("a=6, b=3: <br>");
var a =  6;
var b = 3;
// c = a + b
var c = a + b;
document.write(a+"+"+b+"="+c+"<br>"); // Kết quả 6+3=9
// a += b;
document.write("kết quả của a+=b là: ");
document.write(a+=b);
// a -= b;
var a =  6;
var b = 3;
document.write("<br>");
document.write("kết quả của a-=b là: ");
document.write(a-=b);
// a *= b;
var a =  6;
var b = 3;
document.write("<br>");
document.write("kết quả của a*=b là: ");
document.write(a*=b);
// a /= b;
var a =  6;
var b = 3;
document.write("<br>");
document.write("kết quả của a/=b là: ");
document.write(a/=b);
// c %= d;
document.write("<br>");
document.write("c=8, d=3: <br>");
var c =  8;
var d = 3;
document.write("kết quả của c%=d là: ");
document.write(c%=d);
</script>

Kết quả:

a=6, b=3:
6+3=9
kết quả của a+=b là: 9
kết quả của a-=b là: 3
kết quả của a*=b là: 18
kết quả của a/=b là: 2
c=8, d=3:
kết quả của c%=d là: 2

Chạy Thử

Toán tử quan hệ trong Javascript

Toán tử quan hệ được sử dụng trong câu lệnh if, nếu đúng thì trả về true, nếu sai thì trả về false:

Toán tử Ví dụ Mô tả
> a>b Nếu a lớn hơn b thì trả về true, ngược lại trả về false
a Nếu a nhỏ hơn b thì trả về true, ngược lại trả về false
>= a>=b Nếu a lớn hơn hoặc bằng b thì trả về true, ngược lại trả về false
a Nếu a nhỏ hơn hoặc bằng b thì trả về true, ngược lại trả về false
== a==b Nếu a bằng b thì trả về true, ngược lại trả về false
!= a!=b Nếu a không bằng b thì trả về true, ngược lại trả về false
<script>
var a = 4;
var b  = 5;
document.write("a=4,b=5 <br>");
// a>b
if(a>b){
document.write("a lớn hơn b <br>");
}else{
document.write("a không lớn hơn b <br>");
}
// a<b
if(a<b){
document.write("a nhỏ hơn b <br>");
}else{
document.write("a không nhỏ hơn b <br>");
}
// a>=b
if(a>=b){
document.write("a lớn hơn hoặc bằng b <br>");
}else{
document.write("a không lớn hơn hoặc bằng b <br>");
}
// a<=b
if(a<=b){
document.write("a nhỏ hơn hoặc bằng b <br>");
}else{
document.write("a không nhỏ hơn hoặc bằng b <br>");
}
// a==b
if(a==b){
document.write("a bằng b <br>");
}else{
document.write("a không bằng b <br>");
}
// a!=b
if(a!=b){
document.write("a không bằng b <br>");
}else{
document.write("a bằng b <br>");
}
</script>

Kết quả:

a=4,b=5
a không lớn hơn b
a nhỏ hơn b
a không lớn hơn hoặc bằng b
a nhỏ hơn hoặc bằng b
a không bằng b
a không bằng b

Chạy Thử

Toán tử luận lý trong Javascript

Toán tử Ý nghĩa
&& AND: trả về kết quả là TRUE khi cả hai toán hạng đều TRUE
|| OR: trả về kết quả là TRUE khi cả hai hoặc một trong hai toán hàng là TRUE
! NOT: Chuyển đổi giá trị của toán hạng từ TRUE sang FALSE hoặc từ FALSE sang TRUE
<script>
document.write("a=4,b=5 <br>");
var a = 4;
var b  = 5;
// &&
document.write("&& <br>");
if(a>0&&b>0){
document.write("a và b lớn hơn 0 <br>");
}else{
document.write("a và b không lớn hơn 0 <br>");
}
// ||
document.write("|| <br>");
if(a==4||b==4){
document.write("a hoặc b bằng 4 <br>");
}else{
document.write("a hoặc b đều không bằng 4 <br>");
}
// !
document.write("! <br>");
if(a!=5){
document.write("a không bằng 5 <br>");
}else{
document.write("a bằng 5 <br>");
}
</script>

Kết quả:

a=4,b=5
&&
a và b lớn hơn 0
||
a hoặc b bằng 4
!
a không bằng 5

Chạy Thử

Độ ưu tiên các toán tử trong Javascript

Nhân chia trước, cộng trừ sau.

So sánh Toán tử == và === trong JavaScript

== so sánh giá trị không quan trọng kiểu dữ liệu số hay chữ.

=== so sánh giá trị lẫn kiểu dữ liệu số hay chữ.

<script>
document.write("var a=4,var b ='4' <br>");
var a = 4;
var b  = "4";
document.write("<b>a==b</b> <br>");
if(a==b){
document.write("a bằng b <br>");
}else{
document.write("a không bằng b<br>");
}
document.write("<b>a===b </b><br>");
if(a===b){
document.write("a bằng b<br>");
}else{
document.write("a không bằng b<br>");
}
</script>

Kết quả:

var a=4,var b ='4'
a==b
a bằng b
a===b
a không bằng b

Các toán tử đặc biệt trong JavaScript

Bên cạnh những nhóm toán tử quen thuộc, JavaScript còn có một số toán tử đặc biệt giúp rút gọn câu lệnh và xử lý dữ liệu linh hoạt hơn. Chúng thường xuất hiện trong code thực tế, nhất là khi kiểm tra điều kiện, làm việc với giá trị có thể bị thiếu hoặc thao tác với object và array.

Toán tử ba ngôi ?: trong JavaScript

Toán tử ba ngôi cho phép viết một điều kiện và lựa chọn một trong hai giá trị ngay trên cùng một biểu thức. Cấu trúc gồm điều kiện, giá trị khi điều kiện đúng và giá trị khi điều kiện sai.

let age = 20;
let result = age >= 18 ? "Đủ tuổi" : "Chưa đủ tuổi";

console.log(result);

Trong ví dụ trên, nếu age >= 18 là true, biến result nhận giá trị "Đủ tuổi"; ngược lại, giá trị nhận được là "Chưa đủ tuổi". Toán tử này phù hợp với các điều kiện ngắn, rõ ràng và chỉ có hai hướng xử lý.

Toán tử nullish ?? trong JavaScript

Toán tử ?? dùng để chọn một giá trị thay thế khi giá trị bên trái là null hoặc undefined. Điểm đáng chú ý là nó không xem các giá trị như 0, false hay chuỗi rỗng là thiếu dữ liệu.

let username = null;
let displayName = username ?? "Khách";

console.log(displayName);

Trong trường hợp trên, displayName nhận "Khách". Cách viết này hữu ích khi dữ liệu đầu vào có thể không tồn tại nhưng vẫn cần giữ nguyên những giá trị hợp lệ như 0 hoặc false.

Toán tử optional chaining ?. trong JavaScript

Optional chaining giúp truy cập thuộc tính hoặc gọi phương thức mà không làm chương trình phát sinh lỗi khi đối tượng ở giữa chuỗi có giá trị null hoặc undefined.

const user = {
    profile: {
        name: "An"
    }
};

console.log(user.profile?.name);
console.log(user.contact?.phone);

Ở dòng thứ hai, contact không tồn tại nhưng biểu thức vẫn trả về undefined thay vì dừng chương trình vì lỗi truy cập thuộc tính. Toán tử này đặc biệt hữu ích khi xử lý dữ liệu từ API hoặc các object có cấu trúc không cố định.

Toán tử spread ... trong JavaScript

Toán tử spread dùng để trải các phần tử của array hoặc các thuộc tính của object vào một cấu trúc mới. Nhờ đó, có thể tạo bản sao hoặc kết hợp dữ liệu mà không cần xử lý từng phần tử.

const first = [1, 2, 3];
const second = [...first, 4, 5];

console.log(second);

Với object, spread cũng có thể dùng để tạo object mới và bổ sung hoặc ghi đè thuộc tính cần thiết.

const user = {
    name: "An",
    age: 20
};

const updatedUser = {
    ...user,
    age: 21
};

Cách làm này thường được sử dụng khi cần tạo dữ liệu mới từ dữ liệu hiện có mà không thay đổi trực tiếp cấu trúc ban đầu.

Toán tử typeof và kiểm tra kiểu dữ liệu

typeof là toán tử dùng để xác định kiểu dữ liệu của một giá trị. Kết quả trả về là một chuỗi mô tả kiểu dữ liệu, chẳng hạn "string", "number", "boolean" hoặc "undefined".

const name = "Web Mới";
const age = 20;

console.log(typeof name);
console.log(typeof age);

Toán tử này thường được dùng khi cần kiểm tra dữ liệu trước khi thực hiện một thao tác. Tuy nhiên, cần lưu ý rằng typeof null trả về "object", đây là một đặc điểm lâu đời của JavaScript và có thể gây nhầm lẫn nếu chỉ dựa vào typeof để xác định mọi kiểu dữ liệu.

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Toán tử trong JavaScript.

  • ★★★★★ ★★★★★
  • 0 Bình luận
Trần Thị Vân | Content Creator Web Mới
Trần Thị Vân
Trần Thị Vân là Content Creator tại Web Mới, phụ trách nghiên cứu, biên soạn nội dung và chia sẻ kiến thức về website, SEO, lập trình cùng các xu hướng công nghệ
Đánh giá
Chia sẻ nội dung đánh giá của bạn về Toán tử trong JavaScript
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *
Đánh giá của bạn
Tên *
Email
Số điện thoại *
Bình luận, Hỏi đáp
Yêu Cầu Báo Giá
Gửi trang web mẫu cần làm theo, chúng tôi sẽ báo giá đến bạn từ Email (tanlucit09@gmail.com - Bùi Tấn Lực) hoặc Zalo (Lực IT - 0398259259) !