如何在ASP中组织前端JavaScript代码.. NET MVC项目

How to organize front end JavaScript code in ASP.NET MVC project?

本文关键字：代码 JavaScript NET MVC 项目 前端 ASP      更新时间：2023-09-26

我有一个ASP。asp.net MVC项目，它采用了大量的JavaScript (jQuery和d3)。我是web开发的新手，所以我想请求一些关于如何组织前端脚本代码的帮助。

我目前的方式是，每个文件夹下的"视图"，只有一个相应的。js文件(这意味着所有的部分视图(.cshtml)在该文件夹下，共享该。js文件)，我显式初始化我的项目的所有.js文件在$(文档).ready()的_Layout.cshtml。

这引入了两个问题:

  1. 因为所有的部分视图都把代码放在一个.js文件中，所以它使每个.js文件都变得庞大而复杂。
  2. 因为我硬编码初始化所有.js文件时_Layout。CSHTML被加载，所以即使一个视图没有加载，它的后台。js被执行，听起来不灵活。

我的问题是:

  1. 如何让每个部分视图都有自己的。js文件(将当前的。js分成小块)
  2. 我如何加载和运行一个部分视图的.js文件，只有当该部分视图加载。
    3. 如果我使用TypeScript和KnockoutJS，它们对组织前端脚本代码有什么好处吗?

将javascript代码拆分为多个文件，以便每个js文件对应于部分视图。

然后在partial view中加载对应的js，而不是_Layout。cshtml文件。这样，相应的js只会在加载部分视图时执行。

TypeScript是一种基于类的面向对象编程风格，应用于基础javascript，由Microsoft开发和维护。这无助于组织文件，但有助于以面向对象的风格维护js代码。(链接)

KnockoutJS是应用于javascript的模型-视图-视图模型(MVVM)模式。你可以模块化每个js文件在KnockoutJS，即，单独的js模型，视图和ViewModel，但他们会有相互依赖。(见documentaion)

剥猫皮的方法有很多种。如果你有特定于部分视图的javascript代码，完全可以跳过包含文件的步骤，并通过<script>标记直接在那里嵌入javascript。这解决了你发布的问题1和2，因为剃刀部分视图归结为加载时插入DOM的任意HTML。

至于TypeScript和KnockoutJS，它们提供的好处对你自己和你正在做的项目来说是非常主观的。我建议你阅读他们提供的功能，看看这是否是你想要追求的途径——这个问题没有正确或错误的答案，至少没有很多关于你正在做什么的具体背景。

相关文章：