Почему функция не объявлена?

Question

[Roweb]

window.addEventListener('load', function() {
function f(){
  console.log('12');
}
setInterval('f()', 1000)
 })

Объявляю функция f(), вызываю ее через setInterval, но браузер сыпет ошибки о том, что f не объявлена. Я так понимаю это связано с замыканиями

Comments

[Rustam Bainazarov]

function f(){
  console.log('12');
}

window.setInterval(function(){
  f();
}, 1000);

Ну или:

function f(){
  console.log('12');
}

setInterval(f, 1000)

[Rustam Bainazarov]

Работает ли этот код, что я написал? Да фиг его знает, если честно. Посмотрите, мне самому интересно. Что-то из двух должно :)))

[Roweb]

Рустам Байназаров, я дополнил код. Оказывается дело в том что этот код был вложен внутрь другой функции. Из-за этого не срабатывало

Answer 1

[dollar]

Потому что закавыченный код выполняется в глобальной области видимости. Так устроены функции setInterval и setTimeout, увы и ах. Пример:

function test() {
	let x = 123;
	setTimeout("alert(x)",0); // x не видна
}
test();

Если нужна именно строка, то оберните код в функцию eval, она выполняется в локальной области видимости:

function onload() {
	function f(){
		console.log('12');
	}
	setInterval(e=>eval("f()"), 1000)
}
onload();

Иначе просто используйте ссылку на саму функцию, то есть f вместо "f()"

Comments

[Roweb]

Не подскажите как лучше решать проблему? call и apply?

[dollar]

Roweb, Вы не описали проблему. Не понятно, чего вы хотите добиться. Какую задачу решаете. А накодить можно всё, что душе угодно)

[dollar]

Минимальные исправления вашего кода, чтобы просто работало:

window.addEventListener('load', function() {
	function f(){
		console.log('12');
	}
	setInterval(f, 1000)
});

[Roweb]

dollar, Нужно чтобы работало также как здесь

function f(){
  console.log('12');
}
setInterval('f()', 1000)

[dollar]

Также - это как? Вы берете чужой код, который решает задачу, отличную от вашей. Поэтому его нужно переделать, то есть адаптировать под ваши нужды. Нельзя просто взять и скопипастить, чтобы при этом у вас всё было и вам за это ничё не было. Скажите, что за задача - тогда, возможно, можно будет что-то придумать.

[Roweb]

dollar, Это мой код). Нужно хорошо разобраться в областях видимости мне

[dollar]

Области видимости в JavaScript легко гуглятся. Вам нужно просто прочитать 2-3 статьи, вникнуть, и этого будет достаточно.

А в функциях setInterval и setTimeout лучше не использовать строку вместо функции. Также лучше отказаться от eval. Также желательно отказаться от всяких onclick непосредственно в тегах. А также не подключать скрипты через создание тега script. Всё это грязные приёмы, по сути лазейки, которые нужны для очень специфических целей и являются плохим тоном в программировании.

[Roweb]

не подключать скрипты через создание тега script

Имеется ввиду не писать внутри script а ссылаться на ресурсы?

[dollar]

Имеется в виду не делать так:

var tag = document.createElement('script');
tag.innerText = 'alert(123)';
document.head.appendChild(tag);

То есть любой вид динамического компилирования - это плохо.