網(wǎng)友解答: 首先，你必須要編寫(xiě)簡(jiǎn)潔，規(guī)范，易于閱讀和可維護(hù)的代碼。其次你才要考慮的是寫(xiě)復(fù)雜的應(yīng)用。下面總結(jié)下我web前端工作兩年來(lái)，總結(jié)出的編寫(xiě)優(yōu)雅的JS代碼的一些技巧：定義語(yǔ)義化，可讀

首先，你必須要編寫(xiě)簡(jiǎn)潔，規(guī)范，易于閱讀和可維護(hù)的代碼。其次你才要考慮的是寫(xiě)復(fù)雜的應(yīng)用。下面總結(jié)下我web前端工作兩年來(lái)，總結(jié)出的編寫(xiě)優(yōu)雅的JS代碼的一些技巧：

定義語(yǔ)義化，可讀性好的命名。let str = new Date(); //badlet toDay = new Date(); //good

遵循函數(shù)的單一功能原則。比如說(shuō)綁定事件處理函數(shù)的功能，就定義一個(gè)bindEvent的函數(shù)里面，初始化函數(shù)就定義一個(gè)init()的入口函數(shù)，這里只做初始化的工作。

使用默認(rèn)變量代替短路運(yùn)算function getName(name){let name = name || ' ' ; } //badfunction getName(name = 'jack'){let name = name;} //good

函數(shù)參數(shù)，建議不要超過(guò)2個(gè)，如果超過(guò)兩個(gè)，可以用對(duì)象代替或者用ES6的對(duì)象解構(gòu)去解決。

抽取出有同樣功能的函數(shù)，移除重復(fù)代碼。

能做變量緩存盡量做緩存。

減少DOM的重復(fù)操作。

避免使用暴露在整個(gè)全局作用域的全局變量。

使用ES6/ES7新特性。（1）箭頭函數(shù)（2）模板字符串（3）解構(gòu)（4）async/awai

模塊化很重要，避免在全局作用域下直接寫(xiě)各種函數(shù)，可以考慮用閉包把單一功能的函數(shù)包起來(lái)。小結(jié)：以上這些規(guī)則，不是說(shuō)會(huì)立刻就讓你變成一個(gè)優(yōu)秀的前端工程師，但是如果一直保持這樣規(guī)范的代碼，對(duì)于你，也對(duì)于你的同事，都是有益的。至于你說(shuō)怎樣才能寫(xiě)出那種層次分明，思路清晰的復(fù)制應(yīng)用，這個(gè)真的是一步步來(lái)的，不要一上來(lái)就想著做多大的項(xiàng)目，可以先學(xué)習(xí)下現(xiàn)在已經(jīng)存在的框架或者庫(kù)的思路，比如說(shuō)Jquery，react，別人是怎么封裝，怎么實(shí)現(xiàn)的，可以看看源碼先，學(xué)習(xí)一下，然后自己模仿著寫(xiě)一個(gè)小型的js庫(kù)。希望對(duì)你有所幫助。

感謝邀請(qǐng)。首先要用好命名，要容易讀懂名稱表達(dá)的含義，然后要組織好模塊功能，最后要標(biāo)注好引用來(lái)源。優(yōu)化器可以壓縮格式，簡(jiǎn)化命名，所以不必考慮格式帶來(lái)的空間浪費(fèi)，要用TAB做好模塊縮進(jìn)，用好注釋寫(xiě)清楚用法和注意事項(xiàng)。