Question

$('#dgInput').on('keypress', function(e) {
    if (e.keyCode == 13) {
    // here is a huge code block
}

为了提高可读性，我需要将代码放在if语句之外。

我尝试-$('#dgInput').on('keypress', function(e.keyCode = 13) {-不起作用

也-if (e.keyCode == 13) {continue;}-不起作用。

有办法吗？

Answer 1

您可以声明一个函数并在内部使用它。

function doSomeMagic(){
  // Do some magic here
}


$('#dgInput').on('keypress', function(e) {
  if (e.keyCode == 13) {
    // here is a huge code block
    doSomeMagic();
  }
}

OR

function handleOnEnterPress(e){
 if (e.keyCode == 13) {
   // here is a huge code block
 }
}


$('#dgInput').on('keypress', function(e) {
  handleOnEnterPress(e);
}

Answer 2

如果要退出功能，请使用return，而不要使用continue。

if (e.keyCode != 13) {
    return;
}
// Large block of code now goes here

如果您只想移动一大段代码（即，如果您想在if条件之后执行操作），则将其放在函数中，然后在您的条件中调用该函数。

if (e.keyCode == 13) {
    do_the_thing(e);
}
// Do more things

Answer 3

您可以将现有代码块重构为一个函数：

function doStuff(param1, param2){
  // Work with the paramters here
  // Do some other things
  // May be, return a value
}

可以从原始代码调用doStuff函数：

$('#dgInput').on('keypress', function(e) {
                                 if (e.keyCode == 13) {
                                      // Do some initial work here
                                      let result = doStuff(param1, param2);
                                      // May be, do something with the result here
                                 }
}

如果doStuff函数确实很大，则可以将其进一步重构为多个可管理的函数-doStuff调用doThis等。通常，此函数具有5至10行代码，最好具有相关功能（例如，计算税收功能接受一些参数，例如金额，费率，折扣，然后返回税收值），使其可读并因此可维护。

这里有很多与代码重构有关的信息。通常，它适用于所有语言。网上的一些研究也可以帮助您发现有用的想法。

编辑：

请注意，没有规则在if块中应该有一个函数（例如doStuff）。一个人可以在块中调用多个函数，例如这样（有时这些函数可以重用）。

if (e.keyCode == 13) {
    // Do some initial work here
    let result = doStuff(param1, param2);
    doStuff2(result);
    doStuff3();
    // Do something with the result here
}

在函数中的“ if”语句之外放置大量代码？

3 个答案: