日本综合一区二区|亚洲中文天堂综合|日韩欧美自拍一区|男女精品天堂一区|欧美自拍第6页亚洲成人精品一区|亚洲黄色天堂一区二区成人|超碰91偷拍第一页|日韩av夜夜嗨中文字幕|久久蜜综合视频官网|精美人妻一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
10個自己遵循的 JavaScript 技巧和實踐,趕緊收藏吧!

廢話不多說,直接安排上。

1.使用數(shù)字分隔符

當(dāng)我需要處理大的數(shù)字時,這是最常用的運算符之一。當(dāng)在數(shù)字中使用分隔符(只有一個_)時,它看起來比沒有分隔的數(shù)字要好。例如:

 
 
 
 
  1. let number = 98234567 

可以這么寫

 
 
 
 
  1. let number = 98_234_567 

而且它也適用于任何其他進(jìn)制數(shù)。

 
 
 
 
  1. const binary = 0b1000_0101; 
  2. const hex = 0x12_34_56_78; 

幾個注意事項:

在前導(dǎo)0后不能使用。

 
 
 
 
  1. let num= 0_12 

不允許出現(xiàn)在數(shù)字的末尾。

 
 
 
 
  1. let num= 500_ 

2.始終使用分號

使用分號終止行是一種很好的做法。如果忘記了,不會被警告,因為在大多數(shù)情況下,它將被JavaScript解析器插入,但依賴于自動分號插入(ASI)是不鼓勵的。

谷歌,Airbnb和jQuery的JS風(fēng)格指南,也推薦使用分號終止行。

3.不要忘記var

當(dāng)你第一次為一個變量賦值時,一定要確保你沒有對一個未聲明的變量進(jìn)行賦值。

對未聲明的變量的賦值會自動導(dǎo)致一個全局變量的創(chuàng)建。避免全局變量?

全局變量很容易被其他腳本覆蓋。例如,如果應(yīng)用程序的兩個獨立部分定義了具有相同名稱但用途不同的全局變量,那么可能會導(dǎo)致不可預(yù)測的錯誤,調(diào)試此類問題將是一個可怕的經(jīng)歷。

通常函數(shù)中的變量應(yīng)該是局部的,這樣當(dāng)你執(zhí)行完函數(shù)時它們就會釋放。

4. Delete vs Splice

使用splice而不是使用delete從一個數(shù)組中刪除一個項。使用delete會刪除對象的屬性,但不會重置索引數(shù)組或更新其長度。

Delete

 
 
 
 
  1. > myArray = ['a', 'b', 'c', 'd'] 
  2.   ["a", "b", "c", "d"] 
  3. > delete myArray[0] 
  4.   true 
  5. > myArray[0] 
  6.   undefined 

請注意,事實上它并沒有被設(shè)置為undefined的值,而是將該屬性從數(shù)組中移除,使其看起來undefined。這個大家可以在控制把 myArray 打印就出看就知道 了。

Splice

Splice() 實際上刪除了元素,重置了索引,并改變了數(shù)組的長度。

 
 
 
 
  1. > myArray = ['a', 'b', 'c', 'd'] 
  2.   ["a", "b", "c", "d"] 
  3. > myArray.splice(0, 2) 
  4.   ["a", "b"] 
  5. > myArray 
  6.   ["c", "d"] 

delete方法應(yīng)該用于刪除對象屬性。

5. map vs for loop

使用map()函數(shù)遍歷數(shù)組的項

 
 
 
 
  1. var squares = [1,2,3,4].map(function (val) {   
  2.     return val * val;   
  3. });  
  4.  
  5. //  [1, 4, 9, 16] 

**Immutability ** - 原來的數(shù)組將不受影響。在其他地方仍然需要原始數(shù)組的情況下,這是有好處的。for 循環(huán)當(dāng)然也可以實現(xiàn),但是這需要更多的代碼,并且需要更新我們的新數(shù)組作為循環(huán)操作的一部分。另一方面,map()可以保持這種清潔,因為你只需要在一個作用哉內(nèi)工作,仍然可以保持不變性。

Cleaner code - 當(dāng)做相同的事情時,map幾乎總是可以用比for更少的代碼來寫。它有時可以清楚地寫在一行上,而for至少需要兩行或一般需要三行,并包括括號。另外,作用域隔離和減少你所需要的變量數(shù)量以及減少的大小都使代碼客觀上更干凈。

6. 四舍五入的數(shù)字

toFixed() 方法使用定點表示法來格式化一個數(shù)值。

 
 
 
 
  1. var pi =3.1415; 
  2. pi = pi.toFixed(2);  // pi will be equal to 3.14 

注意:toFixed()返回的是字符串而不是數(shù)字。

7.使用 console.table

 
 
 
 
  1. table=[{state: "Texas"},{state: "New York"},{state: "Chicago"}] 
  2. console.table(table) 

可以使用console.table來以表格的形式顯示對象。

8. 避免在循環(huán)中使用 try-catch

每次執(zhí)行catch子句時,try-catch結(jié)構(gòu)都會在當(dāng)前作用域內(nèi)創(chuàng)建一個新的變量,其中捕獲的異常對象被分配給一個變量。

 
 
 
 
  1. var object = ['foo', 'bar'], i;   
  2. for (i = 0, len = object.length; i 
  3.     try {   
  4.         // do something that throws an exception  
  5.     }   
  6.     catch (e) {    
  7.         // handle exception   
  8.     }  

第二種寫法

 
 
 
 
  1. var object = ['foo', 'bar'], i;   
  2. try {  
  3.     for (i = 0, len = object.length; i 
  4.         // do something that throws an exception  
  5.     }  
  6. }  
  7. catch (e) {    
  8.     // handle exception   
  9. }  

當(dāng)一個錯誤發(fā)生時,第一個讓你繼續(xù)循環(huán),而第二個則退出循環(huán)。如果你的代碼拋出的異常沒有嚴(yán)重到足以停止整個程序,那么第一個適合。

9. 多個條件檢查

對于多值匹配,我們可以把所有的值放在一個數(shù)組中,并使用indexOf()或includes()方法。

 
 
 
 
  1. if (value === 1 || value === 'one' || value === 2 || value === 'two') {  
  2.  
  3. }  

indexOf():

 
 
 
 
  1. if ([1, 'one', 2, 'two'].indexOf(value) >= 0) {  
  2.  

includes():

 
 
 
 
  1. if ([1, 'one', 2, 'two'].includes(value)) {  
  2.  

10. 雙非位運算符(~~)

雙非位運算符是可以看作是Math.floor()方法的替代品。

 
 
 
 
  1. const floor = Math.floor(6.8); // 6  

也可以這樣寫:

 
 
 
 
  1. const floor = ~~6.8; // 6 

雙非位操作符方法只適用于32位整數(shù)。因此,對于任何比這更高的數(shù)字,建議使用Math.floor()

總結(jié)

最后的建議 - 不要使用隨意的編碼風(fēng)格。要有一個執(zhí)行標(biāo)準(zhǔn)。

~完,我是小智,整理完,準(zhǔn)備來盤 LoL ,記得點贊關(guān)注,發(fā)財致富哦~

作者:Apoorv Tyagi 譯者:前端小智 來源:dev

原文:https://dev.to/apoorvtyagi/javacript-tips-and-best-practices-48ma


新聞標(biāo)題:10個自己遵循的 JavaScript 技巧和實踐,趕緊收藏吧!
當(dāng)前路徑:http://www.dlmjj.cn/article/dpehgdp.html