我正在编写一个Javascript代码,我需要在其中显示和隐藏Web的某些部分.我最终得到了这样的功能:
function hideBreakPanel() {
$('section#break-panel').addClass('hide');
}
function hideTimerPanel() {
$('section#timer-panel').addClass('hide');
}
function showBreakPanel() {
resetInputValues();
$('section#break-panel').removeClass('hide');
}
function showTimerPanel() {
resetInputValues();
$('section#timer-panel').removeClass('hide');
}
我的问题与代码质量和重构有关.什么时候更好地拥有像这样的简单函数或直接调用Javascript / jQuery函数?我认为最后一种方法具有更好的性能,但在这种情况下,性能不是问题,因为它是一个非常简单的站点.
解决方法:
我认为你拥有这样的函数很好,毕竟hideBreakPanel后来可能涉及的不仅仅是将一个类应用于一个元素.我唯一指出的是尝试最小化这些函数中重复代码的数量.不要担心您正在添加函数调用开销这一事实,除非您在性能关键的情况下执行此操作,否则运行时解释器可能不在乎.
您可以通过一种方式安排功能以避免重复自己:
function hidePanel(name) {
$('section#' + name + '-panel').addClass('hide');
}
function showPanel(name) {
resetInputValues();
$('section#' + name + '-panel').removeClass('hide');
}
如果你绝对必须有速记,那么你可以这样做:
function hideBreakPanel() {
hidePanel("break");
}
甚至
var hideBreakPanel = hidePanel.bind(hidePanel, "break");