Начиная с ECMAScript 6 (или ES6) вы можете использовать оператор export
или import
в файле JavaScript для экспорта или импорта переменных, функций, классов или любых других объектов в / из других файлов JS.
Например, предположим, что у вас есть два файла JavaScript с именами «main.js» и «app.js», и вы хотите экспортировать некоторые переменные и функции из «main.js» в «app.js». В файле «main.js» вам нужно написать оператор export
(строка №-9), как показано в следующем примере:
let msg = "Hello World!";
const PI = 3.14;
function addNumbers(a, b){
return a + b;
}
// Экспорт переменных и функций
export { msg, PI, addNumbers };
И в файле «app.js» вам нужно написать оператор import
(строка №-1), как показано здесь:
import { msg, PI, addNumbers } from './main.js';
console.log(msg); // Печатает: Hello World!
console.log(PI); // Печатает: 3.14
console.log(addNumbers(5, 16)); // Печатает: 21
В качестве альтернативы вы можете использовать jQuery-метод getScript()
для загрузки JS-файла с сервера, а затем выполнить его с помощью простой строки кода. Предположим, у вас есть JS-файл test.js со следующим кодом.
// Определяем переменных
var str = "Hi there!";
var num = 15;
// Определяем функцию
function multiplyNumbers(a, b){
return a * b;
}
Теперь вы можете загрузить этот файл «test.js» в свой скрипт с помощью метода getScript()
, например:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Load JS File Demo</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
<script>
var url = "test.js";
$.getScript(url, function(){
$(document).ready(function(){
console.log(str); // Печатает: Hi there!
console.log(num); // Печатает: 15
console.log(multiplyNumbers(4, 25)); // Печатает: 100
});
});
</script>
</body>
</html>
Подробнее см. Руководство по функциям JavaScript ES6.