前言
本文主要給大家分享了javascript簡寫常用的12個技巧，無論你是初學者還是資深人士，都值得一讀！下面話不多說了，來一起看看詳細的介紹：
1. 空(null, undefined)驗證
當我們創建了一個新的變量，我們通常會去驗證該變量的值是否為空(null)或者未定義(undefined)。這對于JavaScript編程來說，是一個經常要考慮到的驗證。
如果直接寫，像下面這樣：
if (variable1 !== null || variable1 !== undefined || variable1 !== ''){ let variable2 = variable1;}我們可以使用一個更加簡潔的版本
let variable2 = variable1 || '';
如果你不信，可以在谷歌瀏覽器開發者模式下的控制臺中試試！
//值為null的例子let variable1 = null;let variable2 = variable1 || '';console.log(variable2);//輸出: ''//值為undefined的例子let variable1 = undefined;let variable2 = variable1 || '';console.log(variable2);//輸出: ''//正常情況let variable1 = 'hi there';let variable2 = variable1 || '';console.log(variable2);//輸出: 'hi there'
在這里要注意的是，你在調試完一組代碼后要刷新下頁面，或者定義不同的變量，不然會報錯：
2. 數組
這個好像比較簡單！
非優化代碼：
let a = new Array(); a[0] = "myString1"; a[1] = "myString2"; a[2] = "myString3";
優化代碼：
let a = ["myString1", "myString2", "myString3"];
3. if true .. else 的優化
let big;if (x > 10) {big = true;}else {big = false;}簡化后：
let big = x > 10 ? true : false;
這是三目運算，當判斷條件和結果都只有一個的時候可以使用。
極大的簡化了代碼量！
let big = (x > 10);let x = 3,big = (x > 10) ? "greater 10" : (x < 5) ? "less 5" : "between 5 and 10";console.log(big); //"less 5"let x = 20,big = {true: x>10, false : x< =10};console.log(big); //"Object {true=true, false=false}"4. 變量聲明
盡管JavaScript會自動講變量上提（hoist），使用該方法可以講所有的變量都在函數的頭部用一行搞定。
優化錢:
let x;let y;let z = 3;
優化后：
let x, y, z=3;
5. 賦值語句的簡化
簡化前：
x=x+1;minusCount = minusCount - 1;y=y*10;
簡化后：
x++;minusCount --;y*=10;
假設x=10，y=5，那么基本的算術操作可以使用如下的簡寫方式：
x += y // x=15x -= y // x=5x *= y // x=50x /= y // x=2x %= y // x=0
6. 避免使用RegExp對象
簡化前：
var re = new RegExp("/d+(.)+/d+","igm"),result = re.exrc("padding 01234 text text 56789 padding");console.log(result);//"01234 text text 56789"簡化后：
var result = /d+(.)+d+/igm.exec("padding 01234 text text 56789 padding");console.log(result); //"01234 text text 56789"7. If 條件優化
簡化前：
if (likeJavaScript === true)
簡化后：
if (likeJavaScript)
我們再來個判斷非真的例子：
let c;if ( c!= true ) {// do something...}簡化后：
let c;if ( !c ) {// do something...}9. 函數參數優化
我個人傾向于使用獲取對象元素的方式來訪問函數參數，當然這個見仁見智啦！
通常使用的版本：
function myFunction( myString, myNumber, myObject, myArray, myBoolean ) {// do something...}myFunction( "String", 1, [], {}, true );我喜歡的版本：
function myFunction() {/* 注釋部分console.log( arguments.length ); // 返回 5for ( i = 0; i < arguments.length; i++ ) {console.log( typeof arguments[i] ); // 返回 string, number, object, object, boolean}*/}myFunction( "String", 1, [], {}, true );譯者注：原文下方有評論表示不建議用樓主的方法，使用第一種方法函數參數的順序是可以變動的，第二種你就要小心了。
10. charAt()的替代品
簡化前：
"myString".charAt(0);
簡化后：
"myString"[0];//返回'm'
譯者注：我相信用第一種方法的人已經不多了吧！
11. 函數調用還可以更短
簡化前：
function x() {console.log('x')};function y() {console.log('y')};let z = 3;if (z == 3){x();} else{y();}簡化后：
function x() {console.log('x')};function y() {console.log('y')};let z = 3;(z==3?x:y)();12. 如何優雅的表示大數字
在JavaScript中，有一個簡寫數字的方法，也許你忽略了。1e7表示10000000。
簡化前：
for (let i = 0; i < 10000; i++) {簡化后：
for (let i = 0; i < 1e7; i++) {總結
以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對武林網的支持。
譯者：Fundebug
新聞熱點
疑難解答
