Javascript 调用函数一次，然后将其自身删除

我想在纯Javascript中实现以下内容

单击按钮时，会调用函数

<button id= "myButton", onclick="onlyOnce()">Hit me</button>

当我第一次按下按钮时，我看到

只有一个呼叫和
其他函数，因此这是正确的

当我继续按下按钮时，我仍然看到
只有一个呼叫和
其他函数
，这是错误的，因为
onlynce
没有自行分离。我该如何解决这个问题

谢谢
这里有一个更好的解决方案（不覆盖对其他函数的引用）：

和HTML：

<button id= "myButton">Hit me</button>

打我

一种方法是：

function onlyOnce() {

    console.log("onlyOnce called!");

   //do some code...
   otherFunction();

   document.getElementById("myButton").onclick = otherFunction; // assign the other function to the onclick property of the element.
}

您可以使用一个函数来完成此操作，该函数将所有调用委托给其他函数，这些函数在创建事件处理程序时配置

function once(first,others){
  var isFirstTime = true;
  return function(e){
        if(isFirstTime){
            first(e);
            isFirstTime = false;
        }
        else{
            others(e)  
        }
  }
}

下面是一个例子


功能一次（第一次，其他）{
var isFirstTime=true；
返回函数（e）{
如果（是第一次）{
第一（e）；
isFirstTime=false；
}
否则{
其他（e）
}
}
}
函数onceOnly（）{
控制台日志（“仅一次”）；
}
函数每隔一次（）{
控制台日志（“其他时间”）；
}
document.getElementById（“单击”）.addEventListener（“单击”，一次（一次，每次））
点击我

打我
var onlyOnce=函数（）{
onlyOnce=function（）{}；//一旦运行，它将被设置为空对象，并且不会再次运行
log（“onlyOnce called！”）；
//做一些代码。。。
otherFunction（）；
document.getElementById（“myButton”）.addEventListener（“单击”，其他函数，false）；
document.getElementById（“myButton”）.removeEventListener（“单击”，仅限一次，错误）；
}
函数otherFunction（）{
log（“调用了其他函数！”）；
}
/*另类
var onlyOnce=函数（）{
log（“onlyOnce called！”）；
onlyOnce=其他函数；
//做一些代码。。。
otherFunction（）；
} 
*/

致以最良好的祝愿
 在这种情况下，使用布尔值（例如，
firstCall
）并在第一次调用时将其设置为false会更简单。然后您可以简单地使用
if（firstCall）{}else{}
Aha，因此唯一的区别是您没有在HTML部分预定义
onClick
。对吗？还可以用javascript以编程方式添加事件侦听器，而不是HTML中的声明性语法。没问题。如果您能通过接受答案将您的问题标记为已解决，将不胜感激。谢谢。到目前为止，答案更清晰，编辑量更少。实际上，我看到它是有效的。理论上我不明白为什么。与我的逻辑相同，只有
。onclick
可以覆盖
添加/删除EventListener
？请解释一下背后的逻辑。ThanksIt替换了您在创建按钮时设置为onclick函数的旧函数（好的，它不会再次运行。但它确实被删除了吗？我认为它不会被分离，因为当我在控制台上导入您的解决方案并执行
getEventListeners（myButton）
时，我得到了
对象{click:Array[2]}
当我实现其他解决方案时，我得到了
对象{click:Array[1]}
var onlyOnce=function（）{console.log（“onlyOnce调用！”）；onlyOnce=otherFunction；//执行一些代码…otherFunction（）；}它不会分离，但这是一个技巧，它不会再次运行，上面是另一个技巧，在初始运行后将onlyOnce设置为otherFunction。设置onlyOnce=otherFunction将删除onlyOnce的初始功能并将其设置为otherFunction。我希望这有帮助！
function onlyOnce() {

    console.log("onlyOnce called!");

   //do some code...
   otherFunction();

   document.getElementById("myButton").onclick = otherFunction; // assign the other function to the onclick property of the element.
}

function once(first,others){
  var isFirstTime = true;
  return function(e){
        if(isFirstTime){
            first(e);
            isFirstTime = false;
        }
        else{
            others(e)  
        }
  }
}

    <button id= "myButton", onclick="onlyOnce()">Hit me</button>
    <script type="text/javascript">

        var onlyOnce = function() {
            onlyOnce = function(){}; //As soon as it runs, it will be set to an empty object and will not run again
            console.log("onlyOnce called!");

            //do some code...
            otherFunction();
            document.getElementById("myButton").addEventListener("click", otherFunction, false);    
            document.getElementById("myButton").removeEventListener("click", onlyOnce, false);  
        }

        function otherFunction() {
            console.log("otherFunction called!");
        }
    </script>
    /* alternative
    var onlyOnce = function() { 
     console.log("onlyOnce called!"); 
     onlyOnce = otherFunction; 
     //do some code... 
     otherFunction(); 
   } 
  */
</body>