Так что, занимаясь пауэрлифтингом уже более года и совсем недавно изучив Vue.js, я хотел применить это в практическом приложении.

Я понял, что довольно часто занимаюсь математикой пластин. Под математикой блинов я подразумеваю определение того, какие блины мне нужно нагрузить по обе стороны от грифа, чтобы поднять желаемый вес. Это то, что мне приходилось практиковать, и теперь я делаю это довольно быстро, не задумываясь.

Однако я обнаружил, что попытка реализовать это в программе оказалась не такой простой, как я ожидал.

Я хотел бы предварить это тем, что я ни в коем случае не являюсь экспертом в Vue.js или JavaScript в целом, но решил задокументировать свой процесс, поскольку он может оказаться полезным для кого-то еще.

Процесс:

Что я знал:

  • Мне нужно было разделить желаемый вес на каждую из включенных пластин (25 кг, 20 кг, 15 кг, 10 кг, 5 кг, 2,5 кг)
  • Скорее всего, это будет цикл, хотя первоначальное тестирование показало, что цикл while был совершенно неправильным выбором.
  • Мне нужно было бы округлить число до ближайших 2,5 кг, чтобы сделать цикл эффективным и запускать его только один раз.

Я начал с нескольких ужасных ранних попыток с циклами while, прежде чем быстро понял, что моя логика полностью отключена.

Так что я сделал шаг назад, чтобы переоценить, позвонил другу, который разбирается в математике лучше, чем я, и мы решили это вместе.

Математика

Основная математика выглядит следующим образом:

Вес стержня = х

Общий вес = у

Вес для загрузки = z

z =Math.floor/ceil(x-y)/2

z / вес плиты = a

Мы делим на 2, чтобы упростить математику и определить только пластины, необходимые для одной стороны. Это не должно иметь значения, поскольку обеим сторонам потребуется одинаковое количество пластин.

  • Если A является целым числом (целым числом), добавьте это целое число к соответствующему количеству тарелок и верните
  • Если a является числом с плавающей запятой › 0 (т. е. 1.something), то округлить его в меньшую сторону, добавить целое число к соответствующему счетчику тарелок, удалить count * plateWeight из z и продолжать до тех пор, пока не будет завершено или не будет выполнено правило, указанное выше.
  • Если a является числом с плавающей запятой меньше 0, то переходите к следующему plateWeight до тех пор, пока не будет выполнено одно из приведенных выше правил.

Код

В JavaScript это выглядит так:

Итак, здесь roundedNum равен z, и я создал массив объектов для каждой пластины. Если бы я хотел добавить эмпирическую систему позже, мне просто потребовались бы некоторые изменения в цикле for и добавление определенных пластин в массив.

Все объекты в массиве выглядят так:

Функция isInteger проста и выглядит так:

Я взял это из статьи StackOverflow (ссылку на которую я не могу найти прямо сейчас), я понимаю, что, вероятно, есть лучшие способы сделать это, но я чувствовал, что функция была для меня надежным способом предсказать результат.

Кроме того, потребовалось немного Vuetify для пользовательского интерфейса, чтобы создать базовый макет, который выглядел следующим образом:

Я выбрал Vuetify, так как это простая в использовании библиотека пользовательского интерфейса, которая позволяет мне быстро создавать веб-приложения с очень небольшим количеством собственного CSS. Вы можете найти Vuetify здесь.

Несколько мелких деталей, чтобы убедиться, что ничего смешного не произошло, например, оператор if для проверки положительности обработанного числа был сделан следующим образом:

if (calcNum <= 0) return;

Заключительные примечания

Определенно есть еще вещи, которые мне нужно улучшить в отношении стиля, функциональности и общего качества моего кода. Если у вас есть какие-либо предложения по любому из этих пунктов, пожалуйста, не стесняйтесь оставлять их ниже, я благодарен за любые советы, которые помогут мне стать лучше.

Вы также можете найти живую версию, чтобы попробовать здесь. Эта ссылка всегда будет отражать последние изменения с GitHub.

Полный исходный код можно найти здесь, и я планирую добавить графическое отображение для загрузки пластин в будущем.

Фото на обложке Florian Olivo на Unsplash