با عرض سلام و وقت بخیر خدمت کاربران سایت پی وی لرن ، در بخش قبلی به یکی از مهم ترین و پر کاربردترین انواع داده یعنی نوع داده ی Boolean در جاوا اسکریپت پرداختیم، همچنین گفتیم که بیشترین کاربرد این نوع در عبارات مقایسه ای و شرطی می باشد، در این بخش نیز قصد داریم به بررسی عملگرهای منطقی و مقایسه ای در جاوا اسکریپت پرداخته و شما را با عملکرد عملگرهای مقایسه و منطقی آشنا کنیم.
عملگرهای منطقی و مقایسه ای در جاوا اسکریپت معمولا در خروجی یکی از مقادیر true یا false را برمی گرداند.
عملگرهای مقایسه ای در عبارات منطقی برای تعیین برابری یا تفاوت بین متغیرها یا مقادیر استفاده می شوند.
با توجه به اینکه x = 5، جدول زیر عملگرهای مقایسه را توضیح می دهد:
عملگر | توضیحات | مقایسه | نتیجه |
---|---|---|---|
== | برابری | x == 8 | false |
x == 5 | true | ||
x == “5” | true | ||
=== | برابری مقدار و نوع | x === 5 | true |
x === “5” | false | ||
!= | نابرابر | x != 8 | true |
!== | نابرابری مقدار و نوع | x !== 5 | false |
x !== “5” | true | ||
x !== 8 | true | ||
> | بزرگتر از | x > 8 | false |
< | کوچگتر از | x < 8 | true |
>= | بزرگتر مساوی | x >= 8 | false |
<= | کوچکتر مساوی | x <= 8 | true |
مثال موارد جدول فوق :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 | <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x == 8):</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x == 8); </script> </body> </html> ------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x == 5):</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x == 5); </script> </body> </html> ------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x == 5):</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x == "5"); </script> </body> </html> -------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x === 5):</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x === 5); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x === "5").</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x === "5"); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x != 8).</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x != 8); </script> </body> </html> -------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x !== 5):</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x !== 5); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x !== "5"):</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x !== "5"); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x !== 8):</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x !== 8); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x > 8).</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x > 8); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x < 8).</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x < 8); </script> </body> </html> ----------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x >= 8).</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x >= 8); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>Assign 5 to x, and display the value of the comparison (x <= 8).</p> <p id="demo"></p> <script> var x = 5; document.getElementById("demo").innerHTML = (x <= 8); </script> </body> </html> |
عملگرهای مقایسه را می توان در عبارات شرطی برای مقایسه مقادیر استفاده کرد :
1 | if (age < 18) text = "Too young"; |
اپراتورهای منطقی برای تعیین منطق بین متغیرها یا مقادیر استفاده می شوند.
با توجه به اینکه x = 6 و y = 3، جدول زیر عملکرد اپراتورهای منطقی توضیح می دهد:
عملگر | توضیحات | مثال |
---|---|---|
&& | and | (x < 10 && y > 1) is true |
|| | or | (x == 5 || y == 5) is false |
! | not | !(x == y) is true |
مثال جدول فوق :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 | <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>The AND operator (&&) returns true if both expressions are true, otherwise it returns false.</p> <p id="demo"></p> <script> var x = 6; var y = 3; document.getElementById("demo").innerHTML = (x < 10 && y > 1) + "<br>" + (x < 10 && y < 1); </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>The OR operator (||) returns true if one or both expressions are true, otherwise it returns false.</p> <p id="demo"></p> <script> var x = 6; var y = 3; document.getElementById("demo").innerHTML = (x == 5 || y == 5) + "<br>" + (x == 6 || y == 0) + "<br>" + (x == 0 || y == 3) + "<br>" + (x == 6 || y == 3); </script> </body> </html> ---------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p>The NOT operator (!) returns true for false statements and false for true statements.</p> <p id="demo"></p> <script> var x = 6; var y = 3; document.getElementById("demo").innerHTML = !(x === y) + "<br>" + !(x > y); </script> </body> </html> |
جاوا اسکریپت همچنین شامل یک عملگر شرطی است که یک مقدار را به یک متغیر بر اساس برخی شرایط اختصاص می دهد.
سینتکس:
1 | variablename = (condition) ? value1:value2 |
مثال:
در مثال فوق اگر مقدار age کمتر از ۱۸ باشد، عبارت اول : “Too young” انتخاب می شود و در غیر این صورت عبارت دوم : “Old enough” انتخاب می شود.
مقایسه داده های انواع مختلف ممکن است نتایج غیر منتظره را به دست آورد.
هنگام مقایسه یک رشته با یک عدد، جاوا اسکریپت در هنگام مقایسه، رشته را به عدد تبدیل می کند.
یک رشته خالی به ۰ تبدیل می شود. یک رشته غیر عددی به NaN تبدیل می شود که همیشه اشتباه است.
عبارت | اجرا |
---|---|
۲ < 12 | true |
۲ < “12” | true |
۲ < “John” | false |
۲ > “John” | false |
۲ == “John” | false |
“۲” < “12” | false |
“۲” > “12” | true |
“۲” == “۱۲” | false |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 | <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = 2 < 12; </script> </body> </html> ----------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = 2 < "12"; </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = 2 < "John"; </script> </body> </html> ---------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = 2 > "John"; </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = 2 == "John"; </script> </body> </html> ---------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = "2" < "12"; </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = "2" > "12"; </script> </body> </html> --------------------------------------------------------------------------- <!DOCTYPE html> <html> <body> <h2>JavaScript Comparison</h2> <p id="demo"></p> <script> document.getElementById("demo").innerHTML = "2" == "12"; </script> </body> </html> |
هنگام مقایسه دو رشته، “۲” بزرگتر از “۱۲” خواهد بود، زیرا (بر اساس حروف الفبا) ۱ کمتر از ۲ است.
برای اطمینان از یک نتیجه مناسب، متغیرها قبل از مقایسه باید به نوع مناسب تبدیل شوند:
1 2 3 4 5 6 | age = Number(age); if (isNaN(age)) { voteable = "Input is not a number"; } else { voteable = (age < 18) ? "Too young" : "Old enough"; } |
همانطور که در بخش قبلی اشاره کردیم نوع پرکاربرد Boolean همیشه در عبارات مقایسه ای و شرطی استفاده می شود، از این رو در این بخش به بررسی عملگرهای منطقی و مقایسه ای در جاوا اسکریپت پرداختیم.
سینا
بابا راستی ازمایی برای کامنت چیه؟
مگه این سایت فارسی نیست؟
چرا داخل تمرینا با انگلیسی نوشتید
صادق
سلام. ما کد ها رو از منابع انگلیسی دریافت می کنیم و دلیلی نداره حتما متن های داخل کد هم به فارسی ترجمه بشه. در ضمن بعضی از ویرایشگر ها و کامپایلر ها هم از انکدینگ زبان فارسی پشتیبانی نمی کنند.