Hôm nay bạn hãy cùng mình sẽ đi tìm hiểu khái niệm cũng như cách sử dụng toán tử so sánh và logic của ngôn ngữ lập trình Javascript trong trang web nhé.
Toán Tử So Sánh Trong Javascript
Toán tử so sánh giúp chúng ta so sánh giá trị giữa các biến hay giá trị trong Javascript. Sau đây mình sẽ có một bảng liệt kê các toán tử so sánh hay sử dụng trong Javascript, bạn có thể xem ở bên dưới nhé:
| Toán Tử So Sánh | Ý nghĩa |
|---|---|
| < | nhỏ hơn |
| > | lớn hơn |
| <= | nhỏ hơn hoặc bằng |
| >= | lớn hơn hoặc bằng |
| == | bằng |
| != | không bằng |
Toán Tử So Sánh Trả Về Giá Trị Boolean:
Khi chúng ta thực hiện biểu thức với toán tử so sánh thì giá trị trả về là Boolean với hai giá trị là true(đúng) và false(sai). Để hiểu rõ hơn bạn xem ví dụ sau đây nhé:
console.log(2 > 1); /*kết quả: true (đúng)*/
console.log(3 == 4); /* Kết quả false (sai)*/
console.log(3 != 4); /* Kết quả: true (đúng)*/Kết quả của toán tử, chúng ta cũng có thể gán nó vào biến như ví dụ ở dưới đây nhé:
let ketQua = 5 < 6;
console.log(ketQua); // Kết quả: trueSo sánh Chuỗi
Cách thực hiện so sánh chuỗi là Javascript sẽ đi so sánh từng thành phần của hai chuỗi với nhau. Để hiểu rõ hơn bạn xem ví dụ sau đây nhé:
console.log('N' > 'A'); /* Kết quả: true*/
console.log('Xin' > 'Xe');/* Kết quả: true*/
console.log('Bee' > 'Be'); /* Kết quả: true*/Mình sẽ giải thích cách so sánh chuỗi như sau:
- So sánh kí tự đầu tiên của hai chuỗi với nhau.
- Nếu kí tự đầu tiên của chuỗi thứ nhất lớn hơn hay nhỏ hơn ký tự đầu tiên của chuỗi thứ hai trong bảng mã ký tự, thì nó sẽ quyết định là chuỗi thứ nhất sẽ lớn hơn hay nhỏ hơn chuỗi thứ hai. Toán tử so sánh chuỗi đến đây là xong. Bạn nhấp vào nút phía dưới để xem bảng mã ký tự nhé.
32 64 @ 96 ` 128 € 160 192 À 224 à 33 ! 65 A 97 a 129 161 ¡ 193 Á 225 á 34 " 66 B 98 b 130 ‚ 162 ¢ 194  226 â 35 # 67 C 99 c 131 ƒ 163 £ 195 à 227 ã 36 $ 68 D 100 d 132 „ 164 ¤ 196 Ä 228 ä 37 % 69 E 101 e 133 … 165 ¥ 197 Å 229 å 38 & 70 F 102 f 134 † 166 ¦ 198 Æ 230 æ 39 ' 71 G 103 g 135 ‡ 167 § 199 Ç 231 ç 40 ( 72 H 104 h 136 ˆ 168 ¨ 200 È 232 è 41 ) 73 I 105 i 137 ‰ 169 © 201 É 233 é 42 * 74 J 106 j 138 Š 170 ª 202 Ê 234 ê 43 + 75 K 107 k 139 ‹ 171 « 203 Ë 235 ë 44 , 76 L 108 l 140 Œ 172 ¬ 204 Ì 236 ì 45 - 77 M 109 m 141 173 205 Í 237 í 46 . 78 N 110 n 142 Ž 174 ® 206 Î 238 î 47 / 79 O 111 o 143 175 ¯ 207 Ï 239 ï 48 0 80 P 112 p 144 176 ° 208 Ð 240 ð 49 1 81 Q 113 q 145 ‘ 177 ± 209 Ñ 241 ñ 50 2 82 R 114 r 146 ’ 178 ² 210 Ò 242 ò 51 3 83 S 115 s 147 “ 179 ³ 211 Ó 243 ó 52 4 84 T 116 t 148 ” 180 ´ 212 Ô 244 ô 53 5 85 U 117 u 149 • 181 µ 213 Õ 245 õ 54 6 86 V 118 v 150 – 182 ¶ 214 Ö 246 ö 55 7 87 W 119 w 151 — 183 · 215 × 247 ÷ 56 8 88 X 120 x 152 ˜ 184 ¸ 216 Ø 248 ø 57 9 89 Y 121 y 153 ™ 185 ¹ 217 Ù 249 ù 58 : 90 Z 122 z 154 š 186 º 218 Ú 250 ú 59 ; 91 [ 123 { 155 › 187 » 219 Û 251 û 60 < 92 124 | 156 œ 188 ¼ 220 Ü 252 ü 61 = 93 ] 125 } 157 189 ½ 221 Ý 253 ý 62 > 94 ^ 126 ~ 158 ž 190 ¾ 222 Þ 254 þ 63 ? 95 _ 127 159 Ÿ 191 ¿ 223 ß 255 ÿ - Nếu hai kí tự đầu tiên giống nhau thì nó sẽ tiếp tục so sánh như trên đối với các ký tự còn lại giữa hai chuỗi.
Ví dụ như ta so sánh giữa hai chuỗi Xin và Xe:
- So sánh kí tự đầu tiên của hai chuỗi đều giống nhau là ký tự
X. - Tiếp đến nó sẽ so sánh vị trí trong mã ký tự của
itrong chuỗi thứ nhất vàetrong chuỗi thứ hai. - Với vị trí của
itrong mã ký tự là 137 và vị trí của ký tựetrong mã ký tự là 133. - Vậy kết quả biếu thức của
'Xin' > 'Xe'trả về true(đúng).
Chú ý:
Có điều quan trọng bạn cần lưu ý là toán tử so sánh chuỗi thì nó sẽ phân biệt rõ ràng giữa chữ in hoa và chữ in thường. Ví dụ như ta so sánh a và A thì a sẽ lớn hơn bởi ví trí mã ký tự của nó lớn hơn. Bạn có thể tham khảo bảng ký tự mã ở trên nhé.
So sánh Các Kiểu Dữ Liệu Khác Nhau:
Khi so sánh giá trị giữa các kiểu dữ liệu khác nhau thì Javascript sẽ chuyển đổi giá trị sang kiểu số để so sánh. Để hiểu rõ hơn bạn xem ví dụ sau đây nhé:
console.log('2' > 1); /* Kết quả: true */
console.log('01' == 1);/* Kết quả: true */ Như bạn thấy ở ví dụ trên thì kiểu chuỗi '2' và '01' được chuyển sang kiểu số để so sánh.
Toán tử so sánh === và !==
Vậy tại sao chúng ta đã có toán tử so sánh == rồi tại sao phải sử dụng thêm toán tử so sánh ===?
Đôi khi toán tử so sánh == thực hiện không đúng ý của chúng ta ví dụ như là:
console.log( 0 == false ); //Kết quả: true Lý do là như phần ở trên mình đã giải thích là nó sẽ chuyển giá trị Boolean thành kiểu số tức là false thành 0 nên nó trả về kết quả true. Vậy có cách nào để so sánh hai giá trị này?
Ở đây ta phải sử dụng toán tử so sánh ===. Tác dụng của nó là so sánh nghiêm ngặt hơn tức là khi chúng ta so sánh hai giá trị với kiểu dữ liệu khác nhau thì nó sẽ ngay lập tức trả về giá trị false. Dưới đây mình sẽ có thêm một ví dụ minh họa nữa để giúp bạn dễ hiểu hơn:
console.log('10' == 10); /*Kết quả: true*/
console.log('10' === 10); /*Kết quả: false*/ Cách sử dụng toán tử so sánh !== và != thì cũng như ở trên nhé.
So sánh null và undefined
Đây là những kiểu dữ liệu đặc biệt nên mình muốn bạn tham khảo thêm khi ta so sánh những kiểu dữ liệu này với nhau. Bạn có thể tham khảo về các kiểu dữ liệu này ở đây nhé: null và undefined. Chúng ta thử sử dụng === để so sánh thử hai kiểu dữ liệu này nhé:
console.log(null === undefined); // Kết quả: false. Chúng ta tiếp tục thử so sánh với toán tử == ở ví dụ bên dưới xem sao nhé:
console.log(null == undefined); // Kết quả: true.So sánh NaN với các kiểu dữ liệu khác
Ở dưới đây mình có một vài ví dụ bên dưới giúp bạn hiểu hơn về NaN với các kiểu dữ liệu khác:
console.log(NaN == 1); /*Kết quả: false*/
console.log(NaN == NaN); /*Kết quả: false*/
console.log(NaN != 1); /*Kết quả: true*/
console.log(NaN != NaN); /*Kết quả: true*/
Toán Tử Logic Trong Javascript
Đây có thể xem là toán tử quan trọng trong Javascript bởi vì nó cho phép chúng ta có thể so sánh các biến với nhau và thực hiện hành động nào đó dựa vào giá trị trả về.
Ví dụ, nếu kết quả trả về là true thì chúng ta sẽ thực thi đoạn mã mình muốn còn nếu false thì chúng ta sẽ thực thi đoạn mã khác.
Javascript cung cấp cho chúng ta ba loại toán tử logic cơ bản:
!(KHÔNG)||(HOẶC)&&(VÀ)
Toán tử logic ! (KHÔNG)
Sử dụng dấu ! để biểu diễn toán tử logic KHÔNG và có thế áp dụng dung cho nhiều kiểu dữ liệu khác nhau. Để hiểu rõ hơn bạn xem cú pháp của nó bên dưới nhé:
ketQua = !giaTri;Toán tử này chỉ áp dụng cho một số hạng duy nhất và bạn xem bên dưới để hiểu cách nó hoạt động nhé:
- Chuyển đối số hạng thành kiểu dữ liệu Boolean: true hoặc false.
- Sau đó trả về giá trị nghịch đảo.
Để hiểu rõ hơn bạn xem ví dụ sau đây nhé:
console.log(!true); /*Kết quả: false*/
console.log(!0); /*Kết quả: true*/Dưới đây mình có liệt kê đầy đủ các loại kiểu dữ liệu khi sử dụng toán tử này để bạn có thể tham khảo thêm:
console.log(!undefined); /*true*/
console.log(!null); /*true*/
console.log(!20); /*false*/
console.log(!0); /*true*/
console.log(!NaN); /*true*/
console.log(!''); /*true*/
console.log(!'OK'); /*false*/
console.log(!false); /*true*/
console.log(!true); /*false*/
Toán tử logic || (HOẶC)
Chúng ta sẽ có cú pháp như sau:
ketQua = a || b; Toán tử logic || sẽ trả về giá trị true nếu a hoặc b có giá trị true. Để nắm rõ hơn bạn xem bảng phía dưới đây nhé:
| a | b | a || b |
|---|---|---|
| true | true | true |
| true | false | true |
| false | true | true |
| false | false | false |
Như vậy bạn thấy chỉ có một trường hợp false khi giá trị Boolean của a và b đều false. Bây giờ chúng ta thử đi vào ví dụ xem sao nhé:
console.log(true || false); // Kết quả: true Giá trị trả về của toán tử || sẽ giữ nguyên kiểu dữ liệu ban đầu trước khi được chuyển sang kiểu boolean để thực hiện logic. Mình sẽ thực hiện một ví dụ bên dưới để bạn nắm rõ hơn nhé:
console.log(false || 'Meo'); // Kết quả: 'Meo' Chúng ta có thể sử dụng một biểu thức với nhiều toán tử || với nhau theo cú pháp dưới đây:
ketQua = giá trị 1 || giá trị 2 || giá trị 3 Thì toán tử || sẽ thực hiện theo các bước sau đây:
- Thực hiện từ trái sang phải.
- Với mỗi giá trị trong biểu thức sẽ chuyển đổi thành kiểu boolean. Nếu kết quả là đúng thì dừng lại và trả về giá trị trước khi được chuyển đổi sang kiểu boolean.
- Nếu tất cả giá trị trong biểu thức đều sai thì trả về giá trị cuối cùng.
Để dễ hiểu hơn bạn xem ví dụ sau đây nhé:
let khachHang1 = "Quan";
let khachHang2 = null;
let khachHang = khachHang1 || khachHang2 || "khachHangAnDanh";
console.log(khachHang); // Kết quả : "Quan"Toán tử logic && (VÀ)
Bạn xem trước cú pháp của toán tử này ở bên dưới nhé:
ketQua = a && b; Toán tử logic && sẽ có giá trị false nếu một trong a hoặc b có giá trị false. Để hiể rõ hơn bạn xem bảng sau đây nhé:
| a | b | a & b |
|---|---|---|
| true | true | true |
| true | false | false |
| false | true | false |
| false | false | false |
Ta sẽ đi vào ví dụ bên dưới để rõ hơn nhé:
console.log(true && false); // Kết quả: false Chúng ta có thể sử dụng một biểu thức với nhiều toán tử && với nhau theo cú pháp dưới đây:
ketQua = giá trị 1 && giá trị 2 && giá trị 3 Thì toán tử && sẽ thực hiện theo các bước sau đây:
- Thực hiện từ trái sang phải.
- Với mỗi giá trị trong biểu thức sẽ chuyển đổi thành kiểu boolean. Nếu kết quả là sai thì dừng lại và trả về giá trị trước khi được chuyển đổi sang kiểu boolean.
- Nếu tất cả giá trị trong biểu thức đều đúng thì trả về giá trị cuối cùng.
Để dễ hiểu hơn chúng ta hãy cùng nhau đi tìm hiểu thông qua ví dụ nhé:
console.log(1 && 2 && null && 3); /*Kết quả: null*/
console.log(1 && 2 && 3); /*Kết quả: 3*/Tổng kết:
Qua đây mình mong bài viết sẽ giúp bạn hiểu được khái niệm cũng như cách sử dụng toán tử so sánh và logic 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ẻ!