参考手册
JAVASCRIPT 教程
JavaScript 字符串方法
JavaScript 数值方法

JavaScript 数字

JavaScript 只有一种数值类型。它并不区分整型和浮点型，所有数值都是以浮点型数值来表示的。所以写数值时带不带小数点均可。

JavaScript 数值

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>写 JavaScript 数值既可以带小数点，也可以不带：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 3.14;
  13. var y = 3;
  14. document.getElementById("demo").innerHTML = x + "<br>" + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

超大或超小的数可通过科学计数法来写：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>超大或超小的数可通过科学（指数）计数法来写：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 123e5;
  13. var y = 123e-5;
  14. document.getElementById("demo").innerHTML = x + "<br>" + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

JavaScript 数值始终是 64 位的浮点数

与许多其他编程语言不同，JavaScript 不会定义不同类型的数，比如整数、短的、长的、浮点的等等。

JavaScript 数值始终以双精度浮点数来存储，根据国际 IEEE 754 标准。

此格式用 64 位存储数值，其中 0 到 51 存储数字（片段），52 到 62 存储指数，63 位存储符号：

值(aka Fraction/Mantissa)指数符号
52 bits(0 - 51)11 bits (52 - 62)1 bit (63)

精度

整数（不使用指数或科学计数法）会被精确到 15 位。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>整数（不使用指数或科学计数法）会被精确到 15 位：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 999999999999999;
  13. var y = 9999999999999999;
  14. document.getElementById("demo").innerHTML = x + "<br>" + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

小数的最大数是 17 位，但是浮点的算数并不总是 100% 精准：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>浮点的算数并不总是 100% 精准：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 0.2 + 0.1;
  13. document.getElementById("demo").innerHTML = "0.2 + 0.1 = " + x;
  14. </script>
  16. </body>
  17. </html>
运行一下

可以间接使用乘除法有来解决上面的问题：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>浮点的算数并不总是 100% 精准：</p>
  9. <p id="demo1">
  11. <p>但是在使用乘法和除法是有用的：</p>
  13. <p id="demo2">
  15. <script>
  16. var x = 0.2 + 0.1;
  17. document.getElementById("demo1").innerHTML = "0.2 + 0.1 = " + x;
  18. var y = (0.2*10 + 0.1*10) / 10;
  19. document.getElementById("demo2").innerHTML = "0.2 + 0.1 = " + y;
  20. </script>
  22. </body>
  23. </html>
运行一下

数字和字符串相加

注意：JavaScript 的加法和级联（concatenation）都使用 + 运算符。

数字用加法。字符串用级联。

如果您对两个数相加，结果将是一个数：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>如果您对两个数相加，结果将是一个数：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 10;
  13. var y = 20;
  14. var z = x + y;
  15. document.getElementById("demo").innerHTML = z;
  16. </script>
  18. </body>
  19. </html>
运行一下

如果对两个字符串相加，结果将是一个字符串的级联：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>如果添加两个数字字符串，结果将是级联字符串：</p>
  9. <p id="demo">
  11. <script>
  12. var x = "10";
  13. var y = "20";
  14. var z = x + y;
  15. document.getElementById("demo").innerHTML = z;
  16. </script>
  18. </body>
  19. </html>
运行一下

如果您对一个数和一个字符串相加，结果也是字符串级联：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>如果数字和数字字符串相加，结果将是级联字符串：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 10;
  13. var y = "20";
  14. var z = x + y;
  15. document.getElementById("demo").innerHTML = z;
  16. </script>
  18. </body>
  19. </html>
运行一下

如果您对一个字符串和一个数字相加，结果也是字符串级联：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>如果数字字符串和数字相加，结果将是级联字符串：</p>
  9. <p id="demo">
  11. <script>
  12. var x = "10";
  13. var y = 20;
  14. document.getElementById("demo").innerHTML = "结果是：" + x + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

比如以下例子，认为结果应该是 30，但是由于是字符串加上数字，所以结果是级联字符串：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>比如以下例子，认为结果应该是 30，但是由于是字符串加上数字，所以结果是级联字符串：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 10;
  13. var y = 20;
  14. document.getElementById("demo").innerHTML = "结果是：" + x + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

再比如以下例子，是认为结果应该是 102030，但是 JavaScript 从左向右进行编译。 因为 x 和 y 都是数，10 + 20 将被相加。 因为 z 是字符串，30 + "30" 被级联。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>认为结果应该是 102030，但是 JavaScript 从左向右进行编译。 因为 x 和 y 都是数，10 + 20 将被相加。 因为 z 是字符串，30 + "30" 被级联：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 10;
  13. var y = 20;
  14. var z = "30";
  15. var result = x + y + z;
  16. document.getElementById("demo").innerHTML = result;
  17. </script>
  19. </body>
  20. </html>
运行一下

数字字符串

JavaScript 字符串可以拥有数字内容，在所有数字运算中，JavaScript 会尝试将字符串转换为数字：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>在相除时，JavaScript 会尝试把字符串转换为数字：</p>
  9. <p id="demo">
  11. <script>
  12. var x = "100";
  13. var y = "10";
  14. var z = x / y;
  15. document.getElementById("demo").innerHTML = z;
  16. </script>
  18. </body>
  19. </html>
运行一下

该例也将如此运行：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>在相乘时，JavaScript 会尝试把字符串转换为数字：</p>
  9. <p id="demo">
  11. <script>
  12. var x = "100";
  13. var y = "10";
  14. var z = x * y;
  15. document.getElementById("demo").innerHTML = z;
  16. </script>
  18. </body>
  19. </html>
运行一下

但是，在相加时，JavaScript 不会把字符串转换为数字。因为 JavaScript 会用 + 运算符对字符串进行级联。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>在相加时，JavaScript 不会把字符串转换为数字：</p>
  9. <p id="demo">
  11. <script>
  12. var x = "100";
  13. var y = "10";
  14. var z = x + y;
  15. document.getElementById("demo").innerHTML = z;
  16. </script>
  18. </body>
  19. </html>
运行一下

NaN - 非数值

NaN 属于 JavaScript 保留词，指示某个数不是合法数。

尝试用一个非数字字符串进行除法会得到 NaN（Not a Number）：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>用非数字字符串进行除法会得到 NaN（Not a Number）：</p>
  9. <p id="demo">
  11. <script>
  12. document.getElementById("demo").innerHTML = 100 / "Apple";
  13. </script>
  15. </body>
  16. </html>
运行一下

不过，假如字符串包含数值，则结果将是数：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>数字除以数字字符串将是数字：</p>
  9. <p id="demo">
  11. <script>
  12. document.getElementById("demo").innerHTML = 100 / "10";
  13. </script>
  15. </body>
  16. </html>
运行一下

您可使用全局 JavaScript 函数 isNaN() 来确定某个值是否是数值：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>您可使用全局 JavaScript 函数 isNaN() 来确定某个值是否是数值：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 100 / "Apple";
  13. document.getElementById("demo").innerHTML = isNaN(x);
  14. </script>
  16. </body>
  17. </html>
运行一下

注意: 假如您在数学运算中使用了 NaN，则结果也会是 NaN：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>假如您在数学运算中使用了 NaN，则结果也会是 NaN：</p>
  9. <p id="demo">
  11. <script>
  12. var x = NaN;
  13. var y = 5;
  14. document.getElementById("demo").innerHTML = x + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

结果也许是串连接：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>假如您在数学运算中使用了 NaN，则结果可能是级联：</p>
  9. <p id="demo">
  11. <script>
  12. var x = NaN;
  13. var y = "5";
  14. document.getElementById("demo").innerHTML = x + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

NaN 是数，typeof NaN 返回 number：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>NaN 是数，typeof NaN 返回 number：</p>
  9. <p id="demo">
  11. <script>
  12. var x = NaN;
  13. document.getElementById("demo").innerHTML = typeof x;
  14. </script>
  16. </body>
  17. </html>
运行一下

Infinity

Infinity（或 -Infinity）是 JavaScript 在计算数时超出最大可能数范围时返回的值。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>Infinity （或 -Infinity）是 JavaScript 在计算数时超出最大可能数范围时返回的值：</p>
  9. <p id="demo">
  11. <script>
  12. var myNumber = 2;
  13. var txt = "";
  14. while (myNumber != Infinity) {
  15.    myNumber = myNumber * myNumber;
  16.    txt = txt + myNumber + "<br>";
  17. }
  18. document.getElementById("demo").innerHTML = txt;
  19. </script>
  21. </body>
  22. </html>
运行一下

除以 0（零）也会生成 Infinity：

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>除以 0（零）也会生成 Infinity：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 2/0;
  13. var y = -2/0;
  14. document.getElementById("demo").innerHTML = x + "<br>" + y;
  15. </script>
  17. </body>
  18. </html>
运行一下

Infinity 是数：typeOf Infinity 返回 number。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>Infinity 是数字：</p>
  9. <p id="demo">
  11. <script>
  12. var x = Infinity;
  13. document.getElementById("demo").innerHTML = typeof x;
  14. </script>
  16. </body>
  17. </html>
运行一下

十六进制

JavaScript 会把前缀为 0x 的数值常量解释为十六进制。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>前缀为 0x 的数值常量会被解释为十六进制：</p>
  9. <p id="demo">
  11. <script>
  12. var x = 0xFF;
  13. document.getElementById("demo").innerHTML = "0xFF = " + x;
  14. </script>
  16. </body>
  17. </html>
运行一下

绝不要用前导零写数字（比如 07）。

一些 JavaScript 版本会把带有前导零的数解释为八进制。

默认地，Javascript 把数显示为十进制小数。

但是您能够使用 toString() 方法把数输出为十六进制、八进制或二进制。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>toString() 方法以基数 2 到 36 输出字符串：</p>
  9. <p id="demo">
  11. <script>
  12. var myNumber = 32;
  13. document.getElementById("demo").innerHTML =
  14. "32 = " + "<br>" +
  15. " Decimal " + myNumber.toString(10) + "<br>" +
  16. " Hexadecimal " + myNumber.toString(16) + "<br>" +
  17. " Octal " + myNumber.toString(8) + "<br>" +
  18. " Binary " + myNumber.toString(2);
  19. </script>
  21. </body>
  22. </html>
运行一下

数值可以是对象

通常 JavaScript 数值是通过字面量创建的原始值：var x = 123

但是也可以通过关键词 new 定义为对象：var y = new Number(123)

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>数字可以是对象，但是没有必要把数字创建为对象。</p>
  9. <p id="demo">
  11. <script>
  12. var x = 123;
  13. var y = new Number(123);
  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. <h1>JavaScript 数字</h1>
  7. <p>绝对不要把数字创建为对象。</p>
  9. <p>数字和对象无法安全地比较。</p>
  11. <p id="demo">
  13. <script>
  14. var x = 500;        // x 是数字
  15. var y = new Number(500);  // y 是对象
  16. document.getElementById("demo").innerHTML = (x==y);
  17. </script>
  19. </body>
  20. </html>
运行一下

当使用 === 相等运算符后，相等的数变为不相等，因为 === 运算符需要类型和值同时相等。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>绝对不要把数字创建为对象。</p>
  9. <p>数字和对象无法安全地比较。</p>
  11. <p id="demo">
  13. <script>
  14. var x = 500;        // x 是数字
  15. var y = new Number(500);  // y 是对象
  16. document.getElementById("demo").innerHTML = (x===y);
  17. </script>
  19. </body>
  20. </html>
运行一下

JavaScript 对象之间也无法进行比较。

  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  5. <h1>JavaScript 数字</h1>
  7. <p>绝对不要把数字创建为对象。</p>
  9. <p>数字和对象无法安全地比较。</p>
  11. <p id="demo">
  13. <script>
  14. var x = new Number(500);  // x 是对象
  15. var y = new Number(500);  // y 是对象
  16. document.getElementById("demo").innerHTML = (x==y);
  17. </script>
  19. </body>
  20. </html>
运行一下
JavaScript 字符串方法
JavaScript 数值方法

分类导航

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