Рассмотрю сортировку массива пузырьком по возрастанию. В этом случае суть алгоритма сводится к обмену рядом стоящих элементов, если элемент слева больше, чем справа. Попарно проверяем все элементы, двигаясь по массиву направо (это справедливо именно для сортировки по возрастанию). После каждого такого прохода по массиву, очередной самый большой элемент продвигается в конец массива.
Сортировать буду человечков по росту от 1 (самый маленький) до 5 (самый большой).
Начальное положение. Все человечки стоят не по росту.
Начинаем первый проход по массиву - вдоль строя человечков. Первые два (index 0 и 1) стоят не по росту, поэтому меняем их местами. Зелёной стрелкой я обозначил замену. Дальше двигаемся вправо на одного человечка и сравниваем пару второго и третьего (index 1 и 2). Меняем местами, потому что рост 4 больше 1.
Дальше двигаемся вправо на одного человечка - это пара третий и четвёртый (index 2 и 3). Тот, что справа - выше! Значит оставляем их стоять там же, где они стоят. Двигаемся на одного человечка вправо - сравниваем четвёртого и пятого (index 3 и 4). Тот, что слева имеет рост 5 - он выше. Меняем местами. Итак - проход завершен, на последней позиции у нас стоит самый высокий человечек - с ростом 5. Этот элемент стоит на своём месте, он отсортирован.
Начинаем второй проход по массиву. Замечу, что последний элемент стоит на своём месте, поэтому мы не будем его сортировать. Сортируем до предпоследнего. Отсортированный элемент обведён пунктиром.
Вновь начинаем с первой пары, меняем их местами. Переходим ко второй паре - человечек слева меньше, чем справа. Оставляем их как есть.
Дальше сравниваем следующую пару - меняем местами. Теперь у нас уже два человечка стоят по росту в конце массива.
Начинаем третий проход. Сравниваем первую пару и вторую пару. В нашем случае элементы стоят по росту, поэтому ничего не меняем. Все остаются на своих местах. Красная стрелка означает, что замена не требуется.
После третьего прохода выходит такое положение. Отсортированы три последних элемента.
Последний четвёртый проход. Человечки уже стоят по росту, ничего не меняем. Массив отсортирован!
Вы конечно обратили внимание, что два последних прохода по сути были уже избыточными, поскольку все элементы фактически были отсортированы. Этот случай потребует дополнительного усложнения алгоритма. Моя цель максимально упростить понимание сути, поэтому этого случая не касаюсь.
Реализация алгоритма сортировки пузырьком на JavaScript
Используем два цикла для перебора пар элементов. Внешний перебирает элементы пары справа - pass, внутренний - слева - k. Каждый раз уменьшаем количество проходов внутреннего цикла на величину счётчика внешнего arr.length - pass, это позволяет не проходить по уже отсортированным элементам в конце массива. Если в очередной паре элементов элемент слева k больше элемента справа pass, то меняем их местами.
Традиционно массив котов для поднятия настроения. Коты в этот раз недовольные :)
Ещё мои статьи по сортировкам:
Сортировка выбором - Choice Sort
Сортировка вставками - Insert Sort
