参考手册
JAVASCRIPT 教程
JavaScript 随机
JavaScript 比较

JavaScript 逻辑

JavaScript 布尔（逻辑）代表两个值之一：true 或 false。

布尔值

通常，在编程中，您会需要只能有两个值之一的数据类型，比如

  • YES / NO
  • ON / OFF
  • TRUE / FALSE

鉴于此，JavaScript 提供一种布尔数据类型。它只接受值 true 或 false。

Boolean() 函数

您可以使用 Boolean() 函数来确定表达式（或变量）是否为真：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 Boolean(10 > 9) 的值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   document.getElementById("demo").innerHTML = Boolean(10 > 9);
  14. }
  15. </script>
  17. </body>
  18. </html>
运行一下

或者甚至更简单：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 10 > 9 的值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   document.getElementById("demo").innerHTML = 10 > 9;
  14. }
  15. </script>
  17. </body>
  18. </html>
运行一下

比较和条件

JS 比较这一章列出了完整的比较运算符。

JS 条件这一章列出了完整的条件语句。

下面是一些例子：

运算符描述实例
==等于if (day == "Monday")
>大于if (salary > 9000)
<小于if (age < 18)

表达式的布尔值是 JavaScript 比较和条件的基础。

所有具有“真实”值的即为 True

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p id="demo">
  7. <script>
  8. var b1 = Boolean(100);
  9. var b2 = Boolean(3.14);
  10. var b3 = Boolean(-15);
  11. var b4 = Boolean("Hello");
  12. var b5 = Boolean('false');
  13. var b6 = Boolean(1 + 7 + 3.14);
  15. document.getElementById("demo").innerHTML =
  16. "100 是 " + b1 + "<br>" +
  17. "3.14 是 " + b2 + "<br>" +
  18. "-15 是 " + b3 + "<br>" +
  19. "任何（非空）字符串是 " + b4 + "<br>" +
  20. "即使字符串 'false' 也是 " + b5 + "<br>" +
  21. "任何表达式（除了零）是 " + b6;
  22. </script>
  24. </body>
  25. </html>
运行一下

所有不具有“真实”值的即为 False

0（零）的布尔值为 false：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 0 的布尔值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   var x = 0;
  14.   document.getElementById("demo").innerHTML = Boolean(x);
  15. }
  16. </script>
  18. </body>
  19. </html>
运行一下

-0 （负零）的布尔值为 false：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 -0 的布尔值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   var x = -0;
  14.   document.getElementById("demo").innerHTML = Boolean(x);
  15. }
  16. </script>
  18. </body>
  19. </html>
运行一下

""（空值）的布尔值为 false：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 "" 的布尔值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   var x = "";
  14.   document.getElementById("demo").innerHTML = Boolean(x);
  15. }
  16. </script>
  18. </body>
  19. </html>
运行一下

undefined 的布尔值是 false：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 undefined 的布尔值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   var x;
  14.   document.getElementById("demo").innerHTML = Boolean(x);
  15. }
  16. </script>
  18. </body>
  19. </html>
运行一下

null 的布尔值是 false：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 null 的布尔值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   var x = null;
  14.   document.getElementById("demo").innerHTML = Boolean(x);
  15. }
  16. </script>
  18. </body>
  19. </html>
运行一下

false 的布尔值（正如您猜到的）是 false：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 false 的布尔值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   var x = false;
  14.   document.getElementById("demo").innerHTML = Boolean(x);
  15. }
  16. </script>
  18. </body>
  19. </html>
运行一下

NaN 的布尔值是 false：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>显示 NaN 的布尔值：</p>
  7. <button onclick="myFunction()">试一试</button>
  9. <p id="demo">
  11. <script>
  12. function myFunction() {
  13.   var x = 10 / "H";
  14.   document.getElementById("demo").innerHTML = Boolean(x);
  15. }
  16. </script>
  18. </body>
  19. </html>
运行一下

布尔可以是对象

通常 JavaScript 布尔是由字面量创建的原始值：

  1. var x = false

但是布尔也可以通过关键词 new 作为对象来定义：

  1. var y = new Boolean(false)
实例
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>永远不要将布尔值创建为对象。</p>
  7. <p>无法安全地比较布尔和对象。</p>
  9. <p id="demo">
  11. <script>
  12. var x = false;         // x 是布尔值
  13. var y = new Boolean(false);  // y 是对象
  14. document.getElementById("demo").innerHTML = typeof x + "<br>" + typeof y;
  15. </script>
  17. </body>
  18. </html>
运行一下

不要创建布尔对象。它会拖慢执行速度。

new 关键词会使代码复杂化，并产生某些意想不到的结果：

当使用 == 运算符时，相等的布尔是相等的：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>永远不要将布尔值创建为对象。</p>
  7. <p>无法安全地比较布尔和对象。</p>
  9. <p id="demo">
  11. <script>
  12. var x = false;         // x 是布尔值
  13. var y = new Boolean(false);  // y 是对象
  14. document.getElementById("demo").innerHTML = (x==y);
  15. </script>
  17. </body>
  18. </html>
运行一下

当使用 === 运算符时，相等的布尔是不相等的，因为 === 运算符需要在类型和值两方面同时相等。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>永远不要将布尔值创建为对象。</p>
  7. <p>无法安全地比较布尔和对象。</p>
  9. <p id="demo">
  11. <script>
  12. var x = false;         // x 是数字
  13. var y = new Boolean(false);  // y 是对象
  14. document.getElementById("demo").innerHTML = (x===y);
  15. </script>
  17. </body>
  18. </html>
运行一下

或者甚至更糟。对象无法进行比较：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <p>永远不要将布尔值创建为对象。</p>
  7. <p>无法安全地比较布尔和对象。</p>
  9. <p id="demo">
  11. <script>
  12. var x = new Boolean(false);  // x 是对象
  13. var y = new Boolean(false);  // y 是对象
  14. document.getElementById("demo").innerHTML = (x==y);
  15. </script>
  17. </body>
  18. </html>
运行一下

比较两个 JavaScript 对象将始终返回 false。

完整的布尔参考手册

如需完整的参考手册，请访问本站的 JavaScript 布尔参考手册。参考手册包含有关所有布尔属性和方法的描述和实例。

JavaScript 随机
JavaScript 比较

分类导航

HTMLHTML5JAVASCRIPTCSSjQueryBootstrap 3 教程SassReactHTMl 颜色教程JSONXMLXPathTypeScriptAppML 教程XLinkXPointerXQueryXFormsXsltXML SchemaXSL-FOWeb ServiceWSDSOAPW3CSVGDHTMLTCP/IPjQuery Mobile 教程XHTML