Почему функция () иногда нужна в JavaScript? - PullRequest
Новая
       25

Почему функция () иногда нужна в JavaScript?

3 голосов
/ 10 ноября 2010

HTML 

<button id='hello'>Click Me!</button>

JavaScript (неверный) 

$('#hello').click(alert('Hello, World!'));

JavaScript (правильный) 

$('#hello').click(function() {
    alert('Hello, World!');
}

Мне интересно, почему первый код JS срабатывает насобытие load вместо click .Может кто-нибудь сказать мне, почему function() { [code] } необходим для правильной работы скрипта?

В этом примере я использовал события jQuery, но это не относится к нему, например, мне нужно использовать его с setTimeout тоже.

Ответы [ 9 ]

12 голосов
/ 10 ноября 2010

Функция click ожидает другую функцию в качестве параметра.

В первом случае вы должны передать результат вызова alert('hello world');, который является нулевым.

Второй - это просто сокращение для: 

$('#hello').click(callback);

function callback(){
  alert('hello world');
}
2 голосов
/ 10 ноября 2010

Синтаксис function() { ... } - это способ объявления анонимной функции в Javascript.jQuery использует множество из них, чтобы указать, что какое-то действие будет выполнено позже, например, когда происходит событие.Вы можете думать об этом как о задержке выполнения вашей функции до тех пор, пока это не будет необходимо.Без этого синтаксиса любой код, который вы размещаете там, оценивается немедленно, а это не то, что вам нужно для обработчика событий.

Вы можете подумать: «Почему JavaScript не настолько умен, чтобы понимать разницу?Подумайте над этим: 

function returnCallback(linkId, data) {
    return function(e) {
        alert('Clicked on ' + linkId + '.  Here is some data: ' + data);
        // Maybe do some stuff with e, the event parameter
    }
}

$('#some-link').click(returnCallback('some-link', 'some-data'));

$('#other-link').click(returnCallback('other-link', 'different-data'));

Это надуманный пример, но он иллюстрирует силу анонимных функций и замыканий.Это работает, так как returnCallback возвращает функцию.

2 голосов
/ 10 ноября 2010

Ваш первый пример говорит: "оцените

alert ('Hello, World!')

прямо сейчас и передайте результат в качестве аргумента для нажатия."

Второй говорит: «Определите функцию, которая будет выдавать предупреждение, когда я ее вызываю, и передавать всю эту функцию в качестве аргумента для щелчка.

2 голосов
/ 10 ноября 2010

Потому что .click() это обработчик. Первый аргумент - это функция для назначения. Но если вы действительно передадите функцию с аргументами, она вызовет функцию (в данном случае alert), а затем передаст возвращаемое значение.

Написание $('#hello). Click (function () {}) `- это, по сути, сокращение для записи: 

var myfunction = function() { 
  // code
};

$('#hello').click( myfunction );

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

1 голос
/ 10 ноября 2010

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

<script language="javascript" type="text/javascript">

    $("#mybutton").click(clickFired);


    function clickFired() {

        alert('click fired');
    }

</script>
1 голос
/ 10 ноября 2010

В первом случае, «JavaScript неправильный», вы фактически вызываете alert('Hello, World!') в тот момент, когда скрипт загружен. Причина, по которой вы передаете функцию .click функции, заключается в том, что она может вызывать ее в любой момент. По сути, вы упаковываете код вместе, чтобы запускать (или вообще не запускать) в любой момент, когда вы помещаете его в функцию.

$('#hello').click(alert('Hello, World!')); пытается запустить alert('...') и передать возвращаемое значение в функцию .click(), которая не будет работать должным образом.

0 голосов
/ 10 ноября 2010

somefunction (alert ('hello! World'));

это будет означать, что вы хотите передать какой-либо функции возвращаемое значение alert ("привет! Мир").

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

0 голосов
/ 10 ноября 2010

Функция щелчка здесь присваивает значение обработчику событий.

С первым («неправильным») кодом вы присваиваете значение alert('Hello, World!'), которое само по себе является вызовом функции, поэтому оно будет немедленно оценено и, следовательно, появится при загрузке.

Со вторым («правильным») кодом вы теперь назначаете новую анонимную функцию, которая не выполняется сама по себе, только что создала экземпляр при загрузке. Следовательно, это будет работать, как и ожидалось позже.

0 голосов
/ 10 ноября 2010

Параметр, необходимый для функции .click (), является функцией. Следовательно, $ ("# hello"). Click (function {[code]}); необходимо. Потому что нечего возвращать по alert ().

...