資訊專欄INFORMATION COLUMN
本文主要介紹一些JS中用到的小技巧，可以在日常Coding中提升幸福度，將不定期更新~
1. 類型強(qiáng)制轉(zhuǎn)換 1.1 string強(qiáng)制轉(zhuǎn)換為數(shù)字可以用*1來(lái)轉(zhuǎn)化為數(shù)字(實(shí)際上是調(diào)用.valueOf方法)
然后使用Number.isNaN來(lái)判斷是否為NaN，或者使用 a !== a 來(lái)判斷是否為NaN，因?yàn)?NaN !== NaN
"32" * 1 // 32
"ds" * 1 // NaN
null * 1 // 0
undefined * 1 // NaN
1 * { valueOf: ()=>"3" } // 3
常用：也可以使用+來(lái)轉(zhuǎn)化字符串為數(shù)字
+ "123" // 123
+ "ds" // NaN
+ "" // 0
+ null // 0
+ undefined // NaN
+ { valueOf: ()=>"3" } // 3
1.2 object強(qiáng)制轉(zhuǎn)化為string
可以使用 字符串+Object 的方式來(lái)轉(zhuǎn)化對(duì)象為字符串(實(shí)際上是調(diào)用 .toString() 方法)
"the Math object:" + Math // "the Math object:[object Math]" "the JSON object:" + JSON // "the JSON object:[object JSON]"
當(dāng)然也可以覆蓋對(duì)象的toString和valueOf方法來(lái)自定義對(duì)象的類型轉(zhuǎn)換：
2 * { valueOf: ()=>"3" } // 6
"J" + { toString: ()=>"S" } // "JS"
《Effective JavaScript》P11：當(dāng)+用在連接字符串時(shí)，當(dāng)一個(gè)對(duì)象既有toString方法又有valueOf方法時(shí)候，JS通過(guò)盲目使用valueOf方法來(lái)解決這種含糊。
對(duì)象通過(guò)valueOf方法強(qiáng)制轉(zhuǎn)換為數(shù)字，通過(guò)toString方法強(qiáng)制轉(zhuǎn)換為字符串
"" + {toString:()=>"S",valueOf:()=>"J"} // J
1.3 使用Boolean過(guò)濾數(shù)組中的所有假值
我們知道JS中有一些假值：false，null，0，""，undefined，NaN，怎樣把數(shù)組中的假值快速過(guò)濾呢，可以使用Boolean構(gòu)造函數(shù)來(lái)進(jìn)行一次轉(zhuǎn)換
const compact = arr => arr.filter(Boolean) compact([0, 1, false, 2, "", 3, "a", "e" * 23, NaN, "s", 34]) // [ 1, 2, 3, "a", "s", 34 ]1.4 雙位運(yùn)算符 ~~
可以使用雙位操作符來(lái)替代正數(shù)的 Math.floor( )，替代負(fù)數(shù)的Math.ceil( )。雙否定位操作符的優(yōu)勢(shì)在于它執(zhí)行相同的操作運(yùn)行速度更快。
Math.floor(4.9) === 4 //true // 簡(jiǎn)寫為： ~~4.9 === 4 //true
不過(guò)要注意，對(duì)正數(shù)來(lái)說(shuō) ~~ 運(yùn)算結(jié)果與 Math.floor( ) 運(yùn)算結(jié)果相同，而對(duì)于負(fù)數(shù)來(lái)說(shuō)與Math.ceil( )的運(yùn)算結(jié)果相同：
~~4.5 // 4 Math.floor(4.5) // 4 Math.ceil(4.5) // 5 ~~-4.5 // -4 Math.floor(-4.5) // -5 Math.ceil(-4.5) // -41.5 短路運(yùn)算符
我們知道邏輯與&&與邏輯或||是短路運(yùn)算符，短路運(yùn)算符就是從左到右的運(yùn)算中前者滿足要求，就不再執(zhí)行后者了；
可以理解為：
&&為取假運(yùn)算，從左到右依次判斷，如果遇到一個(gè)假值，就返回假值，以后不再執(zhí)行，否則返回最后一個(gè)真值
||為取真運(yùn)算，從左到右依次判斷，如果遇到一個(gè)真值，就返回真值，以后不再執(zhí)行，否則返回最后一個(gè)假值
let param1 = expr1 && expr2 let param2 = expr1 || expr2
| 運(yùn)算符 | 示例 | 說(shuō)明 |
|---|---|---|
| && | expr1&&expr2 | 如果expr1 能轉(zhuǎn)換成false則返回expr1,否則返回expr2. 因此, 在Boolean環(huán)境中使用時(shí), 兩個(gè)操作結(jié)果都為true時(shí)返回true,否則返回false. |
| || | expr1||expr2 | 如果expr1能轉(zhuǎn)換成true則返回expr1,否則返回expr2. 因此,在boolean環(huán)境(在if的條件判斷中)中使用時(shí), 二者操作結(jié)果中只要有一個(gè)為true,返回true;二者操作結(jié)果都為false時(shí)返回false. |
| ! | !expr | 如果單個(gè)表達(dá)式能轉(zhuǎn)換為true的話返回false,否則返回true. |
因此可以用來(lái)做很多有意思的事，比如給變量賦初值：
let variable1 let variable2 = variable1 || "foo"
如果variable1是真值就直接返回了，后面短路就不會(huì)被返回了，如果為假值，則會(huì)返回后面的foo。
也可以用來(lái)進(jìn)行簡(jiǎn)單的判斷，取代冗長(zhǎng)的if語(yǔ)句：
let variable = param && param.prop
如果param如果為真值則返回param.prop屬性，否則返回param這個(gè)假值，這樣在某些地方防止param為undefined的時(shí)候還取其屬性造成報(bào)錯(cuò)。
1.6 取整 | 0對(duì)一個(gè)數(shù)字| 0可以取整，負(fù)數(shù)也同樣適用，num | 0
1.3 | 0 // 1 -1.9 | 0 // -11.7 判斷奇偶數(shù) & 1
對(duì)一個(gè)數(shù)字& 1可以判斷奇偶數(shù)，負(fù)數(shù)也同樣適用，num & 1
const num=3; !!(num & 1) // true !!(num % 2) // true2. 函數(shù) 2.1 函數(shù)默認(rèn)值
func = (l, m = 3, n = 4 ) => (l * m * n); func(2) //output: 24
注意，傳入?yún)?shù)為undefined或者不傳入的時(shí)候會(huì)使用默認(rèn)參數(shù)，但是傳入null還是會(huì)覆蓋默認(rèn)參數(shù)。
2.2 強(qiáng)制參數(shù)默認(rèn)情況下，如果不向函數(shù)參數(shù)傳值，那么JS 會(huì)將函數(shù)參數(shù)設(shè)置為undefined。其它一些語(yǔ)言則會(huì)發(fā)出警告或錯(cuò)誤。要執(zhí)行參數(shù)分配，可以使用if語(yǔ)句拋出未定義的錯(cuò)誤，或者可以利用強(qiáng)制參數(shù)。
mandatory = ( ) => {
throw new Error("Missing parameter!");
}
foo = (bar = mandatory( )) => { // 這里如果不傳入?yún)?shù)，就會(huì)執(zhí)行manadatory函數(shù)報(bào)出錯(cuò)誤
return bar;
}
2.3 隱式返回值
返回值是我們通常用來(lái)返回函數(shù)最終結(jié)果的關(guān)鍵字。只有一個(gè)語(yǔ)句的箭頭函數(shù)，可以隱式返回結(jié)果（函數(shù)必須省略大括號(hào){ }，以便省略返回關(guān)鍵字）。
要返回多行語(yǔ)句（例如對(duì)象文本），需要使用( )而不是{ }來(lái)包裹函數(shù)體。這樣可以確保代碼以單個(gè)語(yǔ)句的形式進(jìn)行求值。
function calcCircumference(diameter) {
return Math.PI * diameter
}
// 簡(jiǎn)寫為：
calcCircumference = diameter => (
Math.PI * diameter;
)
2.4 惰性載入函數(shù)
在某個(gè)場(chǎng)景下我們的函數(shù)中有判斷語(yǔ)句，這個(gè)判斷依據(jù)在整個(gè)項(xiàng)目運(yùn)行期間一般不會(huì)變化，所以判斷分支在整個(gè)項(xiàng)目運(yùn)行期間只會(huì)運(yùn)行某個(gè)特定分支，那么就可以考慮惰性載入函數(shù)
function foo(){
if(a !== b){
console.log("aaa")
}else{
console.log("bbb")
}
}
// 優(yōu)化后
function foo(){
if(a != b){
foo = function(){
console.log("aaa")
}
}else{
foo = function(){
console.log("bbb")
}
}
return foo();
}
那么第一次運(yùn)行之后就會(huì)覆寫這個(gè)方法，下一次再運(yùn)行的時(shí)候就不會(huì)執(zhí)行判斷了。當(dāng)然現(xiàn)在只有一個(gè)判斷，如果判斷很多，分支比較復(fù)雜，那么節(jié)約的資源還是可觀的。
2.5 一次性函數(shù)跟上面的惰性載入函數(shù)同理，可以在函數(shù)體里覆寫當(dāng)前函數(shù)，那么可以創(chuàng)建一個(gè)一次性的函數(shù)，重新賦值之前的代碼相當(dāng)于只運(yùn)行了一次，適用于運(yùn)行一些只需要執(zhí)行一次的初始化代碼
var sca = function() {
console.log("msg")
sca = function() {
console.log("foo")
}
}
sca() // msg
sca() // foo
sca() // foo
3. 字符串
3.1 字符串比較時(shí)間先后
比較時(shí)間先后順序可以使用字符串：
