首页 > 解决方案 > 如何组织我的 Javascript 对象/模块?

问题描述

因此,我一直在尝试使用 javascript 中的模块,并使用包含要导入主文件的数据的 javascript 对象创建了几个不同的 js 文件。

但是,我想知道这是否是存储所有这些数据的最佳方式,我应该自动化一些东西,还是应该学习如何制作一个 API 来存储所有这些数据?存储此信息并导入它的最佳方式是什么。

有经验的开发人员通常将此类数据存储在哪里?或者这已经是存储我所有数据的最佳方式,我应该将它们全部组织在单独的文件夹中?

这是我用来存储数据并导入到我的主要 js 文件中的 1 个文件的示例。

White_Keys.js


/*  {White key Sounds} */
export const soundStores = {
    soundOne: document.getElementById('myAudio'),
    soundTwo: document.getElementById('myAudio2'),
    soundThree: document.getElementById('myAudio3')
};






/*  {White Key Grabbing} */

export const keyGrab = {
    key_F: document.getElementsByClassName('white b'),
    key_G: document.getElementsByClassName('white a'),
    key_A: document.getElementsByClassName('white g')
};


标签: javascriptapiobject

解决方案


只是我的两分钱:

对此没有“正确方法”或“最佳方法”,您可以探索一些中小型项目来检查文件夹结构,它们不太可能完全相同,但可能有一些共同点。

以我公司的项目为例: 我们主要根据文件类型和功能来分离文件:

  1. 页面文件放在一个文件夹中,可能相同类别的页面放在同一个子文件夹中
  2. redux 或 mobx 的存储文件放在一个文件夹中
  3. api 请求转到另一个文件夹
  4. css 继续文件夹和页面 css 创建为文件或折叠取决于复杂性
  5. 如果需要,组件转到一个文件夹和子文件夹
  6. 为其他脚本或资产(如果有)创建相应的文件夹

我认为这是一种组织项目文件的常用方法,根据功能或文件扩展名收集类似文件,我还看到其他项目组所有使用的文件在一个地方一起提供相同的功能,所以如果想要移动或复制这个功能到其他项目,只需复制目录即可。

所以不同的方法各有利弊,你可以根据自己的需要来选择,我假设你只是一个初学者,随着你经验的增长它会来找你


推荐阅读