javascript - 是否有任何理由将声明函数重构为表达式函数？

Question

我有这 3 个函数，它们是不同的，但它们都发生在相同的上下文中，它们是相关的，所以它们有一些共同的组件(例如:类名)。

function btnSubmitLoading($btn, cleanError, classToRemove) {
    // 5-10 lines of code
}

function btnSubmitComplete($btn, classToAdd) {
    // other 5-10 lines of code
}

function btnFeedback($btn, $msg, classToAdd) {
    // more 5-10 lines of code
}

它们在$(document).ready()之前声明，因此它们是全局的并且在不同的页面中调用。当我需要其中之一时:

btnFeedback($('button'), 'success', 'fa-check');

我的问题是是否有任何理由将这些函数转换为表达式函数，从而产生如下结果:

var ButtonSubmit = function() {

    this.btnSubmitLoading = function($btn, cleanError, classToRemove) {
        // 5-10 lines of code
    }

    this.btnSubmitComplete = function($btn, classToAdd) {
         // other 5-10 lines of code
    }

    this.btnFeedback = function($btn, $msg) {
        // more 5-10 lines of code
    }
}

调用它:

btnFancy = new ButtonSubmit();

当我需要它时:

btnFancy.btnFeedback($('button'), 'success', 'fa-check');

我一直在学习表达式/声明函数和闭包/原型(prototype)，但我仍然不明白应该在哪里应用它们。

谢谢。

Answer 1

由于您的 ButtonSubmit 类/构造函数实际上没有执行任何操作，因此这是毫无意义的。至少您希望使用它来简化对象的使用:

let btnFancy = new ButtonSubmit($('button'));
btnFancy.feedback('success', 'fa-check');

(我不知道这对您的用例是否有意义。)

你可以这样实现:

function ButtonSubmit(button) {
    this.button = button;
}

ButtonSubmit.prototype.submitLoading = function (cleanError, classToRemove) {
    this.button....
    // 5-10 lines of code
}

ButtonSubmit.prototype.submitComplete = function (classToAdd) {
    this.button....
    // 5-10 lines of code
}

ButtonSubmit.prototype.feedback = function ($msg) {
    this.button....
    // 5-10 lines of code
}

如果这对您来说没有多大意义，并且您只想为函数命名，则不需要函数或 new:

let btn = {
    submitLoading: function ($btn, cleanError, classToRemove) {
        // 5-10 lines of code
    }
    submitComplete: function ($btn, classToAdd) {
        // other 5-10 lines of code
    },
    feedback: function ($btn, $msg, classToAdd) {
        // more 5-10 lines of code
    }
}

btn.feedback($('button'), ...);