javascript - 取消两者 - 子级内部的父级和子级函数

Question

这是问题的简化版本。

单击按钮我需要调用函数abc并停止执行两个函数abc并单击如果x == 5;

当前情况 - abc 已取消，但 click 继续执行。

function abc(){
if(x == 5){return;}
console.log('abc');
}

var x = 5;

$('button').on('click', function(){
abc();
console.log('clicked');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button>CLICK</button>

Answer 1

如果我理解正确，您只需要从 abc 返回结果并对其进行测试:

function abc(){
  if(x == 5){
    return false;
  }
  console.log('abc');
  return true;
}

var x = 5;

$('button').on('click', function(){
    if (abc()){
       console.log('clicked');
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button>CLICK</button>

顺便说一句，你应该avoid defining global variables (x) like this 。相反，使用闭包来定义作用域变量。更像是:

var closure = function(){
  function abc(){
     if(x == 5){
        return false;
     }
     console.log('abc');
     return true;
   }

  var x = 5;
  
  return {abc:abc};
}();

$('button').on('click', function(){
    if (closure.abc()){
       console.log('clicked');
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button>CLICK</button>

这称为 Revealing module pattern