Как правильно определить переменные javascript в разных файлах cshtml, имеющих общий файл js?

Question

Существует файл cshtml, в котором мы сохраняем значения модели в переменных javascript следующим образом.

@model sampleVM;
<script>
var x = "@Model.x";
var y = "@Model.y";
</script>
<script src="sample.js"></script>

В файле sample.js и document.ready код выглядит следующим образом.

docready
{
var z = 5;
alert(x+y+z);
}

Влияет ли это на время разбора скрипта, потому что мы определили переменные в нескольких файлах cshtml, как указано выше?Есть ли способ лучше?

Answer 1

«Лучший способ сделать это» не совсем объективен, но вот мое мнение: я бы полностью избавился от встроенных скриптов в cshtml.Зачем?Если вы хотите анализировать, пускать или переносить код или javascript, используя накопительный пакет, веб-пакет или любой другой Js-каркас сегодняшнего дня, вам будет трудно сделать это, когда ваш код javascript скрыт в файле cshtml.Ваш пример довольно небольшой, но проекты со временем усложняются, и, поскольку ваш js уже смешан с синтаксисом бритвы, вы могли бы также добавить новые требования?И тогда у вас будет фрагмент кода javascript по всему проекту в файлах js и cshtml.Итак: для меня это кодовый запах.

Я хотел бы сделать следующее: использовать вашу модель в разметке:

<input type="hidden" name="xValue" id="xValue" value="@Model.x" />
<input type="hidden" name="yValue" id="yValue" value="@Model.y" />

и вызвать ее из файла sample.js:

$('document').ready(function(){
   var x = $('#xValue').val();
   var y = $('#yValue').val();
   //... do stuff with it
});

ВашЗатем файл cshtml просто ссылается на этот файл:

@section scripts {
    <script src="~/sample.js"></script>
}

Answer 2

Вы можете установить x, y в качестве переменной окна и использовать в файле sample.js

@model sampleVM;
<script>
window.x = "@Model.x";
window.y = "@Model.y";
</script>