从主脚本文件中分离数组

Question

我正在开发一个 Javascript 代码，它可以从较小的字符串集生成随机文本。问题是为了使代码易于阅读和扩展，我肯定必须为每个字符串变量使用一行。

类似这样的东西，非常广泛。

var array = [
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
"text",
...
]

var array_b = [
//(the same again)
]

var result = array[math.floor(math.random())] + " " + array_b[math.floor(math.random())]

不用说，很不舒服。显然，并非不可能习惯；但如果可能的话，我会摆脱那些长数组。

有办法吗？将它们放入不同的文件中，也许从另一个页面的另一个脚本中调用它们？或者什么？

Answer 1

只要确保同时加载它们并确保它们位于全局 window 对象上，您就可以将它们简单地添加到另一个文件中。这意味着不用

var array_a = []

您使用：

window.array_a = []

并且在当前文件（您完成所有工作的地方）中，您将它们引用为 window.array_a 而不仅仅是 array_a.

此外，根据您使用的编辑器，它很可能允许您出于您所描述的原因折叠任何此类数组或函数声明，这也可以解决问题。一个例子是 Sublime Text。

Answer 2

您可以将数组放入 JSON（JavaScript Object Notation）文件，然后使用 ajax 请求加载它们

data.json

["text","text","text","text","text","text","text","text","text","text",...]

main.js

//if using jQuery
jQuery.ajax({
  url:"data.json",
  dataType:"json"
}).then(function(data){
   //'data' will be your array use it
});

//if not using jQuery
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        //parse the JSON text
        var data = JSON.parse(xmlhttp.responseText);
        //call a function passing it the array
        response(data);
    }
};
xmlhttp.open("GET", "data.json");
xmlhttp.send();

function response(data){
   //data will be your array use it
}

您也可以只将它们添加到单独的 js 文件中，然后添加第二个 <script> 元素

data.js

var data =["text","text","text","text","text","text","text","text","text","text",...]

main.html

<head>
    <script src="data.js"></script>
    <script src="main.js"></script>
</head>

从主脚本文件中分离数组

Separate arrays from main script file

javascript

arrays

readability