JavaScript構造函數函數方法

我想知道爲什麼我需要下面的PhoneNumberFormatter.prototype.slice方法。JavaScript構造函數函數方法

爲什麼我不能在我的其他方法裏面使用slice(3,6).join('')而不需要添加PhoneNumberFormatter.prototype.slice方法？當解釋器在PhoneNumberFormatter對象上找不到方法時，是不是隻會查找原型鏈以找到slice並加入Array原型？

function PhoneNumberFormatter(numbers) { 
    this.numbers = numbers; 
} 

PhoneNumberFormatter.prototype.render = function() { 
    var string = ''; 
    string += this.parenthesize(this.getAreaCode()); 
    string += ' '; 
    string += this.getExchangeCode(); 
    string += '-'; 
    string += this.getLineNumber(); 
    return string; 
}; 

PhoneNumberFormatter.prototype.getAreaCode = function() { 
    return this.slice(0, 3); 
}; 

PhoneNumberFormatter.prototype.getExchangeCode = function() { 
    return this.slice(3, 6); 
}; 

PhoneNumberFormatter.prototype.getLineNumber = function() { 
    return this.slice(6) 
}; 

PhoneNumberFormatter.prototype.parenthesize = function(string) { 
    return '(' + string + ')'; 
}; 

// why do I need the following method? 
PhoneNumberFormatter.prototype.slice = function(start, end) { 
    return this.numbers.slice(start, end).join(''); 
}; 

var phoneNumberOne = new PhoneNumberFormatter([6, 5, 0, 8, 3, 5, 9, 1, 7, 2]); 

phoneNumberOne.render()

來源

2017-01-07 Kyle

你在這裏做的唯一事情就是調用PhoneNumberFormatter的slice方法並加入結果，它不像你需要的那樣，但它確實使你的代碼看起來更清潔和簡單，也就是說，你只需要做加入一次，並在一個地方引用數字屬性，從一個不要複製自己的角度來看，這是一個很好的方式來做到這一點，我會說 – Icepickle

你是什麼樣的原型鏈想到會導致'Array.prototype' ？ – melpomene

@melpomene他指的是'PhoneNumberFormatter.prototype.slice'方法;） – Icepickle

我想它是爲了使代碼更清潔並防止代碼重複而創建的。

由於使用切片關鍵字在兩個不同的地方似乎混淆你我會簡單地解釋一下這些差異。

在您的原型方法（例如getAreaCode，getExchangeCode，...）中，關鍵字此表示PhoneNumberFormatter對象。當您撥打this.slice()（在方法中）時，您正在調用此對象的切片方法，因此在您的代碼中創建了該方法。

但是在您的切片方法（代碼中的那個）中，您正在調用this.numbers.slice()。在這裏你可以調用數組的切片方法（this.numbers）。您正在使用本機數組方法切片。

你可以寫你的方法，像這樣並刪除您的代碼創建的分法：

PhoneNumberFormatter.prototype.getAreaCode = function() { 
    return this.numbers.slice(0, 3).join(''); 
};

來源

2017-01-07 22:45:28

個人而言，我更喜歡原始代碼，如果需要更改某些內容，則只需在一個位置更改它即可。 – Icepickle

@Icepickle I也更喜歡它。 OP似乎不確定他可以如何寫出不同的方法，所以我將其清除了。 –

雖然我理解你的觀點，但我認爲他的意思是別的（nl：解釋器的句子和數組原型方法），我認爲你應該更好地解釋slice方法是如何在'this'上找到的。我認爲OP的一部分困惑可能是'slice'名字被使用，而不是，讓我們說'take'（只是爲了不使OP混淆） – Icepickle

我覺得你似乎有主要的困惑是方法slice的名稱。這導致你相信它是數組方法，但事實上並非如此。

代碼中提到的slice方法是PhoneNumberFormatter的slice方法，而不是數組的其中之一。

正因爲如此，解釋不可能找到原型鏈中slice方法，因爲PhoneNumberFormatter的原型是object，並且只是打電話片寧願拋出一個錯誤，該方法是不確定的。

的this.slice法是指PhoneNumberFormatter.prototype.slice而這一次將把它自己的numbers屬性，然後將呼籲numbers陣列的slice方法。

也許它只是更容易重新命名，如代碼：

function PhoneNumberFormatter(numberArr) { 
 
    this.numbers = numberArr.slice(); // copy numbers 
 
} 
 

 

 
PhoneNumberFormatter.prototype.getAreaCode = function() { 
 
    return this.take(0, 3); 
 
}; 
 

 

 
PhoneNumberFormatter.prototype.take = function() { 
 
    return Array.prototype.splice.apply(this.numbers, arguments).join(''); 
 
}; 
 

 
var formatter = new PhoneNumberFormatter([0,1,2,3,4,5,6,7,8,9]); 
 

 
console.log(formatter.getAreaCode());

這可能使它更清楚你，那take方法是一個簡單的實用方法簡化你的代碼，因爲說實話，你爲什麼要重複5種不同的方法slice和join部分，然後冒一個潛在的複製錯誤的風險5次，或者如果你需要改變某些東西，需要做5次相同的改變

來源

2017-01-07 23:05:59 Icepickle

JavaScript構造函數函數方法

回答

相關問題