меню

В данном материале рассмотрим, как сделать склонение окончаний при помощи Javascript. Возьмите готовую функцию решающую задачу со склонениями и посмотрите варианты её применения.

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

В качестве примера можно привести цену или курс рубля: 101 рубль, 252 рубля, 1000 рублей. Или ещё пример - пользователей онлайн или зарегистрировано на сайте: 21 пользователь, 43 пользователя, 30 пользователей.

Готовая функция JavaScript склонения окончания слова

Продемонстрировать работу js-функции определяющей правильное склонение, я могу в следующем примере. В поле ввода вводите любое число и для него будет определенено правильное окончание для связанного слова:

яблоко

штука

рубль

Функция выполняющая склонение в данном случае реализована на JavaScript и выглядит она так:

  
function sklonenie(number, txt) {
    var cases = [2, 0, 1, 1, 1, 2];
    return txt[(number % 100 > 4 && number % 100 < 20) ? 2 : cases[(number % 10 < 5) ? number % 10 : 5]];
}
 

Функция принимает два параметра:

  1. number - это число для которого нужно выполнить склонение окончания у существительного
  2. txt - массив строк с выриантами склонений: ['вариант1', 'вариант2', 'вариант3'].

Функция возвращает строку, которая является подходящим вариантом склонения (из массива txt) для переданного ей числа (параметр number).

Параметр нашего массива txt

В вариант1 попадают слова с окончаниями для:

1, 21, 31, 41, 51, 61, 71, 81, 91, 101, 121, 131, 141 и т.д.

В вариант2:

2, 3, 4, 22, 23, 24, 32, 33, 34, 42, 43, 44 ... 102, 103, 104, 122, 123, 124, 132 и т.д.

В вариант3:

5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 25, 26, 27, 28, 29, 30, 35 и т.д.

Готовая функция JavaScript в стиле синтаксиса ES-6

Получится стрелочная функция в одну строку:

  
const sklonenie = (number, txt, cases = [2, 0, 1, 1, 1, 2]) => txt[(number % 100 > 4 && number % 100 < 20) ? 2 : cases[(number % 10 < 5) ? number % 10 : 5]];
 

Ниже примеры вызова в функции:

 
let apple = 1;
let pieces = 3;
let ruble = 10;

let a = sklonenie(apple, ['яблоко', 'яблока', 'яблок']); // яблоко
let b = 'Мне нужно ' + pieces + ' ' + sklonenie(pieces, ['штука', 'штуки', 'штук']); // Мне нужно 3 штуки
let c = `Мы потратили ${ruble} ${sklonenie(ruble, ['рубль', 'рубля', 'рублей'])}`; // Мы потратили 10 рублей
 

Конечно вместо вариантов слов можно в параметр txt передавать массив с вариантами окончаний. Давайте покажу такой пример с окончаниями для слова рубль, заодно будут ещё примеры с использованием данной функции:

  
let r = 'рубл';
let v = ['ь', 'я', 'ей'];
let n = 224;

let str1 = 'У меня 120 ' + r + sklonenie(120, v);                   // У меня 120 рублей
let str2 = 'Цена: ' + n + ' рубл' + sklonenie(n, ['ь', 'я', 'ей']); // Цена: 224 рубля
let str3 = `На счету ${n} рубл${sklonenie(n, v)}`;                  // На счету 224 рубля
 

Надеюсь Вам помогло данное решение и Вы теперь сможете реализовать задачу со склонением слов при числах.

Помощь сайту
ЮMoney:
4100 1180 7209 833
Карта Сбербанк:
2202 2080 6183 7127

Возможно, вам будет интересно

Использование HTML5-элемента audio в JavaScript

Благодаря тегу audio появившемуся в HTML5, можно очень просто добавлять звук на сайт. В javascript работать со звуком позволяет соответствующий класс Audio, а проверить поддержку формата звукового файла в браузере - метод canPlayType

JavaScript and JQuery 1.8.3 решение проблемы с функцией attr() на примере генератора пароля

Совсем недавно решил написать генератор пароля с возможностью просмотра генерированного пароля под звездочками. Для работы выбрал JQuery 1.8.3 и нативный JavaScript. При написании самого скрипта столкнулся с проблемой в JQuery 1.8.3 с функцией attr().

Собственные социальные share-кнопки

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

Выделяем текущий пункт меню отдельным стилем на jQuery

Допустим нужно выделить текущий пункт меню отдельным стилем. Иногда, это сделать просто невозможно (в случае Ajax) или сложно из-за структуры меню и тут нам на помощь приходит JavaScript, а точнее jQuery