別客氣，11種在教程中難以找到的JavaScript技巧，請收下
今天，小芯給大家整理11條非常好用的JavaScript技巧。
買不了吃虧，買不了上當(dāng)，快來看看吧~
1.獲取數(shù)組的最后一項
設(shè)置起始參數(shù)和終止參數(shù)時，Array.prototype.slice(begin,end)具有剪切數(shù)組的功能。但是，如果未設(shè)置終止參數(shù)，該功能將自動設(shè)置為數(shù)組的最大值。
該功能可接受負(fù)值，我想很多人對此并不了解，而且如果將起始參數(shù)設(shè)定為負(fù)數(shù)，那么會得到數(shù)組的最后幾個元素：
- vararray = [1,2,3,4,5,6];
- console.log(array.slice(-1)); // [6]
- console.log(array.slice(-2)); // [5,6]
- console.log(array.slice(-3)); // [4,5,6]
2.用||運算符默認(rèn)某值
目前的ES6有默認(rèn)參數(shù)功能。為了在舊版瀏覽器中模擬該功能，你可以用||(OR運算符)默認(rèn)某值，將其作為第二個可用的參數(shù)。
如果第一個參數(shù)返回到了false，那么第二個參數(shù)就會被視為默認(rèn)值。請看這個例子：
- function User(name, age) {
- this.name = name || "OliverQueen";
- this.age = age || 27;
- }var user1 = new User();
- console.log(user1.name); // Oliver Queen
- console.log(user1.age); // 27var user2 = new User("Barry Allen", 25);
- console.log(user2.name); // Barry Allen
- console.log(user2.age); // 25
3.重組數(shù)組元素
想不用Lodash這樣的外部工具庫就能重組數(shù)組元素?試試下面這個神奇的函數(shù)：
- var list= [1,2,3];
- console.log(list.sort(function() { Math.random() - 0.5 })); // [2,1,3]
4.短路條件
如果你看到一個代碼類似于：
- if (connected) { login();
- }
可以通過結(jié)合使用變量(會被驗證)和函數(shù)之間的&&(AND運算符)來縮短上述代碼。比如，上述代碼可以縮短為一行：
- connected && login();
你可以執(zhí)行相同操作來檢查對象中是否存在屬性或函數(shù)。與以下代碼類似：
- user && user.login();
5.截取數(shù)組
這項技巧可以鎖定數(shù)組的大小，能夠根據(jù)你要設(shè)置的元素數(shù)目從數(shù)組中刪除某些元素，十分有用。
比如，如果有一個含有10個元素的數(shù)組，但是你只想要
前五個，那就可以截取數(shù)組，通過設(shè)置array.length=5讓它變小。請看下面的例子：
- var array = [1,2,3,4,5,6];
- console.log(array.length); // 6
- array.length = 3;
- console.log(array.length); // 3
- console.log(array); // [1,2,3]
6.用+運算符轉(zhuǎn)換為數(shù)字
這種技巧真是太棒了!它操作起來非常簡單，不過只適用于str函數(shù)，否則它會返回到NaN(非數(shù)字)。請看下面的例子：
- functiontoNumber(strNumber) {
- return +strNumber;
- }console.log(toNumber("1234")); // 1234
- console.log(toNumber("ACB")); // NaN
這種技巧同樣適用于日期，在這種情況下，它會返回到時間戳：
- console.log(+new Date()) //1461288164385
7.合并數(shù)組
如果需要將兩個數(shù)組合并，那么可以用Array.contat()函數(shù)：
- var array1 = [1,2,3];
- var array2 = [4,5,6];
- console.log(array1.concat(array2)); // [1,2,3,4,5,6];
但是，該函數(shù)并不是合并大型數(shù)組比較好的工具，因為它創(chuàng)建新數(shù)組時會占用大量內(nèi)存。
在這種情況下，可以用Array.push.apply(arr1, arr2)，而不用創(chuàng)建新數(shù)組。這種函數(shù)會將第二個數(shù)組并入第一個數(shù)組，不會占用太多內(nèi)存：
- vararray1 = [1,2,3];
- var array2 = [4,5,6];
- console.log(array1.push.apply(array1, array2)); // [1,2,3,4,5,6];
8.在循環(huán)中緩存array.length
這個技巧很簡單，但在循環(huán)中處理大型數(shù)組時，它會對性能產(chǎn)生很大影響。為了迭代數(shù)組，幾乎每個人都會同時寫出這樣的代碼：
- for(vari = 0; i < array.length; i++) {
- console.log(array[i]);
- }
如果處理的是小型數(shù)組，那沒問題，可是如果處理的是大型數(shù)組，那么代碼會在循環(huán)的每一次迭代中重新計算數(shù)組的大小，從而造成延遲。
為了避免此種情況，可以將要用的array.length緩存在某個變量中，而不用在循環(huán)的每一次迭代中都調(diào)用它：
- var length = array.length;
- for(var i = 0; i < length; i++) {
- console.log(array[i]);
- }
想讓它變短一些?這樣寫就可以：
- for(var i = 0, length = array.length;i < length; i++) {
- console.log(array[i]);
- }
9.全部替換
String.replace()函數(shù)允許使用字符串和正則表達(dá)式替換字符串;在本機中該函數(shù)只能替換第一次。但是可以在正則表達(dá)式的末尾使用/g，從而模擬replaceAll()函數(shù)：
- varstring = "john john";
- console.log(string.replace(/hn/, "ana")); // "joana john"
- console.log(string.replace(/hn/g, "ana")); // "joana joana"
10.用!!運算符轉(zhuǎn)換為布爾值
有時候，為將變量看作真值，我們需要檢查一個變量是否存在或是否具有有效值。在此驗證過程中，你可以用!!(雙重否定運算符)。
一個簡單的!!variable會自動將數(shù)據(jù)轉(zhuǎn)換為布爾值，而且該變量只有在含有0、null、""、undefined或NaN這樣的值時才會返回到false，否則會返回到true。
為了在實踐中理解這一過程，我們來看一看下面這個簡單的例子：
- function Account(cash) {
- this.cash = cash;
- this.hasMoney = !!cash;
- }
- var account = new Account(100.50);
- console.log(account.cash); // 100.50
- console.log(account.hasMoney); // true
- var emptyAccount = new Account(0);
- console.log(emptyAccount.cash); // 0
- console.log(emptyAccount.hasMoney); // false
該例中，如果account.cash的值大于零，那么account.hasMoney就是true。
11.將NodeList轉(zhuǎn)換為Arrays
如果運行document.querySelectorAll("p")函數(shù)，那么它有可能會返回到DOM元素數(shù)組，即NodeList對象。但是該對象并不具有數(shù)組的全部函數(shù)，比如sort()、reduce()、map()和filter()。
為了運行以上函數(shù)以及其他自帶的數(shù)組函數(shù)，需要將NodeList轉(zhuǎn)化為Arrays。想試試這個技巧?用下面這個函數(shù)就可以：[].slice.call(elements):
- var elements = document.querySelectorAll("p");// NodeList
- var arrayElements = [].slice.call(elements); // Now the NodeList is an array//This is another way of converting NodeList to Arrayvar arrayElements =Array.from(elements);
