建站
咨詢
售后
建站咨詢
新聞中心
JavaScript 是一種易于學習的編程語言，編寫運行并執(zhí)行某些操作的程序很容易。然而，要編寫一段干凈的JavaScript 代碼是很困難的。在本文中，我們將介紹一些優(yōu)化 JS 類和對象的重構(gòu)思路。
創(chuàng)新互聯(lián)專注于城北網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供城北營銷型網(wǎng)站建設(shè)，城北網(wǎng)站制作、城北網(wǎng)頁設(shè)計、城北網(wǎng)站官網(wǎng)定制、微信平臺小程序開發(fā)服務(wù)，打造城北網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供城北網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。
用常量來表示數(shù)字
如果我們有很多重復的值且表示一樣的含義，但沒有明確地說明，那么我們應該將它們轉(zhuǎn)換為常量，以便每個人都知道它們的含義，并且如果需要更改，我們只需更改一個地方就行了。
例如我們可能會這樣寫代碼：
const getWeight = (mass) => mass * 9.81
const potentialEnergy = (mass, height) => mass * height * 9.81
對于含義相同的數(shù)學我可以用常量表示：
const GRAVITATIONAL_CONSTANT = 9.81;
const getWeight = (mass) => mass * GRAVITATIONAL_CONSTANT
const potentialEnergy = (mass, height) => mass * height * GRAVITATIONAL_CONSTANT
現(xiàn)在我們知道9.81實際上意味著GRAVITATIONAL_CONSTANT，我們不必重復自己。
上面我們用常量 GRAVITATIONAL_CONSTANT 表示 9.81 ，這樣別人一看就知道它表示是萬有引力常數(shù)常量。
封裝字段
我們可以將getter和setter添加到類的字段中，這樣就不心直接對類的字段進行操作。
例如我們可能會這樣寫代碼：
class Person {
constructor(name) {
this.name = name;
}
}
如果要控制如何設(shè)置值，可以這樣重構(gòu)：
class Person {
constructor(name) {
this._name = name
}
get name() {
return this._name
}
set name() {
this._name = name
}
}
這樣，我們就可以控制如何設(shè)置值，因為我們可以在setter中放入代碼來設(shè)置名稱。我們還可以控制誰能獲得名稱，因為它是在getter中返回的。
用數(shù)組類代替字段
我們可以將字段替換為其自己的數(shù)據(jù)類，這樣在記錄數(shù)據(jù)中會有更強靈活性。
例如我們可能會這樣寫代碼：
class Person {
constructor(name, bloodGroup) {
this.name = name;
this.bloodGroup = bloodGroup;
}
}
const person = new Person('joe', 'a')
如果我們想擴充 bloodGroup (血型)的種類，我們可以把 bloodGroup 重構(gòu)成一個類。
class BloodGroup {
constructor(name) {
this.bloodGroup = name;
}
}
class Person {
constructor(name, bloodGroup) {
this.name = name;
this.bloodGroup = bloodGroup;
}
}
const bloodGroup = new BloodGroup('a');
const person = new Person('joe', bloodGroup)
這樣，我們就可以在bloodGroup字段中存儲更多種類的數(shù)據(jù)。
用狀態(tài)/策略替換類型代碼
有時，我們可以根據(jù)對象的類型創(chuàng)建子類，而不是在類中使用類型字段。這樣，我們就可以在它們自己的子類中擁有兩個類不共享的更多成員。
例如我們可能會這樣寫代碼：
class Animal {
constructor (type) {
this.type = type
}
}
const cat = new Animal('cat')
const dog = new Animal('dog')
我們可以根據(jù) type 類型來重構(gòu)對應的類：
class Animal {
//...
}
class Cat extends Animal {
//...
}
class Dog extends Animal {
//...
}
const cat = new Cat();
const dog = new Dog();
在上面的示例中，我們單獨編寫一個Animal類，而另外添加Cat和Dog類，它們是Animal類的子類。
這樣我們可以 Cat 和 Dog 類中共享的屬性保存在各自的類的，把共享的放在 Animal 類中。
分解條件表達式
我們可以將長的條件表達式分解為更小的條件表達式。
例如我們可能會這樣寫代碼：
let ieIEMac = navigator.userAgent.toLowerCase().includes("mac") && navigator.userAgent.toLowerCase().includes("ie")
我們可以這樣重構(gòu)它：
let userAgent = navigator.userAgent.toLowerCase();
let isMac = userAgent.includes("mac");
let isIE = userAgent.toLowerCase().includes("ie");
let isMacisMacIE = isMac && isIE;
我們將冗長又難懂的條件表達式分解多個短小表達式，這樣會大大滴增加閱讀性。
總結(jié)
如果我們有很多重復的值且表示一樣的含義，但沒有明確地說明，那么我們應該將它們轉(zhuǎn)換為常量，以便每個人都知道它們的含義，并且如果需要更改，我們只需更改一個地方就行了。
為了更好控制類的屬性，我們可以為它添加getter和setter方法。
如果我們有type字段，則可以用它們自己的子類替換它們。
最后，我們可以將長條件表達式分解為較小的條件表達式，以便于閱讀和理解。
新聞標題：講解一下JavaScript對象重構(gòu)
當前地址：http://www.dlmjj.cn/article/djdjccd.html
