Почему переменная smth недоступна?

Question

[tehnazavr]

Приведённый код упрощён, чтобы не писать лишнего. Есть переменная smth, которая в одной функции доступна нормально, а в другой - она почему-то underfined, и я не понимаю почему. Из-за чего это может быть? Где я косячу ?

var smth;

function func1(){
	let x = new XMLHttpRequest();
	x.open("GET", url)
	x.send();
	x.onreadystatechange = function (){
		if (x.readyState == 4){
			for (let j=0; j<5;j++){
				func2();
				console.log(smth)  //Здесь smth - underfind
			}
		}
	}
}

function func2(){
	let request = new XMLHttpRequest();
	request.open("GET", url)
	request.send();
	request.onreadystatechange = function (){
		if (request.readyState == 4){
			smth = request.response;
			console.log(smth);  //Здесь smth доступна
		}
	}
}

for (let i=0; i<6; i++){
	func1();
}

Answer 1

[Rsa97]

Потому что в func2 вы сами задали локальную переменную smth строчкой выше вывода её в консоль, а в func1 такой переменной нет.

Comments

[tehnazavr]

Объявил я переменную в самом начале. А в func2 только прировнял к результату запросу. Или нет? Если я не прав, то как я должен присвоить переменной smth новое значение, так чтобы и в func1 она была доступна с этим значением? Да и как это нет в func1, она есть, но значение у нее underfind

[Rsa97]

tehnazavr, Поскольку вы меняете переменную в каллбэке асинхронного вызова XMLHttpRequest, а JavaScript работает в один поток, то все вызовы каллбэков выполнятся после того, как отработает основной скрипт. То есть, у вас получается следующий порядок выполнения:

func1() // вызов 1
func1() // вызов 2
func1() // вызов 3
func1() // вызов 4
func1() // вызов 5
func2() // вызов 6
callback1() // вернувшийся раньше всех ответ
func2() // вызов 1
func2() // вызов 2
func2() // вызов 3
func2() // вызов 4
func2() // вызов 5
callback1() или callbcak2() // ответ, вернувшийся вторым
...

То есть, на момент вывода из func1 значение переменной ещё нигде не задано.

[tehnazavr]

Rsa97, получается синхронно надо в данном случае запросы слать?

[Rsa97]

tehnazavr, Крайне не рекомендуется. Синхронные запросы будут ждать прихода ответа, никакие другие действия через JS в это время работать не будут.
Если ориентируетесь на современные браузеры и согласны обойтись без IE - используйте промисы или async/await. Если нужна поддержка старых версий, то осваивайте каллбэки.