Как подключить скрипт из другого файла и получить из него данные?

Оффтоп javascript
1

Привет всем! У меня возникла проблема с подключением внешнего JavaScript файла. Я пытаюсь вызвать файл из функции, и вроде бы он подгружается (я даже пробовал добавить в него alert для проверки). Но я не могу понять, как вернуть из него значение и заполнить массив.

Вот примерный код того, что я пытаюсь сделать:

function загрузитьСкрипт(файл) {
  const скрипт = document.createElement('script');
  скрипт.src = файл;
  скрипт.type = 'text/javascript';
  скрипт.async = true;
  
  скрипт.onload = function() {
    console.log('Скрипт ' + файл + ' загружен');
  };
  
  document.head.appendChild(скрипт);
}

let команды = загрузитьСкрипт('данные.js');

// В файле данные.js:
let список = [];
for (let i = 0; i < 4; i++) {
  список.push({название: 'Команда ' + i});
}
return список;

Как мне правильно получить данные из внешнего файла и использовать их в основном скрипте? Буду благодарен за любую помощь!

2

В твоем случае лучше использовать модули ES6. Создай в данные.js экспорт:

export const список = [
{название: ‘Команда 0’},
{название: ‘Команда 1’},
// …
];

А в основном файле импортируй:

import { список } from ‘./данные.js’;

console.log(список);

Не забудь добавить type=“module” в тег script. Так проще и надежнее работать с внешними данными, чем динамически подгружать скрипты.

3

Есть еще вариант с использованием AJAX. Можно сделать GET-запрос к файлу данные.js и получить его содержимое как текст. Потом просто выполнить этот код через eval() или новую Function(). Примерно так:

fetch(‘данные.js’)
.then(response => response.text())
.then(code => {
let команды = new Function(code + ‘; return список;’)();
console.log(команды);
});

Только учти, что eval может быть небезопасен, если код из ненадежного источника.

4

слушай, я сам недавно с этим мучился! попробуй использовать промисы. создай в данные.js функцию, которая возвращает твой список, например getСписок(). а в основном файле сделай так:

загрузитьСкрипт(‘данные.js’).then(() => {
let команды = getСписок();
console.log(команды);
});

функция загрузитьСкрипт должна возвращать промис, который резолвится когда скрипт загрузился. так ты сможешь дождаться загрузки и потом использовать данные. надеюсь поможет!