Как рассчитать процентное изменение (увеличение и уменьшение) из 2 значений в JavaScript

Хотите решить простое процентное изменение в JavaScript? Первое, что вам нужно сделать, это подумать математически. Вам необходимо получить разницу (уменьшить или увеличить) между числами, которые вы сравниваете. Эта разница должна быть разделена между первым числом (тем, которое не изменяется). Результат этой операции должен быть умножен на 100. Делая абстракцию этого процесса в функции JavaScript, мы должны иметь:

/**
* Calculates in percent, the change between 2 numbers.
* e.g from 1000 to 500 = 50%
*
* @param oldNumber The initial value
* @param newNumber The value that changed
*/
function getPercentageChange(oldNumber, newNumber){
var decreaseValue = oldNumber - newNumber;
return (decreaseValue / oldNumber) * 100;
}

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

Примеры

В следующих примерах показаны разные случаи, когда процентное изменение как положительное (уменьшение), так и отрицательное (увеличение) в зависимости от точки зрения:

Заметка

Отрицательное значение указывает на процентное увеличение.

// X = 500
// Y = 234
// % = 53.2
getPercentageChange(500, 234);
// X = 1000
// Y = 890
// % = 11
getPercentageChange(1000, 890);
// X = 5
// Y = 2
// % = 60
getPercentageChange(5, 2);
// X = 100
// Y = 120
// % = -20
// Note: negative as it incremented 20%
getPercentageChange(100, 120);
// X = 500
// Y = 500
// % = 0
// Note: no percent change
getPercentageChange(500, 500);

Где можно использовать эту функцию

Например, если вы работаете с алгоритмами сжатия изображений, вам может потребоваться отобразить удобочитаемое значение в процентах, которое указывает, насколько сильно было сжато исходное изображение, где oldNumber — это исходный размер файла, например, 1 МБ, а newNumber — 500 КБ, что привести к снижению на 50%.

Ссылка на основную публикацию