如何将 function 传递到 JavaScript 中的另一个 function

Question

我有一个 function 用于检查表单中的用户名，父 function 我检查是否有空字段，现在我想在 onSubmit() 中传递 usernameValidat() 以检查它是否与我的用户名验证匹配。 任何人都可以给我解决这个问题的答案吗

onSubmit() {
            var text = "Please insert ";
            for (let i = 0; i < Constant.REGISTER_INFOS.length; i++) {
                if (Constant.REGISTER_INFOS[i].info == "") {
                    text = text + Constant.REGISTER_INFOS[i].title.toLowerCase() + ", ";
                }
            }
            alert(text);
            
        },
        usernameValidate() {
            if (Constant.REGISTER_INFOS[0].info.length < 4) {
                alert("Username is too short");
                return false;
            }
        },

Answer 1

假设这是 Vue 应用程序的一部分，那么类似于：

const App = new Vue({
  methods: {
    onSubmit() {
      var text = "Please insert ";
      for (let i = 0; i < Constant.REGISTER_INFOS.length; i++) {
        if (Constant.REGISTER_INFOS[i].info == "") {
          text = text + Constant.REGISTER_INFOS[i].title.toLowerCase() + ", ";
        }
      }
      alert(text);
    },
    usernameValidate() {
      if (Constant.REGISTER_INFOS[0].info.length < 4) {
        alert("Username is too short");
        return false;
      }
    },
  }
});

然后，您想使用this关键字调用另一个方法，以访问此 Vue 实例上的其他方法。

所以onSubmit()可能看起来像：

    onSubmit() {
      var text = "Please insert ";
      for (let i = 0; i < Constant.REGISTER_INFOS.length; i++) {
        if (Constant.REGISTER_INFOS[i].info == "") {
          text = text + Constant.REGISTER_INFOS[i].title.toLowerCase() + ", ";
        }
      }
      this.usernameValidate();
      alert(text);
    },

虽然这段代码有一些大问题，但实际上并没有什么值得注意的，因为没有对返回值做任何事情。

处理此问题的更好方法是：

1. 从usernameValidate返回 true 或 false，取决于它是否成功，并在if语句中检查它。
2. 更改usernameValidate方法的签名以获取argument 。 这意味着我们可以对任何输入重复使用此功能，使其更加灵活。

通过这两个更改，我们最终得到以下结果：

const App = new Vue({
  methods: {
    onSubmit() {
      var text = "Please insert ";
      for (let i = 0; i < Constant.REGISTER_INFOS.length; i++) {
        if (Constant.REGISTER_INFOS[i].info == "") {
          text = text + Constant.REGISTER_INFOS[i].title.toLowerCase() + ", ";
        }
      }
      if (this.usernameValidate(Constant.REGISTER_INFOS[0].info) {
        alert(text);
        return true;
      }
      alert("Registration Failed!");
      return false;
    },
    usernameValidate(username) {
      if (username.length < 4) {
        alert("Username is too short");
        return false;
      }
      return true;
    },
  }
});

希望这可以解决一些问题，并且可以让您对总体编程有更多的了解。

说了这么多，我强烈建议从头开始学习 JavaScript，然后再陷入框架（VueJS 就是这样）之类的东西。 从长远来看，了解编程、条件逻辑等的核心原则会让你更有能力，而仅仅从 StackOverflow 中抓取代码片段只会让你大发雷霆，并被困在一个问题上好几天一次。