整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
数字的呈现方式决定了“整数”的安全值范围远远小于 Number.MAX_VALUE。
能够被“安全”呈现的最大整数是 2^53 - 1，即 9007199254740991，在 ES6 中被定义为 Number.MAX_SAFE_INTEGER。最小整数是 -9007199254740991，在 ES6 中被定义为 Number. MIN_SAFE_INTEGER。
有时 JavaScript 程序需要处理一些比较大的数字，如数据库中的 64 位 ID 等。由于 JavaScript 的数字类型无法精确呈现 64 位数值，所以必须将它们保存（转换）为字符串。
好在大数值操作并不常见（它们的比较操作可以通过字符串来实现）。如果确实需要对大 数值进行数学运算，目前还是需要借助相关的工具库。将来 JavaScript 也许会加入对大数 值的支持。
要检测一个值是否是整数，可以使用 ES6 中的 Number.isInteger(..) 方法：
要检测一个值是否是安全的整数，可以使用 ES6 中的 Number.isSafeInteger(..) 方法：
虽然整数最大能够达到 53 位，但是有些数字操作（如数位操作）只适用于 32 位数字， 所以这些操作中数字的安全范围就要小很多，变成从 Math.pow(-2,31)（-2147483648， 约－21 亿）到 Math.pow(2,31) - 1（2147483647，约 21 亿）。
a | 0 可以将变量 a 中的数值转换为 32 位有符号整数，因为数位运算符 | 只适用于 32 位 整数（它只关心 32 位以内的值，其他的数位将被忽略）。因此与 0 进行操作即可截取 a 中 的 32 位数位。
篇文章给大家带来的内容是关于JavaScript中的number的详细介绍，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
声明：需要读者对二进制有一定的了解
对于 JavaScript 开发者来说，或多或少都遇到过 js 在处理数字上的奇怪现象，比如：
> 0.1 + 0.2
0.30000000000000004
> 0.1 + 1 - 1
0.10000000000000009
> 0.1 * 0.2
0.020000000000000004
> Math.pow(2, 53)
9007199254740992
> Math.pow(2, 53) + 1
9007199254740992
> Math.pow(2, 53) + 3
9007199254740996
如果想要弄明白为什么会出现这些奇怪现象，首先要弄清楚 JavaScript 是怎样编码数字的。
1. JavaScript 是怎样编码数字的
JavaScript 中的数字，不管是整数、小数、分数，还是正数、负数，全部是浮点数，都是用 8 个字节（64 位）来存储的。
一个数字（如 12、0.12、-999）在内存中占用 8 个字节（64 位），存储方式如下：
符号位很好理解，用于指明是正数还是负数，且只有 1 位、两种情况（0 表示正数，1 表示负数）。
其他两部分是分数部分和指数部分，用于计算一个数的绝对值。
1.1 绝对值计算公式
1: abs=1.f * 2 ^ (e - 1023) 0 < e < 2047
2: abs=0.f * 2 ^ (e - 1022) e=0, f > 0
3: abs=0 e=0, f=0
4: abs=NaN e=2047, f > 0
5: abs=∞ (infinity, 无穷大) e=2047, f=0
说明：
从上面的公式可以看出：
1.2 绝对值的取值范围与边界
从上面的公式可以看出：
1.2.1 0 < e < 2047
当 0 < e < 2047 时，取值范围为：f=0, e=1 到 f=11...11, e=2046（中间省略 48 个 1）
即：Math.pow(2, -1022) 到 ~=Math.pow(2, 1024) - 1（～=表示约等于）
这当中，~=Math.pow(2, 1024) - 1 就是 Number.MAX_VALUE 的值，js 所能表示的最大数值。
1.2.2 e=0, f > 0
当 e=0, f > 0 时，取值范围为：f=00...01, e=0（中间省略 48 个 0） 到 f=11...11, e=0（中间省略 48 个 1）
即：Math.pow(2, -1074) 到 ~=Math.pow(2, -1022)（～=表示约等于）
这当中，Math.pow(2, -1074) 就是 Number.MIN_VALUE 的值，js 所能表示的最小数值（绝对值）。
1.2.3 e=0, f=0
这只表示一个值 0，但加上符号位，所以有 +0 与 -0。
但在运算中：
> +0===-0
true
1.2.4 e=2047, f > 0
这只表示一种值 NaN。
但在运算中：
> NaN==NaN
false
> NaN===NaN
false
1.2.5 e=2047, f=0
这只表示一个值 ∞ (infinity, 无穷大)。
在运算中：
> Infinity===Infinity
true
> -Infinity===-Infinity
true
1.3 绝对值的最大安全值
从上面可以看出，8 个字节能存储的最大数值是 Number.MAX_VALUE 的值，也就是 ~=Math.pow(2, 1024) - 1。
但这个数值并不安全：从 1 到 Number.MAX_VALUE 中间的数字并不连续，而是离散的。
比如：Number.MAX_VALUE - 1, Number.MAX_VALUE - 2 等数值都无法用公式得出，就存储不了。
所以这里引出了最大安全值 Number.MAX_SAFE_INTEGER，也就是从 1 到 Number.MAX_SAFE_INTEGER 中间的数字都是连续的，处在这个范围内的数值计算都是安全的。
当 f=11...11, e=1075（中间省略 48 个 1）时，取得这个值 111...11（中间省略 48 个 1），即 Math.pow(2, 53) - 1。
大于 Number.MAX_SAFE_INTEGER：Math.pow(2, 53) - 1 的数值都是离散的。
比如：Math.pow(2, 53) + 1, Math.pow(2, 53) + 3 不能用公式得出，无法存储在内存中。
所以才会有文章开头的现象：
> Math.pow(2, 53)
9007199254740992
> Math.pow(2, 53) + 1
9007199254740992
> Math.pow(2, 53) + 3
9007199254740996
因为 Math.pow(2, 53) + 1 不能用公式得出，就无法存储在内存中，所以只有取最靠近这个数的、能够用公式得出的其他数，Math.pow(2, 53)，然后存储在内存中，这就是失真，即不安全。
1.4 小数的存储方式与计算
小数中，除了满足 m / (2 ^ n)（m, n 都是整数）的小数可以用完整的 2 进制表示之外，其他的都不能用完整的 2 进制表示，只能无限的逼近一个 2 进制小数。
（注：[2] 表示二进制，^ 表示 N 次方）
0.5=1 / 2=[2]0.1
0.875=7 / 8=1 / 2 + 1 / 4 + 1 / 8=[2]0.111
# 0.3 的逼近
0.25 ([2]0.01) < 0.3 < 0.5 ([2]0.10)
0.296875 ([2]0.0100110) < 0.3 < 0.3046875 ([2]0.0100111)
0.2998046875 ([2]0.01001100110) < 0.3 < 0.30029296875 ([2]0.01001100111)
... 根据公式计算，直到把分数部分的 52 位填满，然后取最靠近的数
0.3 的存储方式：[2]0.010011001100110011001100110011001100110011001100110011
(f=0011001100110011001100110011001100110011001100110011, e=1021)
从上面可以看出，小数中大部分都只是近似值，只有少部分是真实值，所以只有这少部分的值（满足 m / (2 ^ n) 的小数）可以直接比较大小，其他的都不能直接比较。
> 0.5 + 0.125===0.625
true
> 0.1 + 0.2===0.3
false
为了安全的比较两个小数，引入 Number.EPSILON [Math.pow(2, -52)] 来比较浮点数。
> Math.abs(0.1 + 0.2 - 0.3) < Number.EPSILON
true
1.5 小数最大保留位数
js 从内存中读取一个数时，最大保留 17 位有效数字。
> 0.010011001100110011001100110011001100110011001100110011
0.30000000000000000
0.3
> 0.010011001100110011001100110011001100110011001100110010
0.29999999999999993
> 0.010011001100110011001100110011001100110011001100110100
0.30000000000000004
> 0.0000010100011110101110000101000111101011100001010001111100
0.020000000000000004
2. Number 对象中的常量
2.1 Number.EPSILON
表示 1 与 Number 可表示的大于 1 的最小的浮点数之间的差值。
Math.pow(2, -52)
用于浮点数之间安全的比较大小。
2.2 Number.MAX_SAFE_INTEGER
绝对值的最大安全值。
Math.pow(2, 53) - 1
2.3 Number.MAX_VALUE
js 所能表示的最大数值（8 个字节能存储的最大数值）。
~=Math.pow(2, 1024) - 1
2.4 Number.MIN_SAFE_INTEGER
最小安全值（包括符号）。
-(Math.pow(2, 53) - 1)
2.5 Number.MIN_VALUE
js 所能表示的最小数值（绝对值）。
Math.pow(2, -1074)
2.6 Number.NEGATIVE_INFINITY
负无穷大。
-Infinity
2.7 Number.POSITIVE_INFINITY
正无穷大。
+Infinity
2.8 Number.NaN
非数字。
3. 寻找奇怪现象的原因
3.1 为什么 0.1 + 0.2 结果是 0.30000000000000004
与 0.3 的逼近算法类似。
0.1 的存储方式：[2]0.00011001100110011001100110011001100110011001100110011010
(f=1001100110011001100110011001100110011001100110011010, e=1019)
0.2 的存储方式：[2]0.0011001100110011001100110011001100110011001100110011010
(f=1001100110011001100110011001100110011001100110011010, e=1020)
0.1 + 0.2: 0.0100110011001100110011001100110011001100110011001100111
(f=00110011001100110011001100110011001100110011001100111, e=1021)
但 f=00110011001100110011001100110011001100110011001100111 有 53 位，超过了正常的 52 位，无法存储，所以取最近的数：
0.1 + 0.2: 0.010011001100110011001100110011001100110011001100110100
(f=0011001100110011001100110011001100110011001100110100, e=1021)
js 读取这个数字为 0.30000000000000004
3.2 为什么 Math.pow(2, 53) + 1 结果是 Math.pow(2, 53)
因为 Math.pow(2, 53) + 1 不能用公式得出，无法存储在内存中，所以只有取最靠近这个数的、能够用公式得出的其他数。
比这个数小的、最靠近的数：
Math.pow(2, 53)
(f=0000000000000000000000000000000000000000000000000000, e=1076)
比这个数大的、最靠近的数：
Math.pow(2, 53) + 2
(f=0000000000000000000000000000000000000000000000000001, e=1076)
取第一个数：Math.pow(2, 53)。
所以：
> Math.pow(2, 53) + 1===Math.pow(2, 53)
true
以上就是JavaScript中的number的详细介绍的详细内容，更多请关注其它相关文章！
更多技巧请《转发 + 关注》哦！
HTML 是一种描述网页语言， 指的是超文本标记语言 (Hyper Text Markup Language)。其中，超文本指的是网页上可以包含图片，视频，连接信息。标记也叫做标签，所以标签书写的是<内容>。语言就是一种交流工具，HTML 是用户与浏览器之间交互工具。
简单说，HTML 是由浏览器解析执行的，它不会将 HTML 标签展示出来，而是会解析 HTML 标签，以特定效果展示出来。
<html>
<head>HEAD</head>
<body>BODY</body>
</html>可以使用 JetBrains WebStorm 或者 VS Code 进行开发。
<html> 代表当前书写的是一个 HTML 文档
<head> 存储的本页面的一些重要的信息，它不会显示
标签下有一个子标签 <title> 它是用于定义页面的标题的
<body> 书写的内容会显示出来，属性：1. text 用于设置文字颜色；2. bgcolor 用于设置页面的背景色；3. background 用于设置页面的背景图片
<!-- 注释不会在浏览器中显示 -->
br 标签就是一个换行功能标签
在 p 标签中的内容会在开始与结束之间产生一个空白行并且它会自动换行
常用属性 align 的作用是设置段落中的内容对齐方式，可取值有 left right center
hr 标签会在页面上产生一个水平线
常用属性：
align：可取值有 left right center 代表水平线位置
size：代表水平线高度（厚度）
width：代表水平线宽度
color：水平线的颜色
两种方式:
Div 是一个块标签
Div 与 CSS 结合，会更好对页面进行排版
Span 标签也是一个块标签Div 与 span 区别：Div 会自动换行，我们也叫这样的标签为行级元素Span 标签它不会自动换行，我们也叫它为行内元素
Font 标签可以设置字体，字的大小及颜色
常用属性：
Face：用于设置字体，例如 宋体 隶书 楷体
Size：用于设置字的大小
Color：用于设置字的颜色
我们所看到的屏幕上所有的颜色都是由红、绿、蓝这三种基色调混合而成的。每一种颜色的饱和度和透明度都是可以变化的，用 0～255 的数值来表示。如纯红色表示为 (255，0，0)，十六进制表示为 #FF0000。按这种表达方式，理论上我们可以得到 256 * 256 *256=16777216 种颜色。
<h1> 最大 <h6> 最小，它们代表的是标题，可以使用 <b> <i> 对文字设置加粗或倾斜
注意：在 HTML 中允许标签进行嵌套的，但是一般都包裹嵌套，而不可以进行交叉嵌套
有序清单：
<!-- 有序列表 I II III-->
<ol type="I" start="3">
<li>张三</li>
<li>李四</li>
<li>王五</li>
</ol>
<!-- 无序列表 -->
<ul type="square">
<li>Java</li>
<li>Python</li>
<li>C#</li>
</ul><img> 可以让我们在网页引入一张图片
常用属性
<a> 标签可以实现跳转到其它页面操作。超链接内容不仅可以是文本，也可以是图片等信息
常用属性
<!-- 学习表格标签 -->
<table border="2" align="center" width="400px">
<caption>学生成绩单</caption>
<tr>
<th>姓名</th>
<th>语文成绩</th>
<th>数学成绩</th>
<td colspan="2" align="center"><b>操作</b></td>
</tr>
<tr align="center">
<td>张三</td>
<td>99</td>
<td>100</td>
<td>修改</td>
<td>删除</td>
</tr>
<tr align="center">
<td>李四</td>
<td>90</td>
<td>66</td>
<td>修改</td>
<td>删除</td>
</tr>
</table>通过表单可以将要提交的数据提交到指定的位置
<!-- 表单：用户注册案例 -->
<form name="form1" action="user/login" method="POST">
<table border="1" width="64%" align="center">
<tr>
<td>用户名：</td>
<td>
<input type="text" name="username">
</td>
</tr>
<tr>
<td>密码：</td>
<td>
<input type="password" name="password">
</td>
</tr>
<tr>
<td>性别：</td>
<td>
<input type="radio" name="sex" checked="checked">男
<input type="radio" name="sex" >女
</td>
</tr>
<tr>
<td>地址：</td>
<td>
<select name="province">
<option value="0">--请选择省--</option>
<option value="10001">广东</option>
<option value="10002">上海</option>
<option value="10003">山东</option>
</select> 省
<select name="city">
<option>--请选择市--</option>
<option value="1000301">广州市</option>
<option>深圳市</option>
<option>东莞市</option>
</select> 市
</td>
</tr>
<tr>
<td>编程语言：</td>
<td>
<input type="checkbox" name="language" checked="checked">Java
<input type="checkbox" name="language">Python
<input type="checkbox" name="language">Go
</td>
</tr>
<tr>
<td>照片：</td>
<td>
<input type="file" name="image">
</td>
</tr>
<tr>
<td>自我介绍：</td>
<td>
<textarea name="remark" rows="5" cols="100"></textarea>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="注册">
<input type="reset" value="取消">
</td>
</tr>
</table>
</form>通过框架标签可以定制 HTML 页面布局
在 HTML 页面上去描述框架信息时，不可以将 <frameset> 写在 <body> 标签中
framesetTest.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>HTML 框架标签</title>
</head>
<!-- rows 定义了三行：第一行 100 像素，第三行：100 像素；第二行：剩下的像素 -->
<frameset rows="100, * , 100">
<frame name="topModule" src="./top.html"></frame>
<frameset cols="100, * ">
<frame name="menuModule" src="./menu.html"></frame>
<frame name="contentModule" src="./content.html"></frame>
</frameset>
<frame name="footModule" src="./foot.html"></frame>
</frameset>
</html>top.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>top</title>
</head>
<body>
<div>头部信息</div>
</body>
</html>foot.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>footL</title>
</head>
<body>
<div>底部信息</div>
</body>
</html>menu.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>menu</title>
</head>
<body>
<div>菜单信息</div>
</body>
</html>content.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>content</title>
</head>
<body>
<div>内容显示区</div>
</body>
</html><meta> 标签必须写在 <head> 标签之间
使用 link 标签来导入 CSS
详情查看菜鸟教程：https://www.runoob.com/charsets/ref-html-ascii.html
DOM, Document Object Model -- 文档对象模型，是 HTML 和 XML 文档的编程接口，以树结构表达 HTML 文档。
DOM 是 W3C（万维网联盟）的标准。
DOM 定义了访问 HTML 和 XML 文档的标准。
W3C DOM 标准被分为 3 个不同的部分：
DOM 是被视为节点树的 HTML。
根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：
HTML DOM 将 HTML 文档视作树结构，这种结构被称为节点树。
节点树中的节点彼此拥有层级关系。常用父（parent）、子（child）和同胞（sibling）等术语来描述这些关系。父节点拥有子节点。同级的子节点被称为同胞（兄弟或姐妹）。
HTML DOM 方法是可以在节点（HTML 元素）上执行的动作。
HTML DOM 属性是可以在节点（HTML 元素）设置和修改的值。
可通过 JavaScript （以及其他编程语言）对 HTML DOM 进行访问。所有 HTML 元素被定义为对象，而编程接口则是对象方法和对象属性。方法是能够执行的动作（比如添加或修改元素）。属性是能够获取或设置的值（比如节点的名称或内容）。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>DOM</title>
</head>
<body>
<div id="div1">
<p id="p1">Hello</p>
<p id="p2">Hello</p>
</div>
<script>
// 先获取 P 元素
var element=document.getElementById("p1")
// 直接修改 p 元素的内容
element.innerHTML="此时已是修改后的内容"
// 修改 p2 标签的样式
var ele=document.getElementById("p2")
ele.style.color="blue"
ele.style.fontFamily="宋体"
ele.style.fontSize="larger"
// 添加元素
// 创建一个p元素
var elementP=document.createElement("p")
// 创建一个内容
var nodeText=document.createTextNode("新加的 P 元素")
// 把文字内容添加到p元素中
elementP.appendChild(nodeText)
// 把新创建的p元素添加div1元素中
var div1=document.getElementById("div1")
div1.appendChild(elementP)
// 插入添加新的元素
// 创建一个新的元素
var eleP=document.createElement("p")
// 创建一个内容
var noText=document.createTextNode("在 P1 元素前添加的新元素")
// 把文字内容添加到 p 元素中
eleP.appendChild(noText)
// 把新创建的 p 元素添加 div 1 元素中
var parentDiv1=document.getElementById("div1")
// 获取指定被添加的元素
var p1=document.getElementById("p1")
// 在元素前添加；参数说明：1.要添加的元素；2.在那个元素之前添加（指定一个元素）
parentDiv1.insertBefore(eleP, p1)
// 删除元素
// 获取父元素
var pdiv1=document.getElementById("div1")
var removep1=document.getElementById("p1")
// 使用父元素删除该元素
pdiv1.removeChild(removep1)
</script>
</body>
</html>HTML DOM 允许 JavaScript 对 HTML 事件作出反应。当事件发生时，可以执行 JavaScript，比如发生用户点击一个 HTML 元素的事件。
如需在用户点击某个元素时执行代码，可以把 JavaScript 代码添加到 HTML 事件属性中：onclick=JavaScript
HTML 事件的例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>DOM 事件</title>
<!-- JavaScript 代码必须写在 script 中 -->
<script>
function onLoadFun(){
alert("已载入...");
}
// 文本框失去焦点事件
function onBlurFun(){
alert("此方法是文本框失去焦点事件，用来校验此文本框输入数据的")
}
// 表单被提交时执行事件
function onSubmitFun(){
alert("此表单已提交，这个方法也可以来作为数据校验的");
}
// 元素被改变时触发事件
function onChangeFun(){
alert("文本框元素已输入新的数据")
}
// 当鼠标悬停在某一个元素上时执行的方法
function onMouseOverFun(element){
element.innerHTML="鼠标已停在H1元素上了"
}
// 当鼠标离开某一个元素时执行事件
function onMouseOutFun(element){
element.innerHTML="鼠标已离开H1元素上了..."
}
</script>
</head>
<!-- 需求：当页面被载入时，执行一个代码，弹框提示已载入 -->
<body onload="onLoadFun()">
<!-- 需求：在一个表单中有用户名录入的文本框，当输入完文本框的时候进行名称校验，提交的时候弹框显示 -->
<form onsubmit="onSubmitFun()">
用户名：<input id="username" name="username" onchange="onChangeFun()" >
<br/>
<button type="submit">提交</button>
</form>
<!-- 需求：有一个 H1 标签元素，当鼠标移动到 H1 元素上时，修改文字，当鼠标移出元素时执行事件 -->
<h1 onmouseover="onMouseOverFun(this)" onmouseout="onMouseOutFun(this)">我是一个标题</h1>
</body>
</html>想了解更多，欢迎关注我的微信公众号：Renda_Zhang
*请认真填写需求信息，我们会在24小时内与您取得联系。
