JavaScript里最常用的十种代码简写技巧

   <p style="text-align:center"><img src="https://simg.open-open.com/show/8a96cc11a15a3bb57a6d1628a9b1e73c.jpg"></p>    <p>今天小编我给大家整理了一份10个程序员常用的代码简写技术，看懂一种是入门，全懂就是大神，你能知道几个呢？</p>    <h2>1.三元操作符</h2>    <p>当想写if…else语句时，使用三元操作符来代替。</p>    <pre>  <code class="language-javascript">const x = 20;let answer;if (x > 10) {</code></pre>    <p>简写：</p>    <pre>  <code class="language-javascript">const answer = x > 10 ? 'is greater' : 'is lesser';</code></pre>    <p>也可以嵌套if语句：</p>    <pre>  <code class="language-javascript">const big = x > 10 ? " greater 10" : x</code></pre>    <h2>2.短路求值简写方式</h2>    <p>当给一个变量分配另一个值时，想确定源始值不是null，undefined或空值。可以写撰写一个多重条件的if语句。</p>    <p><img src="https://simg.open-open.com/show/9c0faf0fb6e7b2c15c56adcbcd6b4594.jpg"></p>    <p>或者可以使用短路求值方法：</p>    <pre>  <code class="language-javascript">const variable2 = variable1 || 'new';</code></pre>    <h2>3.声明变量简写方法</h2>    <pre>  <code class="language-javascript">let x;let y;let z = 3;</code></pre>    <p>简写方法：</p>    <pre>  <code class="language-javascript">let x, y, z=3;</code></pre>    <h2>4.if存在条件简写方法</h2>    <pre>  <code class="language-javascript">if (likeJavaScript === true)</code></pre>    <p>简写：</p>    <pre>  <code class="language-javascript">if (likeJavaScript)</code></pre>    <p>只有likeJavaScript是真值时，二者语句才相等</p>    <p>如果判断值不是真值，则可以这样：</p>    <pre>  <code class="language-javascript">let a;if ( a !== true ) {// do something...}</code></pre>    <p>简写：</p>    <pre>  <code class="language-javascript">let a;if ( !a ) {// do something...}</code></pre>    <h2>5.JavaScript循环简写方法</h2>    <pre>  <code class="language-javascript">for (let i = 0; i < allImgs.length; i++)</code></pre>    <p>简写：</p>    <pre>  <code class="language-javascript">for (let index in allImgs)</code></pre>    <p>也可以使用Array.forEach：</p>    <p><img src="https://simg.open-open.com/show/9e5ad5f7c66135b7ad430f3c2472080f.jpg"></p>    <h2>6.短路评价</h2>    <p>给一个变量分配的值是通过判断其值是否为null或undefined，则可以：</p>    <pre>  <code class="language-javascript">let dbHost;if (process.env.DB_HOST) {</code></pre>    <p>简写：</p>    <pre>  <code class="language-javascript">const dbHost = process.env.DB_HOST || 'localhost';</code></pre>    <h2>7.十进制指数</h2>    <p>当需要写数字带有很多零时（如10000000），可以采用指数（1e7）来代替这个数字：</p>    <pre>  <code class="language-javascript">for (let i = 0; i < 10000; i++) {}</code></pre>    <p>简写：</p>    <p><img src="https://simg.open-open.com/show/9cc1c329c5bfcc77d55e492e99e70e59.jpg"></p>    <h2>8.对象属性简写</h2>    <p>如果属性名与key名相同，则可以采用ES6的方法：</p>    <pre>  <code class="language-javascript">const obj = { x:x, y:y };</code></pre>    <p>简写：</p>    <pre>  <code class="language-javascript">const obj = { x, y };</code></pre>    <h2>9.箭头函数简写</h2>    <p>传统函数编写方法很容易让人理解和编写，但是当嵌套在另一个函数中，则这些优势就荡然无存。</p>    <pre>  <code class="language-javascript">function sayHello(name) { console.log('Hello', name);</code></pre>    <p>简写：</p>    <pre>  <code class="language-javascript">sayHello = name => console.log('Hello', name);</code></pre>    <h2>10.隐式返回值简写</h2>    <p>经常使用return语句来返回函数最终结果，一个单独语句的箭头函数能隐式返回其值（函数必须省略</p>    <p>{}为了省略return关键字）为返回多行语句（例如对象字面表达式），则需要使用()包围函数体。</p>    <p><img src="https://simg.open-open.com/show/477ba4b524f981912fae567c8f924d89.jpg"></p>    <p>简写：</p>    <p><img src="https://simg.open-open.com/show/72f6514c2cee71cb0b0bc24aee113e7d.jpg"></p>    <p> </p>    <p>来自：http://www.techug.com/post/10-shorthand-tips-for-javascript-coding.html</p>    <p> </p>