时间戳

首页 > 解决方案 > 如何将某些内容返回给事件侦听器调用的函数？

javascript - 如何将某些内容返回给事件侦听器调用的函数？

问题描述

如果函数被事件侦听器调用，是否可以返回函数的结果？我尝试了很多方法，但没有任何效果。令我惊讶的是，没有太多关于它的信息可以帮助我。我想传入当前分数，当事件发生时将其加一并返回。显然，我在下面所做的将不起作用，因为 a) return 语句没有存储空间，b) 它由事件侦听器调用。我唯一要做的就是更改函数内的全局变量。我知道如果包裹在 IIFE 或它自己的封闭装置中不会那么有害，但我仍然不想养成这样做的习惯。无论如何将分数增加 1 并且不直接引用函数内部的全局分数变量，谢谢大家

const btn = document.querySelector('#btn');

let score = 0;

btn.addEventListener('click', function () {

    increaseScore(score); // passing in the current score varialble
})


function increaseScore(currentScore) { 

    currentScore++;
    return currentScore;      // there is nowhere to return this!!

}

标签： javascriptfunctionreturnglobal-variablesaddeventlistener

解决方案

诀窍是你需要绑定上下文（this）

  someMethod.bind(this);


const btn = document.querySelector('#btn');
const scoreBtn = document.querySelector('#score');

let score = 0;


btn.addEventListener('click', function() {
  event.preventDefault();
  someMethod.bind(this);
  score = someMethod(score);
});

scoreBtn.addEventListener('click', function() {
  event.preventDefault();
  console.log(score);
});

function someMethod(cur) {
 return cur + 1; 
}
<button id="btn">Update Score</button>
<button id="score">Show Score</button>

推荐阅读