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

Question

У меня возникла странная проблема с попыткой соединить несколько динамичный дисплей 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
}

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

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

Answer 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,Если бы это была переменная, которая могла бы измениться, как в цикле, вы бы использовали первый пример.

Answer 2

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

Answer 3

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

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

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

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

• ваш первый параметр метода передается как second параметр в bind,
• your second *Параметр метода 1021 * передается как третий параметр в bind,
• и т. Д.

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