6個編寫優(yōu)質(zhì)干凈代碼的技巧
【譯者注】作為一名開發(fā)者,編寫一手干凈的代碼很重要,所以在本文中作者先列舉出編寫干凈代碼的一些好處,再提出6個技巧用于編寫干凈代碼,供開發(fā)者進行參考學(xué)習(xí)。
以下為譯文:
編寫干凈的代碼并不是一件容易的事情,這需要嘗試不同的技巧和實踐。問題是,在這個問題上有太多的實踐和技巧,因此開發(fā)人員很難進行選擇,所以要把這個問題簡化一下。在本文中,將首先討論編寫干凈代碼的一些好處,然后將討論6個技巧或者實踐,用于編寫最常用的干凈代碼。
以下是目錄內(nèi)容:
引用
編寫干凈代碼的好處
- 更容易開始和繼續(xù)一個項目
- 有利于團隊新員工培訓(xùn)
- 更容易遵循編碼模式
寫干凈代碼的技巧
- 編寫可讀的代碼
- 為變量、函數(shù)和方法使用有意義的名稱
- 讓每個函數(shù)或方法只執(zhí)行一個任務(wù)
- 使用注釋來解釋代碼
- 保持代碼風(fēng)格一致性
- 定期檢查你的代碼
關(guān)于編寫干凈代碼的一些想法
寫干凈代碼的好處
先來了解編寫干凈代碼的一些好處。其中一個主要好處是,干凈的代碼可以減少花在閱讀上的時間和理解代碼的時間。凌亂的代碼會減慢任何開發(fā)人員的速度,使開發(fā)者的工作變得更加困難。代碼越混亂,開發(fā)人員就越需要花更多的時間去充分理解它,這樣才能使用這些代碼。而且,如果代碼太亂,開發(fā)人員可能會決定停止閱讀這些代碼,并自己從頭開始編寫。
1.更容易開始和繼續(xù)一個項目
先用一個簡單的例子來說明這個問題。假設(shè)在很長一段時間后我們回到了之前的一個項目,也許在這段時間是一位客戶聯(lián)系我們?nèi)プ隽肆硪豁椆ぷ鳌,F(xiàn)在,想象一下,那時如果沒有編寫干凈的代碼,那么在第一眼看到代碼之后,該是有多糟糕和混亂。而且,也可以知道從當(dāng)初離開的地方開始編碼有多困難。
因此,現(xiàn)在必須花更多的時間在項目上,因為我們需要理解之前編寫的代碼。這本來是可以避免的,如果從一開始就編寫干凈的代碼,然而現(xiàn)在必須為此付出代價。而且,舊代碼是如此混亂和糟糕,以至于我們可能決定從頭開始。客戶聽到這些消息后可能不會高興。
另一方面,干凈的代碼通常就沒有這個問題。假設(shè)前面的例子是相反的情況,以前的代碼是干凈和優(yōu)雅的,那么理解它需要多長時間?也許只需要讀幾分鐘的代碼就能理解所有的工作原理,而且我們可能已經(jīng)開始編寫一段時間了,所以在這種情況下花的精力將明顯小于第一個案例,同時,客戶也不會太在意。
這是編寫干凈代碼的第一個好處,而且,這不僅適用于自己的項目,也適用于其他開發(fā)人員的工作。干凈的代碼可以更快地啟動工作,任何人都不需要花費數(shù)小時來研究代碼,相反,我們可以直接進入工作。
2.有利于團隊新員工培訓(xùn)
編寫干凈代碼的另一個好處與第一個好處是密切相關(guān)的,那就是可以讓新員工更容易更快地使用代碼。假設(shè)我們需要雇傭一個開發(fā)人員,那么她要花多長時間才能理解代碼并學(xué)會使用它呢?當(dāng)然這要視情況而定。如果我們的代碼很亂,寫得很差,她就需要花更多的時間來學(xué)習(xí)代碼。另一方面,如果代碼干凈、易讀、簡單易懂,她將能夠更快地開始她的工作。
有些人可能會說,這不是個問題,因為其他開發(fā)人員可以幫助她。當(dāng)然這是正確的,但是幫助只應(yīng)該花很短的時間,是兩三次或者一兩天,而并不應(yīng)該是兩三個星期。所以,決定雇傭另一個開發(fā)人員的目的,是來加速我們的工作,而不是減慢速度,也不是花費更多的時間來幫助她學(xué)會使用代碼。
當(dāng)我們努力寫出干凈的代碼時,其他人就會向我們學(xué)習(xí),也就更容易跟著寫出干凈的代碼。當(dāng)然,仍然需要留出一些時間來幫助每個新開發(fā)人員了解和理解代碼。當(dāng)然,我的意思是幾天,而不是幾周。此外,干凈的代碼將幫助團隊帶來更多的開發(fā)人員,并同時幫助他們理解代碼。簡單地說,代碼越簡潔就越容易解釋,誤解也就越少。
3.更容易遵循編碼模式
有一件事需要記住,理解和學(xué)習(xí)如何使用代碼是一回事。然而,這僅僅是個開始,同時還需要確保開發(fā)人員能夠愿意遵循我們的編碼模式。當(dāng)然,使用干凈的代碼比混亂的代碼更容易實現(xiàn)這個目標(biāo)。這是很重要的,因為團隊不僅想要編寫干凈的代碼,而且還一直保持這種模式,這也是需要長期思考的。
另外,如果開發(fā)人員不遵循當(dāng)前的編碼模式該怎么辦? 這個問題通常可以自行解決。假設(shè)有一群人在同一個代碼基礎(chǔ)上工作,其中一個人開始偏離標(biāo)準(zhǔn)樣式。然后,團隊的其他成員將推動這個開發(fā)人員遵循標(biāo)準(zhǔn)。她會接受建議,因為她不想離開這個團隊。
還有一種情況,開發(fā)人員會說服團隊的其他人采納并遵循自己的編碼模式。如果開發(fā)人員提出的編碼模式更干凈,并且能帶來更好的結(jié)果,這當(dāng)然是件好事。的確,編寫和保持干凈的代碼并不意味著應(yīng)該忽略任何改進它的機會,我認為應(yīng)該始終對目前的做法保持可改進的態(tài)度,并努力尋找改進的機會。
因此,如果一個開發(fā)人員偏離了當(dāng)前的模式,同時她的模式也更好,那么我們做出改變也許會更合適。所以在嘗試其他模式之前,不應(yīng)該忽視其他人的編碼實踐,同時我們應(yīng)該繼續(xù)尋找改進的余地。最后,第三種情況。開發(fā)人員決定既不采用我們的實踐,也不說服我們采用她的實踐。因為她將決定離開團隊。
寫干凈代碼的技巧
現(xiàn)在除了討論編寫干凈代碼的好處,也是時候?qū)W習(xí)一些技巧來幫助我們實現(xiàn)這個目標(biāo)了。正如將在以下看到的,干凈的代碼包含并遵循著一些方法。這些方法使代碼更干凈、易讀、更易于理解、更簡單。當(dāng)然沒有必要實施所有的方法,實施并遵循一兩項措施就足以帶來積極的結(jié)果。
1.編寫可讀的代碼
的確,所寫的代碼將會機器解釋,然而這并不意味著應(yīng)該忽視代碼的可讀性和可理解性,因為在將來總會有另一個人會使用我們寫的代碼。即使讓別人無法訪問我們的代碼,但我們自己也可能在將來又重新拾起這些代碼。出于這些原因,讓代碼便于閱讀和理解是符合我們自己的利益的。那么如何實現(xiàn)呢?
最簡單的方法是使用空格。在發(fā)布代碼之前,可以縮減代碼,但是沒有必要讓代碼看起來很小型化。相反,可以使用縮進、換行和空行來使代碼結(jié)構(gòu)更具可讀性。當(dāng)決定采用這種方式時,代碼的可讀性和可理解性就會顯著提高。然后,看著代碼就可以更容易理解它了。來看兩個簡單的例子。
- // Bad
- const userData=[{userId: 1, userName: 'Anthony Johnson', memberSince: '08-01-2017', fluentIn: [ 'English', 'Greek', 'Russian']},{userId: 2, userName: 'Alice Stevens', memberSince: '02-11-2016', fluentIn: [ 'English', 'French', 'German']},{userId: 3, userName: 'Bradley Stark', memberSince: '29-08-2013', fluentIn: [ 'Czech', 'English', 'Polish']},{userId: 4, userName: 'Hirohiro Matumoto', memberSince: '08-05-2015', fluentIn: [ 'Chinese', 'English', 'German', 'Japanese']}];
- // Better
- const userData = [
- {
- userId: 1,
- userName: 'Anthony Johnson',
- memberSince: '08-01-2017',
- fluentIn: [
- 'English',
- 'Greek',
- 'Russian'
- ]
- }, {
- userId: 2,
- userName: 'Alice Stevens',
- memberSince: '02-11-2016',
- fluentIn: [
- 'English',
- 'French',
- 'German'
- ]
- }, {
- userId: 3,
- userName: 'Bradley Stark',
- memberSince: '29-08-2013',
- fluentIn: [
- 'Czech',
- 'English',
- 'Polish'
- ]
- }, {
- userId: 4,
- userName: 'Hirohiro Matumoto',
- memberSince: '08-05-2015',
- fluentIn: [
- 'Chinese',
- 'English',
- 'German',
- 'Japanese'
- ]
- }
- ];
- // Bad
- class CarouselLeftArrow extends Component{render(){return ( <a href="#" className="carousel__arrow carousel__arrow--left" onClick={this.props.onClick}> <span className="fa fa-2x fa-angle-left"/> </a> );}};
- // Better
- class CarouselLeftArrow extends Component {
- render() {
- return (
- <a
- href="#"
- className="carousel__arrow carousel__arrow--left"
- onClick={this.props.onClick}
- >
- <span className="fa fa-2x fa-angle-left" />
- </a>
- );
- }
- };
2.為變量、函數(shù)和方法使用有意義的名稱
來看一看第二個技巧,它將幫助我們編寫可理解和干凈的代碼。這個技巧是關(guān)于變量、函數(shù)和方法的有意義的名稱。“有意義的”是什么意思?有意義的名字是描述性足夠多的名字,而不僅僅是編寫者自己才能夠理解的變量、函數(shù)或方法。換句話說,名稱本身應(yīng)該根據(jù)變量、函數(shù)或方法的內(nèi)容和使用方式來定義。
- // Bad
- const fnm = ‘Tom’;
- const lnm = ‘Hanks’
- const x = 31;
- const l = lstnm.length;
- const boo = false;
- const curr = true;
- const sfn = ‘Remember the name’;
- const dbl = [‘1984’, ‘1987’, ‘1989’, ‘1991’].map((i) => {
- return i * 2;
- });
- // Better
- const firstName = ‘Tom’;
- const lastName = ‘Hanks’
- const age = 31;
- const lastNameLength = lastName.length;
- const isComplete = false;
- const isCurrentlyActive = true;
- const songFileName = ‘Remember the name’;
- const yearsDoubled = [‘1984’, ‘1987’, ‘1989’, ‘1991’].map((year) => {
- return year * 2;
- });
然而需要注意的是,使用描述性名稱并不意味著可以隨意使用任意多個字符。一個好的經(jīng)驗則是將名字限制在3或4個單詞。如果需要使用超過4個單詞,說明這個函數(shù)或方法需要同時執(zhí)行很多的任務(wù),所以應(yīng)該簡化代碼,只使用必要的字符。
3.讓一個函數(shù)或方法只執(zhí)行一個任務(wù)
當(dāng)開始編寫代碼時,使用的函數(shù)和方法看起來就像一把瑞士軍刀,幾乎可以處理任何事情,但是很難找到一個好的命名。另外,除了編寫者,幾乎沒有人知道函數(shù)是用來做什么的以及該如何使用它。有時我就會遇到這些問題,我在這方面做的很不好。
然后,有人提出了一個很好的建議:讓每個函數(shù)或方法只執(zhí)行一個任務(wù)。這個簡單的建議改變了一切,幫助我寫出了干凈的代碼,至少比以前更干凈了。從那以后,其他人終于能夠理解我的代碼了,或者說,他們不需要像以前一樣花很多時間去讀懂代碼了,功能和方法也變得更好理解。在相同的輸入下,總是能產(chǎn)生相同的輸出,而且,命名也變得容易得多。
如果你很難找到函數(shù)和方法的描述性名稱,或者需要編寫冗長的指令以便其他人可以使用,那請考慮這個建議,讓每個函數(shù)或方法只執(zhí)行一個任務(wù)。如果你的功能和方法看起來像瑞士軍刀一樣無所不能,那請你執(zhí)行這個方法,相信我,這種多才多藝不是一種優(yōu)勢。這是一個相當(dāng)不利的情況,可能會產(chǎn)生事與愿違的結(jié)果。
附注:這種讓每一個函數(shù)或方法只執(zhí)行一項任務(wù)的做法被稱為保持純函數(shù)。這種編碼實踐來自于函數(shù)式編程的概念。如果你想了解更多,我推薦閱讀《So You Want to be a Functional Programmer series[4]》。
- // Examples of pure functions
- function subtract(x, y) {
- return x - y;
- }
- function multiply(x, y) {
- return x * y;
- }
- // Double numbers in an array
- function doubleArray(array) {
- return array.map(number => number * 2)
- }
4.更容易遵循編碼模式
不管多么努力地為變量、函數(shù)和方法想出有意義的名字,代碼仍然不可能完全清晰易懂,還有一些思路需要進行解釋。問題可能不是代碼很難理解或使用,相反,其他人可能不理解為什么要實現(xiàn)這個函數(shù)或方法,或者為什么要以特定的方式創(chuàng)建它。意思是,創(chuàng)建函數(shù)或方法的意圖還不清楚。
有時可能不得不采用非傳統(tǒng)的方法來解決問題,因為沒有足夠的時間來想出更好的解決方案,這也很難用代碼來解釋。所以,通過代碼注釋可以幫助解決這個問題,也可以幫助我們向其他人解釋為什么寫了這個方法,為什么要用這種特定的方式來寫,那么其他人就不必猜測這些方法或函數(shù)的用途了。
更重要的是,當(dāng)我們使用注來解釋代碼后,其他人可能會找到一個更好的方法來解決這個問題并改進代碼。這是有可能的,因為他們知道問題是什么,以及期望的結(jié)果是什么。如果不知道這些信息,其他人就很難創(chuàng)建更好的解決方案,或者他們可能不會去嘗試,因為他們認為沒有必要去修改創(chuàng)建者自己的想法。
因此,每當(dāng)自己決定使用一些快速修復(fù)或非傳統(tǒng)的方法時,要用注釋來解釋為什么這么做。最好是用一兩行注釋來解釋,而不用別人來猜測。
也就是說,我們應(yīng)該只在必要的時候使用注釋,而不是解釋糟糕的代碼。編寫無窮無盡的注釋將無助于將糟糕的代碼轉(zhuǎn)換成干凈的代碼。如果代碼不好,應(yīng)該通過改進代碼來解決這個問題,而不是添加一些如何使用它的說明。編寫干凈的代碼更重要。
5.保持代碼風(fēng)格一致性
當(dāng)我們有自己喜歡的特定編碼方式或風(fēng)格時,就會在任何地方一直使用它。但在不同的項目中使用不同的編碼風(fēng)格不是一個好主意,而且也不可能很自然地回到以前的代碼,所以仍然需要一些時間來理解在項目中使用的編碼風(fēng)格。
最好的方法是選擇一套編碼方式,然后在所有的項目中堅持使用。這樣的話,回到之前的舊代碼會變得更容易。當(dāng)然,嘗試新的編碼方式是一件好事,它可以幫助我們找到更好的方法來開展工作。但是最好是在不同的實驗項目或練習(xí)上嘗試不同的編碼風(fēng)格,而不是在主要項目上進行。
另外,當(dāng)我們決定做一些試驗的時候,就應(yīng)該嘗試多次練習(xí),應(yīng)該花時間徹底地做好。只有真正確信喜歡這種做法,并且對它感到滿意時,才應(yīng)該去實施它。而且決定這樣做的時候,最好應(yīng)用在所有的項目中。是的,這需要時間,這也會促使我們正確地思考。
6.檢查你的代碼
這是最后一個技巧。不僅僅是編寫干凈的代碼,還要完成最后的工作,那就是需要維護干凈代碼。我們應(yīng)該定期檢查代碼,并試著改進它。否則,如果不審查和更新我們的舊代碼,它很快就會過時,就像我們的設(shè)備一樣。如果想讓代碼保持最佳狀態(tài),就需要定期更新它們。
對于每天使用的代碼,情況也是如此。代碼會變得更加復(fù)雜和混亂,所有應(yīng)該避免這種情況發(fā)生,并保持代碼干凈。實現(xiàn)這一點的唯一方法是定期檢查我們的代碼。換句話說,我們需要保持它。對于那些未來不再關(guān)心的項目來說,這可能是不必要的,但對其他的來說,維護代碼是工作的一部分。
關(guān)于編寫干凈代碼的一些想法
今天討論的這六種做法,可能不是影響最大的,也可能不是最重要的,但這些是經(jīng)驗豐富的開發(fā)人員最常提到的,這也就是我選擇它們的原因。我希望這些實踐或技巧能夠幫助你開始編寫干凈的代碼。現(xiàn)在,就像所有的事情一樣,最重要的是開始。所以,至少選一個技巧,然后試一試。