整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
數字的呈現方式決定了“整數”的安全值范圍遠遠小于 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小時內與您取得聯系。
