者:Daniel 譯者:半糖學前端 來源:js-craft
原文:http://www.js-craft.io/blog/the-double-negation-in-javascript/
JS 是一種靈活且輕量級的語言,這種特性讓我們經常覺得它是一門最簡單的語言,也是最難掌握的語言。雖然經常使用,但我仍然偶然發現一些我不知道的隱藏語法或技巧。
在處理錯誤時,我偶然發現了以下代碼。
return !!(this.isFirstOverall() || this.get('videoId')
我非常確定這是一個錯誤,這就是該錯誤的根源。否定否定沒有任何意義。
但是經過一番谷歌搜索后,我發現Javascript中存在諸如消極負數之類的問題。
簡而言之,其目的是將任何表達式轉換為實際的true/false布爾值,就像具有Boolean( insert_value_here.)。
例如下面的表達式:
const isIE8 = navigator.userAgent.match(/MSIE 8.0/);
console.log(isIE8);
這將記錄一個Array或null。是的,我們可以將其評估null為錯誤。實際上,更確切地說,null是一個錯誤的值。
但是,如果我們對此雙重否定:
const isIE8 = !!navigator.userAgent.match(/MSIE 8.0/);
console.log(isIE8);
實際的true/false布爾值將被輸出。
雙重否定!!是不實際的操作,如&&或||。它只是兩個否定!符號的序列。
第一個否定將數據(無論數據類型如何)轉換為布爾值,但值相反。第二個否定再次更改布爾值以提供實際結果。
// example - the long version
const x = {}; // truthy
const y = !x; // false
const z = !y; // true
// or by using the double negation
const x = {}; // truthy
const z = !!x; // true
好吧,這取決于您要弄清楚什么。當然,對于不知道這種雙重否定把戲的人(例如我)來說,實際的代碼看起來會很奇怪。
另一方面,它將為實際評估提供更清晰的價值。結果將是對還是錯。例如,您不必再懷疑一個空對象是true還是false。
const result = {};
if(result) {
// make something
}
如果本篇文章有任何錯誤和建議,歡迎留言,最后,謝謝大家的觀看。
我是@半糖學前端 ,一個前端從業者,專注前端技術領域分享,關注我和我一起學習,共同進步!
嘍,大家好啊,這里是雷工筆記,我是雷工。
數據類型比較常見,無論是對程序員,還是電氣工程師來說,都再熟悉不過了,這里跟著教程了解一下,主要看跟自己以往在其他PLC,C#,組態軟件中應用的有啥不同。
在計算機的世界就像黑客帝國中的超級計算機,其中的人、物其實都是虛擬的數據。
數據類型:用來在計算機中標記程序的運算規則的。
計算機程序可以處理海量的數據,為啥要給數據分類?
1、為了更加充分和高效的應用計算機內存。
2、為了更加方便程序猿合理的使用數據。
JavaScript中的數據類型整體分為兩大類:
1、基本數據類型;
2、引用數據類型(復雜類型);
數字型即我們小學中學到的數字,可以是整數、小數、正數、負數。
數字類型:只要變量的值是純數字,且沒有引號,那么當前變量就是數字類型。
相比其他組態軟件中分16位整型,雙整型,有符號,無符號,浮點數等類型要簡單些。
示例:
let age =20 //整數
let pi = 3.14 //小數
在JavaScript語言中正數、負數、小數等統稱為數字類型Number。
注意事項:
1、JavaScript語言屬于弱數據類型,變量到底屬于什么類型,需要等賦值后,才能確定。
2、Java語言屬于強數據類型,例如:int b=4;定義時就確認了,必須是整數。
1、數字類型在程序中可以有許多操作,例如,加+,減-,乘*、除/,等待,經常涉及運算。
運算涉及到算術運算符,也稱作數學運算符,主要包括加、減、乘、除、取余等。
2、說到計算就涉及計算的優先級,在JavaScript中的優先級和小學數學中的算術優先級一樣,都是先乘除,后加減,想改變加括號。
3、NaN代表一個計算錯誤。它是一個不正確的或者一個未定義的數學操作所得到的結果。
示例:
console.log('老師'-2) //NaN
NaN是粘性的。任何對NaN的操作都會返回NaN。
示例:
console.log(NaN +2) //NaN
1、通過單引號(‘’)、雙引號(“”)包裹的數據都叫字符串,單引號和雙引號沒有本質上的區別,推薦使用單引號。
示例:
let myName = '雷工筆記' //使用單引號
let name = “雷工” // 使用雙引號
let tel = '18712345678' // 看上去是數字,但是是引號包裹了,就是字符串。
let str = ‘ ’ // 這種是空字符串
2、注意事項:
2.1、無論單引號或是雙引號必須成對應用;
2.2、單引號/雙引號可以互相嵌套,但是不可以自己嵌套自己;
2.3、必要時可以使用轉義符\,輸出單引號或者雙引號。
3、拼接字符串
使用場景:+運算符,可以實現字符串的拼接。
使用口訣:數字相加,字符相連;
示例:
document.write(‘我是’+‘雷工筆記’) //我是雷工筆記
let myName = ‘高啟強’
let work = ‘賣魚’
document.write( myName + work) //高啟強賣魚
注意:
只要變量中有一個數據類型是字符串類型,那么在計算的時候遇到加號,則直接拼接字符串;
如果遇到除加號以外的符號,那么計算機先將字符串轉換為對應的數字,然后再計算,
4、模板字符串
4.1、應用場景
拼接字符串和變量
在沒有它之前,要拼接變量比較麻煩
示例:
document.write(‘哈嘍,大家好,我是’+name+‘!今年‘+age+歲’)
4.2、模板字符串語法
● ``(反引號)
●在模板字符串中通過${變量}獲取變量的值。
● 反引號在英文輸入模式下,鍵盤鍵Tab上面那個按鍵(1左邊那個按鍵)
● 內容拼接時,用${}包裹住變量。
示例:
document.write(`哈嘍,大家好,我是${name}!今年${name}歲`)
好像C#中也有類似的應用方法。
表示開關量,是或否時在計算機中對應的是布爾類型。
他有兩個固定的值,True與False,表示真時用true,表示假時用False。
true:代表正確的,條件成立的;
False:代表錯誤的,條件不成立的;
示例:
//雷工筆記有趣嘛?
let isFun = true
console.log(isFun)
7.1、未定義是比較特殊的類型,只有一個值undefined。
7.2、什么情況下出現?
只聲明變量,不賦值的情況下,變量的默認值為undefined,一般很少【直接】為某個變量賦值為undefined。
undefined值本身表示的含義未定義;
示例:
let name // 聲明變量但是未賦值
document.write(name) //輸出undefined
7.3、實例場景:
我們開發中經常聲明一個變量,等待傳送過來的數值。
如果我們不確定這個數據是否有傳遞過來,此時我們可以通過檢測這個變量是不是undefined,來確定是否有數據傳遞過來。
8.1、如果變量的值是null,那么變量的數據類型叫空類型,——對象類型。
JS中的null僅僅是一個表示“無”、“空”或“值未知”的特殊值。
示例:
let name=null
console.log(name) //null
8.2、null和undefined的區別:
● undefined表示木有賦值
● null 表示賦值了,但是內容為空
8.3、null實例場景:
官方說明:把null作為尚未創建的對象。
將來有個變量里面存放的是一個對象,但是對象還沒創建好,可以先給個null
以上為學習JavaScript基礎知識數據類型的相關筆記。
在前端開發中經常會遇到這樣一種需求,使用Javascript格式化數字進行輸出。最常見的是金額,比如人民幣最小表示單位為分,一般需要精確到小數點后兩位數字,而且整數位每隔三位數字需要用逗號隔開。
今天我們就一起來看看如何使用原生Javascript和開源類庫來實現這樣一種功能吧。
感興趣的可以自行去github上去看源碼,github地址為:
https://github.com/zhouxiongking/article-pages/blob/master/articles/formatNumber/formatNumber.js
Javascript
首先我們看看最簡單的實現方法,需要達到這樣的目的。
輸入一串數字或者字符串,最后返回格式化后的字符串,每隔3位用逗號分隔,通過四舍五入保留小數點后2兩位。
我們來分析下方法的實現過程。
替換掉原本傳入數據中可能出現的'$'和',',然后判斷是否為數字。
判斷傳入的數字是正數還是負數。
判斷小數位數的舍入性。
每隔三位,添加一個逗號。
重新拼接字符串,正負號+整數位+小數點+小數位
根據上述的分析過程,得到的代碼如下。
方法1
第二種實現方法可以選擇保留小數位數,它的做法如下。
將傳入的數字或者字符串轉化為float類型數據,并進行四舍五入
用小數點進行分割,并將整數位逆序
對于整數位,每隔三位添加一個逗號
再次進行逆序,得到正確的整數位后拼接小數位。
通過上述的分析,得到代碼如下。
方法2
方法3中,是一個最全面的實現,可以選擇向上,向下或者四舍五入來保留小數位數;同時可以選擇小數點符號和千分位符號。
為了讓方法的代碼看起來更清晰,將方法拆分成兩個function,每個function實現自己的功能。
第一個function作為入口函數,主要包含小數位的處理,千分位符號位的處理,以及最后返回結果的處理。
主function
第二個function的主要功能是根據傳入的參數對數字進行取整或者四舍五入。
第二個function
針對以上的方法,我們可以通過代碼測試。
測試結果
在這里也推薦兩款非常好用的用于格式化數字的開源庫Numeral.js和accounting.js,兩者都可以格式化貨幣,百分比,時間,幾個小數位數,千分位等等
Numeral.js的github地址為:
https://github.com/adamwdraper/Numeral-js
目前在Github上超過5K的star,而且呈現增長的趨勢。
accounting.js的github地址為:
https://github.com/openexchangerates/accounting.js
目前在github上有超過3K的star,可以說是非常受歡迎。
這里簡要介紹下Numeral.js的用法。
使用
在瀏覽器中使用,可以通過以下代碼去實現。
使用
格式化
通過給numeral傳遞數字,然后通過format方法進行數字的格式化。
格式化數字
數字格式化的規則如下。
數字格式化規則
其他的類似于貨幣,字節,百分數,時間,科學計數等的格式化規則大家可以去官網看看。
今天這篇文章主要講解了如何格式化數字成指定的格式,包括原生JS實現以及后面推薦的幾個開源類庫,希望能對大家有幫助。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。