轉Boolean類型 !!'a' 通過兩個取反，可以強制轉換為Boolean類型。 轉Number類型 // String轉化為Number console.log(+'45'); // 日期輸出時間戳 console.log(+new Date); parseInt ~~，這種方法還可以將字元串轉 ...
轉Boolean類型
!!'a'
通過兩個取反，可以強制轉換為Boolean類型。
轉Number類型
// String轉化為Number console.log(+'45'); // 日期輸出時間戳 console.log(+new Date);
parseInt
~~，這種方法還可以將字元串轉換成數字類型。向下取整。
// ~~將字元串轉換成數字類型，向下取整 console.log(~~3.14159); //3 console.log(~~'5.678'); //5 console.log(-2.33 | 0 ); //-2 console.log(2.33 >> 0 ); //2
原理是~是一個叫做按位非的操作，會返回數值的反碼，兩次取反就是原數。|為位運算符，兩個位只要有一個為1，那麼結果都為1，否則就為0。>>運算符執行有符號右移位運算。都是二進位操作。 原因在於JavaScript中的number都是double類型的，在位操作的時候要轉化成int。
Hex
十六進位操作。其實就是一個Array.prototype.toString(16)的用法
看到這個詞腦袋裡冒出的肯定是CSS的顏色。
做到隨機的話可以這樣
console.log((~~(Math.random()*(1<<24))).toString(16));
«
左移操作，將數值二進位左移
解釋上面的1<<24的操作
其實是1左移24位。000000000000000000000001左移24位，變成了1000000000000000000000000
短路表達式，棄用if-else
反面示例：
if () { // ... } else if () { // ... } else { // ... }
用 || 和 &&來簡化if-else 。有時候用 !! 操作符也能簡化if-else模式。例如這樣：
let a = b || 1;//b為真，a=b;b為假，a=1; let c = b && 1;//b為真，c=1;b為假，c=b; // 使用!!符號 let isValid = !!(value && value !== 'error');
另外一種undefined
let data = void 0; // undefined
保留指定位數的小數點
let num = 2.443242342; num = num.toFixed(4); //"2.4432"
註意， toFixed() 方法返回的是字元串而不是一個數字。
單行寫一個評級組件
let rate1 = 1; let star1 = "★★★★★☆☆☆☆☆".slice(5 - rate1, 10 - rate1);//"★☆☆☆☆" console.log(star1); let rate2 = 2; let star2 = "★★★★★☆☆☆☆☆".slice(5 - rate2, 10 - rate2);//"★★☆☆☆" console.log(star2); let rate3 = 3; let star3 = "★★★★★☆☆☆☆☆".slice(5 - rate3, 10 - rate3);//"★★★☆☆" console.log(star3); let rate4 = 4; let star4 = "★★★★★☆☆☆☆☆".slice(5 - rate4, 10 - rate4);//"★★★★☆" console.log(star4); let rate5 = 5; let star5 = "★★★★★☆☆☆☆☆".slice(5 - rate5, 10 - rate5);//"★★★★★" console.log(star5);
金錢格式化
let cash = '1234567890' let num = cash.replace(/\B(?=(\d{3})+(?!\d))/g, ',');//"1,234,567,890" console.log(num); //非正則的優雅實現 function formatCash(str) { return str.split('').reverse().reduce((prev, next, index) => { return ((index % 3) ? next : (next + ',')) + prev }) } let num2 = formatCash(cash);//"1,234,567,890" console.log(num2);
標準JSON的深拷貝
let a = { a1: 1, b1: { c: 1, d: 2 } }; let b=JSON.parse(JSON.stringify(a)); console.log(b);//{a1: 1, b1: {…}}
數組去重
ES6中利用Set去重比較牛
let array=[1, "1", 2, 1, 1, 3]; //拓展運算符(...)內部使用for...of迴圈 let arr1 = [...new Set(array)];//(4) [1, "1", 2, 3] console.log(arr1); //利用Array.from將Set結構轉換成數組 let arr2 = Array.from(new Set(array));//(4) [1, "1", 2, 3] console.log(arr2);
取數組中的最大值和最小值
Math.max方法可以求出給定參數中最大的數。
console.log(Math.max('1','2','3.1','3.2'));//3.2
console.log(Math.min(1,0,-1));//-1
但如果是數組，就不能這樣調用了。此時就用到了apply方法。Function.apply()是JS的一個OOP特性，一般用來模擬繼承和擴展this的用途。所有函數都有apply(作用域鏈,參數)這個方法，當作用域鏈為null時，預設為上文，這個函數的“參數”，接收一個數組。
let arr = ['1','2','3.1','3.2',0,-1]; //用apply方法 console.log(Math.max.apply(null, arr));//3.2 console.log(Math.min.apply(Math, arr));//-1 //用拓展運算符 console.log(Math.max(...arr));//3.2 console.log(Math.min(...arr));//-1
IIFE
(function(arg) { // do something })(arg)
實用價值在於可以防止全局污染。
Event
寫一個計數器
通過創建一個閉包，把times封裝到裡面，然後返回函數。
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
</head>
<body>
<button class="foo">click me</button>
</body>
</html>
<script>
let foo = document.querySelector('.foo')
foo.addEventListener('click', (function() {
var times = 0
return function() {
times++
console.log(times)
}
})(), false)
</script>
