javascript - 你如何组织你的 Javascript 代码?

标签 javascript

当我第一次开始使用 Javascript 时,我通常只是将所需的内容放入函数中,并在需要时调用它们。就是那时。

现在,我正在使用 Javascript 构建越来越复杂的 Web 应用程序;利用其响应更快的用户交互,我意识到我需要使我的代码更具可读性 - 不仅对我来说,而且对任何取代我的人来说。除此之外,我希望减少几个月后当我阅读自己的代码时“到底是什么,为什么我要这样做”的时刻(是的,我在这里说实话,我确实知道我到底是什么尽管我尽力避免这种情况,但我自己也有思考的时刻)

几周前,我进入了 Joose,到目前为止,一切都很好,但我想知道其他人如何将他们的代码分成有意义的片段并可供下一个程序员读取。

除了使其可读之外,您还采取了哪些步骤将 HTML 与代码逻辑分开?假设您需要创建包含数据的动态表行。您是否将其包含在 Javascript 代码中,将 td 元素附加到字符串中,或​​者执行其他操作。我正在寻找现实世界的解决方案和想法,而不是某些专家提出的一些理论想法。

所以,如果您不理解上述内容,您是否使用 OOP 实践?如果不会你用什么?

最佳答案

对于真正大量使用 JS 的应用程序,您应该尝试模仿 Java。

  • HTML 中的 JS 尽可能少(最好是仅调用引导函数)
  • 将代码分解为逻辑单元,并将它们全部保存在单独的文件中
  • 使用脚本将文件连接/缩小为一个包,您将将该包作为应用的一部分
  • 使用 JS 命名空间以避免弄乱全局命名空间:

 

var myapp = {}; 
myapp.FirstClass = function() { ... }; 
myapp.FirstClass.prototype.method = function() { ... }; 
myapp.SecondClass = function() { ... }; 

即使您没有使用任何框架,结合使用所有这些技术也会产生一个非常易于管理的项目。

关于javascript - 你如何组织你的 Javascript 代码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1344605/

相关文章:

javascript - javascript 变量指向一个值是否正确?

javascript - Highcharts 点单击事件返回 "hover"状态而不是 "select"状态

javascript - 使用javascript点击创建新的表单字段

javascript - Node-Webkit (nwjs) Node 远程用法

javascript - 如何在 React 应用程序中外部化选择选项?

javascript - 使用react-bootstrap从数组动态创建下拉菜单选项

javascript - 需要帮助处理 Django 中的日期格式

javascript - 浏览器中的客户端服务器?

javascript - 使用 jquery 的远程图像属性

javascript - 如何将设备方向映射到 MozOrientation 值