「西瓜哥漫画」讲解冒泡排序 冒泡排序视频讲解

大家好，我是前端西瓜哥，今天用漫画的形式来讲解冒泡排序算法。

日更群里的朋友都说想玩视觉笔记，所以我也试着整了个玩（虽然某种意义上这篇不算视觉笔记）。

这是我第一次尝试用画画的方式来讲解技术内容，希望能对你理解冒泡排序有一点帮助。

附上冒泡排序的 JavaScript 实现：

function bubbleSort(arr) {
  for (let i = 0; i < arr.length; i++) {
    for (j = 0; j < arr.length - i - 1; j++) {
      if (a[j] > a[j + 1]) {
        // 交换
        const tmp = a[j];
        a[j] = a[j+1];
        a[j+1] = tmp;
      }
    }
  }
}

还可以额外用一个布尔值变量，监控每趟冒泡是否发生过交换，如果不需要交换，说明数组已经有序，直接结束。

这个在漫画中没有体现，但属于提高冒泡排序效率的剪枝技巧，所以特别多说一嘴。

function bubbleSort(arr) {
  for (let i = 0; i < arr.length; i++) {
    let flag = false;
    for (j = 0; j < arr.length - i - 1; j++) {
      if (a[j] > a[j + 1]) {
        // 交换
        const tmp = a[j];
        a[j] = a[j+1];
        a[j+1] = tmp;
        flag = true;
      }
    }
    // 一趟下来没有交换过，说明有序，提前结束循环
    if (!flag) break;
  }
}