Sunday, July 7, 2024

[Javascript] – Phần 12: Các toán tử gán (Assignment) trong JavaScript

-

JavaScript Assignment Operators (Các toán tử gán trong JavaScript) là các toán tử được sử dụng để gán giá trị cho biến bằng các phép tính hoặc thao tác khác.

Dưới đây là danh sách các toán tử gán và ví dụ cụ thể:

  • = (Assignment Operator): Toán tử gán này được sử dụng để gán giá trị cho biến.
    • Ví dụ: var x = y; gán giá trị của biến y cho biến x.
  • += (Addition Assignment Operator): Toán tử này thực hiện phép cộng và gán kết quả cho biến.
    • Ví dụ: x += y; tương đương với x = x + y;.
  • -= (Subtraction Assignment Operator): Toán tử này thực hiện phép trừ và gán kết quả cho biến.
    • Ví dụ: x -= y; tương đương với x = x - y;.
  • *= (Multiplication Assignment Operator): Toán tử này thực hiện phép nhân và gán kết quả cho biến.
    • Ví dụ: x *= y; tương đương với x = x * y;.
  • /= (Division Assignment Operator): Toán tử này thực hiện phép chia và gán kết quả cho biến.
    • Ví dụ: x /= y; tương đương với x = x / y;.
  • %= (Modulus Assignment Operator): Toán tử này thực hiện phép chia lấy dư và gán kết quả cho biến.
    • Ví dụ: x %= y; tương đương với x = x % y;.
  • **= (Exponentiation Assignment Operator): Toán tử này thực hiện phép luỹ thừa và gán kết quả cho biến.
    • Ví dụ: x **= y; tương đương với x = x ** y;.

Các toán tử gán trong JavaScript có thể được chia thành ba loại chính.

Shift Assignment Operators (Toán tử gán dịch chuyển):

  • <<= (Left Shift Assignment Operator): Toán tử này thực hiện phép dịch chuyển sang trái và gán kết quả cho biến.
    • Ví dụ: x <<= y; tương đương với x = x << y;.
  • >>= (Right Shift Assignment Operator): Toán tử này thực hiện phép dịch chuyển sang phải (đẩy bit phải) và gán kết quả cho biến.
    • Ví dụ: x >>= y; tương đương với x = x >> y;.
  • >>>= (Unsigned Right Shift Assignment Operator): Toán tử này thực hiện phép dịch chuyển sang phải không dấu (đẩy bit phải và điền 0 vào bit cao nhất) và gán kết quả cho biến.
    • Ví dụ: x >>>= y; tương đương với x = x >>> y;.

Bitwise Assignment Operators (Toán tử gán bitwise):

  • &= (Bitwise AND Assignment Operator): Toán tử này thực hiện phép AND bitwise và gán kết quả cho biến.
    • Ví dụ: x &= y; tương đương với x = x & y;.
  • ^= (Bitwise XOR Assignment Operator): Toán tử này thực hiện phép XOR bitwise và gán kết quả cho biến.
    • Ví dụ: x ^= y; tương đương với x = x ^ y;.
  • |= (Bitwise OR Assignment Operator): Toán tử này thực hiện phép OR bitwise và gán kết quả cho biến.
    • Ví dụ: x |= y; tương đương với x = x | y;.

Logical Assignment Operators (Toán tử gán logic):

  • &&= (Logical AND Assignment Operator): Toán tử này thực hiện phép AND logic và gán kết quả cho biến.
    • Ví dụ: x &&= y; tương đương với x = x && (x = y);.
  • ||= (Logical OR Assignment Operator): Toán tử này thực hiện phép OR logic và gán kết quả cho biến.
    • Ví dụ: x ||= y; tương đương với x = x || (x = y);.
  • ??= (Logical Nullish Assignment Operator): Toán tử này thực hiện phép kiểm tra nullish và gán kết quả cho biến.
    • Ví dụ: x ??= y; tương đương với x = x ?? (x = y);.

Các toán tử gán này giúp viết code ngắn gọn hơn và thực hiện các phép tính bitwise, dịch chuyển, hoặc logic cùng với gán giá trị trong một dòng code. Chúng rất hữu ích trong việc xử lý và biểu thị dữ liệu theo cách tùy chỉnh.

The = Operator.

Toán tử = trong JavaScript được gọi là toán tử gán đơn giản (Simple Assignment Operator). Nó được sử dụng để gán một giá trị cho một biến.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 10;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Trong ví dụ này, giá trị 10 được gán cho biến x. Điều này có nghĩa là biến x bây giờ chứa giá trị 10. Bạn có thể hiểu toán tử = như một câu lệnh gán, trong đó giá trị ở phía bên phải được gán cho biến ở phía bên trái.

Value of x is: 10

Sau khi thực hiện phép gán này, bạn có thể sử dụng biến x trong code của bạn và nó sẽ giữ giá trị 10 cho đến khi bạn thay đổi hoặc cập nhật nó sau này trong chương trình.

Ví dụ 2.

<html>
  <body>
    <p id="demo"></p>
    <script>
    let y = 50
    let x = 10 + y;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Kết quả.

Value of x is: 60

The += Operator.

Toán tử += trong JavaScript được gọi là toán tử gán cộng thêm (Addition Assignment Operator). Nó được sử dụng để thêm một giá trị vào biến.

Dưới đây là một ví dụ:

let x = 10;
x += 5;

Ở đây, biến x ban đầu có giá trị là 10. Sau khi thực hiện x += 5;, giá trị 5 đã được thêm vào biến x.

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 10;
    x += 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Bây giờ, x có giá trị là 15.

Value of x is: 15

Bạn cũng có thể sử dụng toán tử += với chuỗi để nối chuỗi lại với nhau:

Trong ví dụ này, biến text được ban đầu có giá trị là "Hello". Sau khi thực hiện text += " World";, chuỗi " World" đã được nối vào biến text.

<html>
  <body>
    <p id="demo"></p>
    <script>
    let text = "Hello";
    text += " World";
    document.getElementById("demo").innerHTML = text;
    </script>
  </body>
</html>

Bây giờ, text có giá trị là "Hello World".

Hello World

Toán tử += là một cách tiện lợi để thực hiện cộng hoặc nối giá trị vào biến và làm cho code của bạn trở nên ngắn gọn hơn.

The -= Operator.

Toán tử -= trong JavaScript được gọi là toán tử gán trừ đi (Subtraction Assignment Operator). Nó được sử dụng để trừ đi một giá trị từ biến.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 10;
    x -= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Ở đây, biến x ban đầu có giá trị là 10. Sau khi thực hiện x -= 5;, giá trị 5 đã được trừ đi từ biến x. Bây giờ, x có giá trị là 5.

Value of x is: 5

Toán tử -= là một cách tiện lợi để thực hiện phép trừ giá trị từ biến và làm cho code của bạn trở nên ngắn gọn hơn.

The *= Operator.

Toán tử *= trong JavaScript được gọi là Toán tử Gán Nhân (Multiplication Assignment Operator). Nó được sử dụng để nhân một biến với một giá trị.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 10;
    x *= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Ở đây, biến x ban đầu có giá trị là 10. Sau khi thực hiện x *= 5;, biến x được nhân với giá trị 5. Kết quả là x có giá trị là 50.

Value of x is: 50

Toán tử *= giúp thực hiện phép nhân và gán giá trị mới cho biến trong một dòng code ngắn gọn.

The **= Operator.

Toán tử **= trong JavaScript được gọi là toán tử gán lũy thừa (Exponentiation Assignment Operator). Nó được sử dụng để đưa một biến lên một số mũ cụ thể.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 10;
    x **= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Ở đây, biến x ban đầu có giá trị là 10. Sau khi thực hiện x **= 5;, biến x được đưa lên lũy thừa 5, có nghĩa là nó sẽ được tính là 10^5, và kết quả là 100000.

Value of x is: 100000

Toán tử **= giúp thực hiện phép lũy thừa và gán giá trị mới cho biến trong một dòng code ngắn gọn.

The /= Operator.

Toán tử /= trong JavaScript được gọi là toán tử gán chia (Division Assignment Operator). Nó được sử dụng để chia một biến cho một giá trị.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 10;
    x /= 5;
    document.getElementById("demo").innerHTML = x;
    </script>
  </body>
</html>

Ở đây, biến x ban đầu có giá trị là 10. Sau khi thực hiện x /= 5;, biến x được chia cho giá trị 5. Kết quả là x có giá trị là 2.

2

Toán tử /= giúp thực hiện phép chia và gán giá trị mới cho biến trong một dòng code ngắn gọn.

The %= Operator.

Toán tử %= trong JavaScript được gọi là toán tử gán dư (Remainder Assignment Operator). Nó được sử dụng để gán giá trị của phần dư sau khi chia một biến cho một giá trị cụ thể.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 10;
    x %= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Ở đây, biến x ban đầu có giá trị là 10. Sau khi thực hiện x %= 5;, biến x được gán giá trị là phần dư của phép chia 10 cho 5. Trong trường hợp này, phần dư là 0 nên x sẽ có giá trị 0.

Value of x is: 0

Toán tử %= giúp thực hiện phép chia lấy dư và gán giá trị phần dư cho biến trong một dòng code ngắn gọn.

The <<= Operator.

Toán tử <<= trong JavaScript được gọi là toán tử gán dịch chuyển sang trái (Left Shift Assignment Operator). Nó được sử dụng để dịch chuyển các bit của một biến sang trái và gán kết quả cho biến. Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = -100;
    x <<= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Biến x ban đầu có giá trị là -100. Sau đó, bạn sử dụng toán tử <<= để thực hiện phép dịch chuyển bit sang trái (left shift) 5 bit.

Phép dịch chuyển bit sang trái sẽ thêm các bit 0 vào phía bên phải và loại bỏ các bit từ phía bên trái. Trong trường hợp này, kết quả của phép dịch chuyển bit sang trái của -100-3200.

Sau đó, bạn sử dụng document.getElementById("demo").innerHTML để hiển thị giá trị của x trong phần tử có id là “demo”, và giá trị -3200 sẽ được hiển thị trên trang web của bạn.

Value of x is: -3200

Lưu ý rằng phép dịch chuyển bit có thể tạo ra kết quả khá khác biệt với các giá trị số nguyên và kết quả có thể không dựa vào giá trị tuyệt đối của x. Kết quả cụ thể của ví dụ trên phụ thuộc vào cách JavaScript xử lý phép dịch chuyển bit trái cho giá trị âm.

Toán tử <<= giúp thực hiện phép dịch chuyển bit và gán kết quả cho biến trong một dòng code.

The >>= Operator.

Toán tử >>= trong JavaScript được gọi là toán tử gán dịch chuyển sang phải (Right Shift Assignment Operator) và nó được sử dụng để dịch chuyển các bit của biến sang phải (đẩy bit phải) và gán kết quả lại cho biến.

Đây là ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = -100;
    x >>= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Biến x ban đầu có giá trị là -100. Sau đó, bạn sử dụng toán tử >>= để thực hiện phép dịch chuyển bit sang phải (right shift) 5 bit.

Phép dịch chuyển bit sang phải sẽ loại bỏ các bit từ phía bên trái và điền bit 0 vào phía bên trái. Trong trường hợp này, kết quả của phép dịch chuyển bit sang phải của -100-4.

Sau đó, bạn sử dụng document.getElementById("demo").innerHTML để hiển thị giá trị của x trong phần tử có id là “demo”, và giá trị -4 sẽ được hiển thị trên trang web của bạn.

Value of x is: -4

Toán tử >>= giúp thực hiện phép dịch chuyển bit phải và gán kết quả lại cho biến trong một dòng code.

The >>>= Operator.

Toán tử >>>= trong JavaScript được gọi là toán tử gán dịch chuyển sang phải không dấu (Unsigned Right Shift Assignment Operator) và nó được sử dụng để dịch chuyển các bit của biến sang phải mà không xem xét dấu (đẩy bit phải và điền 0 vào bit cao nhất) và gán kết quả lại cho biến.

Dưới đây là ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = -100;
    x >>>= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Biến x ban đầu có giá trị là -100. Sau đó, bạn sử dụng toán tử >>>= để thực hiện phép dịch chuyển bit sang phải không dấu (unsigned right shift) 5 bit.

Khi bạn thực hiện dịch chuyển bit sang phải không dấu trên một số âm, JavaScript sẽ coi giá trị đó là một số không dấu trong khoảng từ 0 đến 2^32 – 1 (tức là từ 0 đến 4294967295 trong hệ thập phân). Trong trường hợp này, -100 được coi là một số không dấu và sau phép dịch chuyển, giá trị mới của x134217724.

Sau đó, bạn sử dụng document.getElementById("demo").innerHTML để hiển thị giá trị của x trong phần tử có id là “demo” và giá trị 134217724 sẽ được hiển thị trên trang web của bạn.

Value of x is: 134217724

Lưu ý rằng phép dịch chuyển bit phải không dấu có thể tạo ra kết quả khá khác biệt với các giá trị số nguyên và phụ thuộc vào cách JavaScript xử lý nó.

Toán tử >>>= giúp thực hiện phép dịch chuyển bit phải không dấu và gán kết quả lại cho biến trong một dòng code.

The &= Operator.

Toán tử &= trong JavaScript được gọi là toán tử gán AND Bitwise (Bitwise AND Assignment Operator). Nó thực hiện phép AND bitwise (AND bit) giữa hai toán hạng và gán kết quả cho biến.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 100;
    x &= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Biến x ban đầu có giá trị là 100 và bạn sử dụng toán tử &= để thực hiện phép AND bitwise giữa x5. Kết quả của phép AND bitwise là 4 (bởi vì 100 & 5 bằng 4).

Sau đó, bạn sử dụng document.getElementById("demo").innerHTML để hiển thị giá trị của x trong phần tử có id là “demo”, và giá trị 4 sẽ được hiển thị trên trang web của bạn.

Phép AND bitwise (AND bit) thực hiện từng bit tương ứng của hai giá trị và chỉ giữ lại bit nào có giá trị 1 trong cả hai. Trong trường hợp này, kết quả là 1100100 & 0000101 = 0000100, tương đương với 4 trong hệ thập phân.

Value of x is: 4

Toán tử &= là một cách tiện lợi để thực hiện phép AND bitwise và gán kết quả cho biến trong một dòng code ngắn gọn.

The |= Operator.

Toán tử |= trong JavaScript được gọi là toán tử gán OR Bitwise (Bitwise OR Assignment Operator). Nó thực hiện phép OR bitwise (OR bit) giữa hai toán hạng và gán kết quả cho biến.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 100;
    x |= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Biến x ban đầu có giá trị là 100 và bạn sử dụng toán tử |= để thực hiện phép OR bitwise giữa x5. Kết quả của phép OR bitwise là 101 (bởi vì 100 | 5 bằng 101).

Sau đó, bạn sử dụng document.getElementById("demo").innerHTML để hiển thị giá trị của x trong phần tử có id là “demo” và giá trị 101 sẽ được hiển thị trên trang web của bạn.

Value of x is: 101

Phép OR bitwise (OR bit) thực hiện từng bit tương ứng của hai giá trị và chỉ cần một trong hai bit có giá trị 1, thì bit kết quả cũng sẽ là 1. Trong trường hợp này, kết quả là 1100100 | 0000101 = 1100101, tương đương với 101 trong hệ thập phân.

Toán tử |= là một cách tiện lợi để thực hiện phép OR bitwise và gán kết quả cho biến trong một dòng code ngắn gọn.

The ^= Operator.

Toán tử ^= trong JavaScript được gọi là toán tử gán XOR Bitwise (Bitwise XOR Assignment Operator). Nó thực hiện phép XOR bitwise (XOR bit) giữa hai toán hạng và gán kết quả cho biến.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 100;
    x ^= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Biến x ban đầu có giá trị là 100 và bạn sử dụng toán tử ^= để thực hiện phép XOR bitwise giữa x5. Kết quả của phép XOR bitwise là 97 (bởi vì 100 ^ 5 bằng 97).

Sau đó, bạn sử dụng document.getElementById("demo").innerHTML để hiển thị giá trị của x trong phần tử có id là “demo” và giá trị 97 sẽ được hiển thị trên trang web của bạn.

Phép XOR bitwise (XOR bit) thực hiện từng bit tương ứng của hai giá trị và chỉ giữ lại bit nào có giá trị 1 mà không phải là 1 trong cả hai. Trong trường hợp này, kết quả là 1100100 ^ 0000101 = 1100011, tương đương với 97 trong hệ thập phân.

Value of x is: 97

Toán tử ^= là một cách tiện lợi để thực hiện phép XOR bitwise và gán kết quả cho biến trong một dòng code ngắn gọn.

The &&= Operator.

Toán tử &&= trong JavaScript được gọi là toán tử gán Logical AND (Logical AND Assignment Operator). Nó được sử dụng để kiểm tra giá trị của hai toán hạng và gán giá trị của toán hạng thứ hai cho biến nếu toán hạng thứ nhất là true.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = 100;
    x &&= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Ở đây, biến x ban đầu có giá trị là 10. Toán tử &&= kiểm tra giá trị của biến x (toán hạng thứ nhất). Nếu giá trị của biến xtrue, thì giá trị của toán hạng thứ hai (5) sẽ được gán lại cho biến x.

Trong trường hợp này, giá trị ban đầu của biến x10, và JavaScript coi giá trị khác 0true. Vì vậy, biến x không bằng 0 và phép gán sẽ được thực hiện. Kết quả là biến x sẽ có giá trị là 5 sau phép gán.

Value of x is: 5

Toán tử &&= thường được sử dụng khi bạn muốn gán một giá trị cho biến dựa trên một điều kiện.

The ||= Operator.

Toán tử ||= trong JavaScript được gọi là Toán tử Gán Logical OR (Logical OR Assignment Operator). Nó được sử dụng để kiểm tra giá trị của hai toán hạng và gán giá trị của toán hạng thứ hai cho biến nếu toán hạng thứ nhất là false hoặc không tồn tại (falsy value).

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x = undefined;
    x ||= 5;
    document.getElementById("demo").innerHTML = "Value of x is: " + x;
    </script>
  </body>
</html>

Biến x ban đầu được gán giá trị undefined. Sau đó, bạn sử dụng toán tử ||= để kiểm tra giá trị của x. Vì giá trị của xundefined (falsy value), nên toán tử ||= sẽ thực hiện phép gán và gán giá trị 5 cho x.

Sau đó, bạn sử dụng document.getElementById("demo").innerHTML để hiển thị giá trị của x trong phần tử có id là “demo”. Và giá trị 5 sẽ được hiển thị trên trang web của bạn.

Value of x is: 5

Toán tử ||= được sử dụng để kiểm tra và gán giá trị một cách ngắn gọn dựa trên giá trị falsy của biến. Toán tử ||= thường được sử dụng khi bạn muốn gán một giá trị cho biến nếu biến đó có giá trị falsy.

The ??= Operator.

Toán tử ??= trong JavaScript được gọi là Toán tử Gán Nullish Coalescing (Nullish Coalescing Assignment Operator). Nó được sử dụng để kiểm tra giá trị của hai toán hạng và gán giá trị của toán hạng thứ hai cho biến nếu toán hạng thứ nhất là undefined hoặc null.

Dưới đây là một ví dụ:

<html>
  <body>
    <p id="demo"></p>
    <script>
    let x;
    document.getElementById("demo").innerHTML = x ??= 5; 
    </script>
  </body>
</html>

Ở đây, biến x ban đầu không được gán giá trị, nên giá trị của nó là undefined. Toán tử ??= kiểm tra giá trị của biến x (toán hạng thứ nhất). Nếu giá trị của biến xundefined hoặc null, thì giá trị của toán hạng thứ hai (5) sẽ được gán lại cho biến x.

Trong trường hợp này, giá trị ban đầu của biến xundefined và phép gán sẽ được thực hiện. Sau phép gán, giá trị của biến x sẽ là 5.

5

Toán tử ??= thường được sử dụng khi bạn muốn gán một giá trị cho biến nếu biến đó là undefined hoặc null và bạn muốn giữ nguyên giá trị của biến nếu nó đã có giá trị khác.

LEAVE A REPLY

Please enter your comment!
Please enter your name here

4,956FansLike
256FollowersFollow
223SubscribersSubscribe
spot_img

Related Stories