Переместить функцию за пределы цикла

#javascript #function #for-loop #undefined

#javascript #функция #for-цикл #не определено

Вопрос:

Я пытаюсь вывести функцию за пределы цикла, а затем вызвать ее изнутри, но я не уверен, как это сделать.

 const links = document.querySelectorAll( 'a' );

for ( let i = 0; i < links.length; i   ) {

    links[i].addEventListener( 'click', ( event ) => {
        const targetID = '#' === event.currentTarget.getAttribute( 'href' ) ? 'start' : event.currentTarget.getAttribute( 'href' );
        ...rest of the function...
    } );
}

Это то, что я пробовал до сих пор:

 const links = document.querySelectorAll( 'a' );

function smoothScrolling( event ) {
    const targetID = '#' === event.currentTarget.getAttribute( 'href' ) ? 'start' : event.currentTarget.getAttribute( 'href' );
    ...rest of the function...
}

for ( let i = 0; i < links.length; i   ) {

    links[i].addEventListener( 'click', smoothScrolling( event ) );
}

Я не уверен, почему, но я получаю следующую ошибку: Uncaught TypeError: Cannot read property 'currentTarget' of undefined .

Ответ №1:

У вас почти получилось… Проблема в том, что вы ВЫЗЫВАЕТЕ функцию и передаете результат. Вместо этого вы просто хотите передать саму функцию, как будто это был объект. Попробуйте это:

 const links = document.querySelectorAll( 'a' );

function smoothScrolling( event )
{
     const targetID = '#' === event.currentTarget.getAttribute( 'href' ) ? 'start' : 
     event.currentTarget.getAttribute( 'href' );
     ...rest of the function...
}

for ( let i = 0; i < links.length; i   )
{
    links[i].addEventListener( 'click', smoothScrolling );
}

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