Как организовать JavaScript-код переднего плана в проекте ASP.NET MVC?

Question

У меня есть проект ASP.NET MVC, который принимает много JavaScript (jQuery и d3). Я новичок в веб-разработке, поэтому я хочу попросить некоторую помощь о том, как организовать код сценария переднего плана.

Мой текущий путь: каждая папка под «Views» имеет только один соответствующий .js-файл (что означает все частичные представления (.cshtml) в этой папке, обмениваются этим .js-файлом), и я явно инициализирую все. js моего проекта в $ (document) .ready() из _Layout.cshtml.

Это вводит 2 вопрос:

1. Поскольку все частичные ставит там коды в одном .js файла, поэтому он делает каждый .js файл огромным и сложным.
2. Поскольку я жестко запрограммировал инициализацию всех файлов .js при загрузке _Layout.cshtml, так что даже если одно представление не загружено, выполняется его за .js, звучит негибко.

Так вот мои вопросы:

1. Как сделать каждый частичный вид имеет свой собственный файл .js (разделить текущий .js на мелкие кусочки).
2. Как загрузить и запустить файл .js частичного представления только при загрузке этого частичного представления.
3. Если я использую TypeScript и KnockoutJS, предоставляют ли они какие-либо преимущества при организации кода сценария переднего конца?

Заранее спасибо.

Answer 1

Существует несколько способов кожи кошки. Если у вас есть javascript-код, характерный для частичного просмотра, вполне можно просто пропустить шаг включения файла и встроить JavaScript непосредственно там с помощью тега <script>. Это решает проблемы 1 и 2, которые вы опубликовали, поскольку частичные представления бритвы сводятся к простому произвольному HTML, вставленному в DOM, когда они загружаются.

Что касается TypeScript и KnockoutJS, то преимущества, которые они предоставляют, очень субъективны для вас и для проекта, над которым вы работаете. Я бы посоветовал ознакомиться с функциями, которые они предоставляют, и посмотреть, есть ли это путь, который вы хотите преследовать. На этот вопрос нет правильного или неправильного ответа, по крайней мере, не с большим контекстом относительно того, над чем вы работаете.

Answer 2

Разделите свой javascript-код на несколько файлов таким образом, чтобы каждый js-файл соответствовал частичным представлениям.

Затем загрузите соответствующие js частичным представлением в частичном виде вместо файла _Layout.cshtml. Таким образом, соответствующие js будут выполняться только при загрузке частичного представления.

ТипScript - это класс объектно-ориентированного программирования на основе классов, применяемый к базовому javascript, который разработан и поддерживается Microsoft. Это не помогает организовывать файлы, но помогает поддерживать код js в стиле ООП. (Link here)

НокаутJS - шаблон модели-View-ViewModel (MVVM), применяемый к javascript. Вы можете модулировать каждый js-файл в KnockoutJS, т. Е. Отдельные js для Model, View и ViewModel, но они будут иметь зависимость друг от друга. (См. documentaion)