在我正在处理的头像生成器的代码中,我有两个按钮事件处理程序方法,可以使 Angular 色的 Nose 变小或变大。它们几乎包含相同的代码,我想修复这些代码(即干)
再往下看,您会看到我如何将事件处理程序方法中的逻辑删除到新函数中,但我不知道如何更改该函数内的实际逻辑,因此它要么使 Nose 变小,要么变大。所以我基本上想要的是能够将 - 更改为 + 或其他方式,具体取决于事件处理程序方法调用的函数是否使 Nose 变小或变大。
有什么建议吗?
现在的代码:
smallerNoseBtn.on('click', function() {
var nose = AvGen.noses.nose1;
if (nose.size >= 0.3) {
nose.x += 3, nose.y += 3;
nose.size = nose.size -= 0.1;
nose.size = Math.round(nose.size * 10) / 10;
nose.noseObj.transform('S' + nose.size + ', ' + nose.size + ', 0, 0, T' + nose.x + ', ' + nose.y);
}
});
biggerNoseBtn.on('click', function() {
var nose = AvGen.noses.nose1;
if (nose.size <= 1.8) {
nose.x -= 3, nose.y -= 3;
nose.size = nose.size += 0.1;
nose.size = Math.round(nose.size * 10) / 10;
nose.noseObj.transform('S' + nose.size + ', ' + nose.size + ', 0, 0, T' + nose.x + ', ' + nose.y);
}
摆脱 DRY:
smallerNoseBtn.on('click', function() {
var nose = AvGen.noses.nose1;
if (nose.size >= 0.3) {
changeNoseSize(nose, 'smaller');
}
});
biggerNoseBtn.on('click', function() {
var nose = AvGen.noses.nose1;
if (nose.size <= 1.8) {
changeNoseSize(nose, 'bigger');
}
});
// The question is what to write in the functions to make it possible to use the variable
// changeSize (which will contain of either 'bigger' or 'smaller')?
function changeNoseSize(nose, changeSize) {
nose.x -= 3, nose.y -= 3;
nose.size = nose.size += 0.1;
nose.size = Math.round(nose.size * 10) / 10;
nose.noseObj.transform('S' + nose.size + ', ' + nose.size + ', 0, 0, T' + nose.x + ', ' + nose.y);
}
最佳答案
您可以传递系数而不是changeSize,然后实现如下所示:
function changeNoseSize(nose, k) {
nose.x -= k * 3, nose.y -= k * 3;
nose.size += -k * 0.1;
nose.size = Math.round(nose.size * 10) / 10;
nose.noseObj.transform('S' + nose.size + ', ' + nose.size + ', 0, 0, T' + nose.x + ', ' + nose.y);
}
然后您可以传递 1 和 -1 作为 k 值。
关于javascript - 实现非重复代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17066565/