Блог

Я пытаюсь создать простаивающую «игру», и я столкнулся с этой проблемой. Я хотел вызвать функцию с прослушивателем событий, которая принимала переменную и добавляла 1 (при запуске) в основном:

 const add = (x) =>{
    x = x   1
}
foo.addEventListener("click", function(){add(var)})
 

Я проверил, что метод изменения переменной внутри функции осуществляется через функцию возврата; однако здесь это не работает, потому что я не могу вернуться к eventlistener . Пожалуйста, помогите

Решение, по-прежнему используя значение (число) в качестве аргумента функции

 // The function could return the result like so:
const add = (x) => {
  return x   1;
}

var x = 5;
var foo = document.getElementById("foo");

// The caller should update "x" by the result of function:
foo.addEventListener("click", function () { 
  x = add(x); 
  console.log("x after click is: ", x);
});   
console.log("original x is: ", x); 

 <button id="foo">click me (function with Number (value))</button> 

Решение путем использования объекта / ссылки вместо значения в качестве аргумента функции

Вы можете использовать объект вместо числового или строкового (или примитивных типов) значения в качестве аргумента функции, чтобы модификация в функции обновляла объект по ссылке (что невозможно при передаче числового или строкового значения).
См. https://medium.com/nodesimplified/javascript-pass-by-value-and-pass-by-reference-in-javascript-fcf10305aa9c

 const add = (xObject) => {
  if (!xObject || !xObject.count) {
    // Not a valid object
    return;
  }
  xObject.count  ; // obj = obj   1
}

let xObject = { count : 5 };
let foo = document.getElementById("foo");
foo.addEventListener("click", function () { 
  add(xObject); 
  console.log("number after click is: ", xObject);
});   
console.log("original number is: ", xObject); 

 <button id="foo">click me (function with object (reference))</button> 

Во Javascript всех примитивных типах ( numbers , strings , и т.д. …) передаются по значению, за исключением objects тех, которые передаются value of the reference . Здесь есть хорошее объяснение. Итак, вы не можете делать то, что, я думаю, вы хотите сделать, и я предполагаю, что вы хотите передать переменную C-like reference . Однако одна вещь, которую вы можете сделать (не рекомендуется), это использовать глобальный window объект для доступа к глобальной переменной по его имени.

 var x = 0;

const add = (x) => {
    window[x] = window[x]   1;
}

document.getElementById("test").addEventListener("click", function()
{
    add("x");
    console.log("x is now: "   x);
}) 

 <button id="test">Click Me</button> 

Вы можете взять другую переменную y и сохранить плюс 1 значение. Он доступен после щелчка.

 var y=0;
 const add = (x) => {
        y = 1   y;
    }
    var foo = document.getElementById("foo");
    foo.addEventListener("click", function () { add(); console.log(y) }); 

 <button id="foo">click me</button>