Как уменьшить выделение памяти и избавиться от замыканий?

Question

[dollar]

Нужно, чтобы перед вторым ajax были освобождены все ресурсы, относящиеся в первому ajax. То есть удалить xhr из памяти до создания xhr2. Но последовательность вызовов такая же - второй ajax происходит только после получения ответа от первого ajax.

function getData() {
	let result;
	let xhr = new XMLHttpRequest();
	xhr.open('GET', 'http://site1.com');
	xhr.send();
	xhr.onload = function() {
		let xhr2 = new XMLHttpRequest();
		xhr2.open('GET', 'http://site2.com');
		xhr2.send();
		xhr2.onload = function() {
			result = xhr.response[0] + xhr2.response[0];
		}
	}
	return result;
}

Answer 1

[Антон Спирин]

Можно обернуть вызов xhr в Promise:

function promiseWrapper(url) {
  return new Promise(resolve => {
    const xhr = new XMLHttpRequest();
    xhr.open('GET', url);
    xhr.send();
    xhr.onload = () => {
      resolve(xhr.response);
    };
  });
}

вызвать последовательно:

async function getData() {
  const [res1] = await promiseWrapper(url1);
  const [res2] = await promiseWrapper(url2);

  return res1 + res2;
}

и уповать на сборщик мусора.

Answer 2

[Иван Чернышев]

Если коротко, то это невозможно сделать, так как памятью JS управляет самостоятельно.
Если очень-очень хочется, то первой строчкой в функциональном выражении можно сделать xhr = undefined, но я бы крайне не рекомедовал

Answer 3

[Adamos]

window.myObject = {
  urls: ['http://site1.com', 'http://site2.com'],
  sum: '',
  indx: 0,
  add: function(str) {
    this.sum += str;
    if(++this.indx < this.urls.length) {
      this.run();
    } else {
      alert('Result is ' + this.sum);
    }
  },
  run: function() {
    let xhr = new XMLHttpRequest();
    xhr.open('GET', this.urls[this.indx]);
    xhr.send();
    xhr.onload = function() { window.myObject.add(xhr.result[0]); }
  }
};
window.myObject.run();