Статьи

Функция полезности для заполнения строк и чисел

Октябрь 1, 2018

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

Что делает функция

Функция pad Хотя функция может дополнять любое значение любым другим значением, возможно, наиболее распространенным является добавление числа с начальными нулями, например, для нормализации часов, минут и секунд на 24-часовых часах. Код для функции pad 

 function pad(input, length, padding)
{
  while((input = input.toString()).length + (padding = padding.toString()).length < length)
  {
    padding += padding;
  }
  return padding.substr(0, length - input.length) + input;
}

Как видно из кода, функция принимает три аргумента. Первый аргумент, input Второй аргумент, length Третий аргумент, padding

Использование функции

Чтобы привести пример использования, Date.getHours() Чтобы нормализовать час к двузначной числовой строке, вы должны передать его через pad 

 var hours = pad(new Date().getHours(), 2, 0);

Продвинув предыдущий пример на шаг вперед, вы можете создать полную 24-часовую строку времени, например: 

 var date = new Date(), time = [
  pad(date.getHours(), 2, 0),
  pad(date.getMinutes(), 2, 0),
  pad(date.getSeconds(), 2, 0)
];
alert( time.join(':') );

Ключи к функции

Прежде всего, мы должны преобразовать как входные значения, так и значения заполнения в строки, так что результатом операции всегда будет конкатенация, а не числовое сложение, даже если оба значения являются числами. Мы могли бы просто настаивать на том, что входные данные должны быть строками, но это сделало бы функцию гораздо менее удобной для использования. Например, вы не сможете передать ему выходные данные Date.getHours() Самый очевидный способ написать такую ​​функцию — это просто добавить строку заполнения к началу входной строки, пока не будет достигнута желаемая длина, как показано ниже. 

 while(input.length < length)
{
  input = padding + input;
}
return input;

Проблема с этим подходом состоит в том, что он будет работать правильно, только если строка дополнения представляет собой один символ, или если длина вывода минус длина ввода полностью делится на длину заполнения. Например, если мы передали входное значение "7"6"0x""0x0x0x7" Это явно больше указанной длины вывода.

Чтобы обойти эту проблему, мы предварительно компилируем заполнение — объединяем столько его экземпляров, сколько нам нужно, чтобы достичь или превысить выходную длину. Затем мы добавляем точную подстроку этого во входную строку, чтобы создать точную выходную длину, как указано: 

 while(input.length + padding.length < length)
{
  padding += padding;
}
return padding.substr(0, length - input.length) + input;

Используя тот же пример, что и раньше, результатом этого улучшенного кода будет "0x0x07"

Вывод

И вот она, короткая и приятная функция, которая выполняет простую, но невероятно полезную задачу. Мы создали функцию, которая помогает с форматированием дат, времени, валюты и значений rgb-hex. Не забудьте проверить в ближайшие недели для более коротких и приятных функций.

36
Share: