開發中,我們常常需要處理大量的數字計算,但是JavaScript中的數字類型有一個固有的問題,即它們的精度是有限的。當數字變得過大或過小時,就會出現精度丟失的問題。為了解決這個問題,一個很有用的庫就是bignumber.js。
bignumber.js是一個用于處理大數和小數的庫,它可以處理任意長度和精度的數字,支持所有的基本數學運算以及一些高級功能。在本文中,我們將對bignumber.js進行詳解。
bignumber.js可以通過npm或者直接引入到項目中。通過npm安裝:
npm install bignumber.js
使用bignumber.js創建一個大數對象非常簡單,可以使用Big或BigDecimal兩個類來創建。其中Big類用于處理任意精度的十進制數,而BigDecimal類用于處理任意精度的十進制數,同時支持小數點后的特定位數。
下面是一個使用Big類的示例:
const Big=require('bignumber.js');
const num=new Big(1234567890);
console.log(num.toString()); // 輸出:1234567890
在上面的示例中,我們首先引入了bignumber.js庫,然后使用Big類創建了一個大數對象,并調用了toString()方法將其轉換為字符串。
下面是一個使用BigDecimal類的示例:
const Big=require('bignumber.js');
const num=new Big.BigDecimal(1234567890, 10);
console.log(num.toString()); // 輸出:1.234567890E10
在上面的示例中,我們使用BigDecimal類創建了一個大數對象,并指定了小數點后的位數為10。 bignumber.js支持所有的基本數學運算,包括加減乘除和取余。
下面是一個使用加法運算的示例:
const Big=require('bignumber.js');
const num1=new Big(1234567890);
const num2=new Big(9876543210);
const sum=num1.add(num2);
console.log(sum.toString()); // 輸出:11111111110
在上面的示例中,我們使用add()方法對兩個大數進行相加操作。
除了基本的數學運算,bignumber.js還支持一些高級功能,例如比較大小、四舍五入和轉換進制等。下面是一個使用比較大小的示例:
const Big=require('bignumber.js');
const num1=new Big(1234567890);
const num2=new Big(9876543210);
const comparison=num1.comparedTo(num2);
console.log(comparison); // 輸出:-1
在上面的示例中,我們使用comparedTo()方法比較兩個大數的大小關系。
bignumber.js是一個功能強大且易于使用的庫,可以處理任意精度的數字計算。它支持所有的基本數學運算以及一些高級功能,可以解決JavaScript數字精度丟失的問題。如果你需要處理大數或小數的計算,那么bignumber.js將是一個不錯的選擇。
avaScript 數字
JavaScript 只有一種數值類型。
書寫數值時帶不帶小數點均可。
書寫 JavaScript 數值既可以帶小數點,也可以不帶:
var x=3.14; // 帶小數點的數值
var y=3; // 不帶小數點的數值
親自試一試
超大或超小的數可通過科學計數法來寫:
var x=123e5; // 12300000
var y=123e-5; // 0.00123
與許多其他編程語言不同,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 位。
var x=999999999999999; // x 將是 999999999999999
var y=9999999999999999; // y 將是 10000000000000000
小數的最大數是 17 位,但是浮點的算數并不總是 100% 精準:
var x=0.2 + 0.1; // x 將是 0.30000000000000004
使用乘除法有助于解決上面的問題:
var x=(0.2 * 10 + 0.1 * 10) / 10; // x 將是 0.3
親自試一試
JavaScript 的加法和級聯(concatenation)都使用 + 運算符。
數字用加法。字符串用級聯。
如果您對兩個數相加,結果將是一個數:
var x=10;
var y=20;
var z=x + y; // z 將是 30(一個數)
如果對兩個字符串相加,結果將是一個字符串的級聯:
var x="10";
var y="20";
var z=x + y; // z 將是 1020(字符串)
如果您對一個數和一個字符串相加,結果也是字符串級聯:
var x=10;
var y="20";
var z=x + y; // z 將是 1020(一個字符串)
如果您對一個字符串和一個數字相加,結果也是字符串級聯:
var x="10";
var y=20;
var z=x + y; // z 將是 1020(字符串)
常見的錯誤是認為結果應該是 30:
var x=10;
var y=20;
var z="The result is: " + x + y;
親自試一試
常見的錯誤是認為結果應該是 102030:
var x=10;
var y=20;
var z="30";
var result=x + y + z;
JavaScript 從左向右進行編譯。
因為 x 和 y 都是數,10 + 20 將被相加。
因為 z 是字符串,30 + "30" 被級聯。
JavaScript 字符串可以擁有數字內容:
var x=100; // x 是數字
var y="100"; // y 是字符串
在所有數字運算中,JavaScript 會嘗試將字符串轉換為數字:
該例如此運行:
var x="100";
var y="10";
var z=x / y; // z 將是 10
該例也將如此運行:
var x="100";
var y="10";
var z=x * y; // z 將是 1000
該例如此運行:
var x="100";
var y="10";
var z=x - y; // z 將是 90
但是該例不會如上例般運行:
var x="100";
var y="10";
var z=x + y; // z 不會是 110(而是 10010)
在最后一個例子中,JavaScript 用 + 運算符對字符串進行了級聯。
NaN 屬于 JavaScript 保留詞,指示某個數不是合法數。
嘗試用一個非數字字符串進行除法會得到 NaN(Not a Number):
var x=100 / "Apple"; // x 將是 NaN(Not a Number)
不過,假如字符串包含數值,則結果將是數:
var x=100 / "10"; // x 將是 10
您可使用全局 JavaScript 函數 isNaN() 來確定某個值是否是數:
var x=100 / "Apple";
isNaN(x); // 返回 true,因為 x 不是數
要小心 NaN。假如您在數學運算中使用了 NaN,則結果也將是 NaN:
var x=NaN;
var y=5;
var z=x + y; // z 將是 NaN
結果也許是串連接:
var x=NaN;
var y="5";
var z=x + y; // z 將是 NaN5
NaN 是數,typeof NaN 返回 number:
typeof NaN; // 返回 "number"
親自試一試
Infinity (或 -Infinity)是 JavaScript 在計算數時超出最大可能數范圍時返回的值。
var myNumber=2;
while (myNumber !=Infinity) { // 執行直到 Infinity
myNumber=myNumber * myNumber;
}
除以 0(零)也會生成 Infinity:
var x=2 / 0; // x 將是 Infinity
var y=-2 / 0; // y 將是 -Infinity
親自試一試
Infinity 是數:typeOf Infinity 返回 number。
typeof Infinity; // 返回 "number"
JavaScript 會把前綴為 0x 的數值常量解釋為十六進制。
var x=0xFF; // x 將是 255
絕不要用前導零寫數字(比如 07)。
一些 JavaScript 版本會把帶有前導零的數解釋為八進制。
默認地,Javascript 把數顯示為十進制小數。
但是您能夠使用 toString() 方法把數輸出為十六進制、八進制或二進制。
var myNumber=128;
myNumber.toString(16); // 返回 80
myNumber.toString(8); // 返回 200
myNumber.toString(2); // 返回 10000000
通常 JavaScript 數值是通過字面量創建的原始值:var x=123
但是也可以通過關鍵詞 new 定義為對象:var y=new Number(123)
var x=123;
var y=new Number(123);
// typeof x 返回 number
// typeof y 返回 object
請不要創建數值對象。這樣會拖慢執行速度。
new 關鍵詞使代碼復雜化,并產生某些無法預料的結果:
當使用==相等運算符時,相等的數看上去相等:
var x=500;
var y=new Number(500);
// (x==y) 為 true,因為 x 和 y 有相等的值
親自試一試 當使用===相等運算符后,相等的數變為不相等,因為===運算符需要類型和值同時相等。
var x=500;
var y=new Number(500);
// (x===y) 為 false,因為 x 和 y 的類型不同
甚至更糟。對象無法進行對比:
var x=new Number(500);
var y=new Number(500);
// (x==y) 為 false,因為對象無法比較
JavaScript 對象無法進行比較。
眾號【傳智播客博學谷】回復關鍵詞:前端 PS Java(100G) Python(80G) 大數據 區塊鏈 測試 PPT JS(40g+300教程) HTML 簡歷 領取相關學習資料!
一、HTML
1、<image>標簽上title屬性與alt屬性的區別是什么?
alt屬性是為了給那些不能看到你文檔中圖像的瀏覽者提供文字說明的。且長度必須少于100個英文字符或者用戶必須保證替換文字盡可能的短。
這包括那些使用本來就不支持圖像顯示或者圖像顯示被關閉的瀏覽器的用戶,視覺障礙的用戶和使用屏幕閱讀器的用戶等。
title屬性為設置該屬性的元素提供建議性的信息。使用title屬性提供非本質的額外信息。參考《alt和title屬性的區別及應用》
2、分別寫出以下幾個HTML標簽:文字加粗、下標、居中、字體
加粗:<b>、<strong>
下標:<sub>
居中:<center>
字體:<font>、<basefont>、參考《HTML標簽列表》
3、請寫出至少5個html5新增的標簽,并說明其語義和應用場景
section:定義文檔中的一個章節
nav:定義只包含導航鏈接的章節
header:定義頁面或章節的頭部。它經常包含 logo、頁面標題和導航性的目錄。
footer:定義頁面或章節的尾部。它經常包含版權信息、法律信息鏈接和反饋建議用的地址。
aside:定義和頁面內容關聯度較低的內容——如果被刪除,剩下的內容仍然很合理。
參考《HTML5 標簽列表》
4、請說說你對標簽語義化的理解?
a. 去掉或者丟失樣式的時候能夠讓頁面呈現出清晰的結構
b. 有利于SEO:和搜索引擎建立良好溝通,有助于爬蟲抓取更多的有效信息:爬蟲依賴于標簽來確定上下文和各個關鍵字的權重;
c. 方便其他設備解析(如屏幕閱讀器、盲人閱讀器、移動設備)以意義的方式來渲染網頁;
d. 便于團隊開發和維護,語義化更具可讀性,遵循W3C標準的團隊都遵循這個標準,可以減少差異化。
5、Doctype作用? 嚴格模式與混雜模式如何區分?它們有何意義?
聲明位于文檔中的最前面,處于 標簽之前。告知瀏覽器以何種模式來渲染文檔。
嚴格模式的排版和 JS 運作模式是,以該瀏覽器支持的最高標準運行。
在混雜模式中,頁面以寬松的向后兼容的方式顯示。模擬老式瀏覽器的行為以防止站點無法工作。
DOCTYPE不存在或格式不正確會導致文檔以混雜模式呈現。
6、你知道多少種Doctype文檔類型?
標簽可聲明三種 DTD 類型,分別表示嚴格版本、過渡版本以及基于框架的 HTML 文檔。
HTML 4.01 規定了三種文檔類型:Strict、Transitional 以及 Frameset。
XHTML 1.0 規定了三種 XML 文檔類型:Strict、Transitional 以及 Frameset。
Standards (標準)模式(也就是嚴格呈現模式)用于呈現遵循最新標準的網頁,
Quirks(包容)模式(也就是松散呈現模式或者兼容模式)用于呈現為傳統瀏覽器而設計的網頁。
7、HTML與XHTML——二者有什么區別
a. XHTML 元素必須被正確地嵌套。
b. XHTML 元素必須被關閉。
c. 標簽名必須用小寫字母。
d. XHTML 文檔必須擁有根元素。
參考《XHTML 與 HTML 之間的差異》
8、html5有哪些新特性、移除了那些元素?
a. HTML5 現在已經不是 SGML 的子集,主要是關于圖像,位置,存儲,多任務等功能的增加。
b. 拖拽釋放(Drag and drop) API
c. 語義化更好的內容標簽(header,nav,footer,aside,article,section)
d. 音頻、視頻API(audio,video)
e. 畫布(Canvas) API
f. 地理(Geolocation) API
g. 本地離線存儲 localStorage 長期存儲數據,瀏覽器關閉后數據不丟失
h. sessionStorage 的數據在頁面會話結束時會被清除
i. 表單控件,calendar、date、time、email、url、search
j. 新的技術webworker, websocket等
移除的元素:
a. 純表現的元素:basefont,big,center, s,strike,tt,u;
b. 對可用性產生負面影響的元素:frame,frameset,noframes;
9、iframe的優缺點?
優點:
a. 解決加載緩慢的第三方內容如圖標和廣告等的加載問題
b. iframe無刷新文件上傳
c. iframe跨域通信
缺點:
a. iframe會阻塞主頁面的Onload事件
b. 無法被一些搜索引擎索引到
c. 頁面會增加服務器的http請求
d. 會產生很多頁面,不容易管理。
參考《iframe的一些記錄》
10、Quirks模式是什么?它和Standards模式有什么區別?
在寫程序時我們也會經常遇到這樣的問題,如何保證原來的接口不變,又提供更強大的功能,尤其是新功能不兼容舊功能時。IE6以前的頁面大家都不會去寫DTD,所以IE6就假定 如果寫了DTD,就意味著這個頁面將采用對CSS支持更好的布局,而如果沒有,則采用兼容之前的布局方式。這就是Quirks模式(怪癖模式,詭異模式,怪異模式)。
區別:總體會有布局、樣式解析和腳本執行三個方面的區別。
a. 盒模型:在W3C標準中,如果設置一個元素的寬度和高度,指的是元素內容的寬度和高度,而在Quirks 模式下,IE的寬度和高度還包含了padding和border。
b. 設置行內元素的高寬:在Standards模式下,給等行內元素設置wdith和height都不會生效,而在quirks模式下,則會生效。
c. 設置百分比的高度:在standards模式下,一個元素的高度是由其包含的內容來決定的,如果父元素沒有設置百分比的高度,子元素設置一個百分比的高度是無效的用
d. 設置水平居中:使用margin:0 auto在standards模式下可以使元素水平居中,但在quirks模式下卻會失效。
11、請闡述table的缺點
a. 太深的嵌套,比如table>tr>td>h3,會導致搜索引擎讀取困難,而且,最直接的損失就是大大增加了冗余代碼量。
b. 靈活性差,比如要將tr設置border等屬性,是不行的,得通過td
c. 代碼臃腫,當在table中套用table的時候,閱讀代碼會顯得異常混亂
d. 混亂的colspan與rowspan,用來布局時,頻繁使用他們會造成整個文檔順序混亂。
e. 不夠語義
參考《為什么說table表格布局不好?》
12、簡述一下src與href的區別
src用于替換當前元素;href用于在當前文檔和引用資源之間確立聯系。
src是source的縮寫,指向外部資源的位置,指向的內容將會嵌入到文檔中當前標簽所在位置
href是Hypertext Reference的縮寫,指向網絡資源所在位置,建立和當前元素(錨點)或當前文檔(鏈接)之間的鏈接
公眾號【傳智播客博學谷】回復關鍵詞:前端 PS Java Python 大數據 區塊鏈 測試 PPT JS HTML 簡歷 領取相關學習資料!
*請認真填寫需求信息,我們會在24小時內與您取得聯系。