javascript - 处理修复数据集的最佳方法

Question

假设我们有一个包含国家/地区及其电话前缀的数据集。大致如下:

var countryPhonePrefixes = [
    {
        'name': 'Spain',
        'prefix': '+34'
    },
    {
        'name': 'Austria',
        'prefix': '+43'
    },
    // and so forth
];

这将导致您的开发代码超过 1000 行(缩小之前)。我的问题是，是否有关于如何获取或初始化此类数据集的最佳实践？

我有这样的想法:

• 将其保留在代码中并使用几乎每个 IDE 都有的折叠功能，这样就不会太麻烦。
• 将其放在单独的 JavaScript 文件中，您还可以在其中执行一些与数据集相关的其他功能。 JavaScript 库或多或少都可以工作。
• 使用 AJAX 来检索它。例如:jQuery.getJSON()来自.json文件在您的服务器中； xhttp.open() & xhttp.send()您的服务器中的 API 等。

一些额外的上下文:我需要使用此数据集来生成 <option>在整个应用程序中，有多种形式的国家/地区电话前缀选择器。应用程序中已经有一个图标选择，其工作方式类似于我提出的第一个解决方案。

Answer 1

1000 行 Javascript 数据绝对应该放在自己的文件中 - 对于开发来说，它太大了，无法与脚本逻辑存在于同一区域。

如果数据是静态的，那么您可以将其保存(并维护)在单独的文件中，同时将数据导入其他文件中。使用像 Webpack 这样的模块打包器将脚本打包成一个 .js将其交付给客户。

如果数据不是静态的(例如，可以从一个请求更改为另一个请求)，则它不能与其他数据捆绑在一起。相反，您可以:

• 通过网络请求将数据发送到客户端。这有效，但会稍微增加数据可用所需的时间。

• 另一种选择是在其自己的 <script> 中发送数据。标签。然后让你的其他Javascript解析脚本标签，例如:

const data = JSON.parse(
  document.querySelector('script[type="application/json"]').textContent
);

console.log(data);

<script type="application/json">[{"foo":"bar"}]</script>