Как передать параметр функции без его немедленного запуска?

У меня есть странная проблема с попыткой объединить несколько динамичный дисплей Google Maps. У меня есть наложения на карте, которые я бы назвал функцией при нажатии. Сначала у меня было все жестко закодированное, поэтому у меня была функция для каждого наложения, например:

google.maps.event.addListener(southEast, 'click', showSouth);
function showSouth() {
   // do stuff
}

Это работало без проблем, но затем я сделал всю страницу более динамичной, поэтому я решил сделать одну функцию, которая будет передавать идентификатор, а затем отображать на основе этого, что, как я считаю, должно было быть настроено изначально в любом случае, Я изменил код, чтобы больше походить на это:

google.maps.event.addListener(southEast, 'click', showArea(1));
function showArea(id) {
   // do stuff based on that id
}

Функция работала, но проблема в том, что она сразузывается при загрузке страницы. После изучения я узнал, что когда вы вызываете функцию с круглыми скобками, эта функция вызывается немедленно, а затем ссылается на возвращаемое значение. источник

Итак, теперь я немного зациклен на том, как именно передать этот идентификатор функции без немедленного вызова функции. Я нашел некоторые хакерские способы сделать это, что могло бы работать, но я чувствую, что это не должно быть чем-то, что я должен взломать вместе...

Ответ 1

Имейте showArea вернуть функцию, которая работает с идентификатором.

function showArea(id) {
   return function() {
       // do stuff with id
   };
}

Возвращенная функция закрывается над id, поэтому она продолжает ссылаться на нее и передается в addListener для использования в качестве обработчика.


В качестве альтернативы вы можете просто встроить функцию, которая вызывает showArea(1)...

google.maps.event.addListener(southEast, 'click', function() { showArea(1); });
function showArea(id) {
   // do stuff based on that id
}

Это будет работать, потому что вы жестко кодируете 1. Если бы это была переменная, которая могла бы измениться, как в цикле, вы бы использовали первый пример.

Ответ 2

Попробуйте использовать bind().

Вы также можете использовать bind() который связывает эту функцию и позволяет передавать параметры этому методу, не запуская метод при инициализации.

google.maps.event.addListener( southEast, 'click', showArea.bind( this, 1 ) );

С bind() первым параметром всегда является контекст (например, this), и любые другие параметры будут переданы самому методу. Так,

  • ваш первый параметр метода передается как второй параметр в bind,
  • ваш второй параметр метода передается как третий параметр в bind,
  • и т.п.

Заметьте, я не эксперт Javascript, поэтому не уверен, есть ли какие-либо последствия для этой стратегии, которую я пропускаю.

Ответ 3

myFunction(msg) {console.log(msg)} // example function

myFunction('hello world') // myFunction called "immediately"

() => myFunction('hello world') // myFunction not called here; returns myFunction

function() { return myFunction('hello world') } // myFunction not called here; returns myFunction