冒泡排序是一个非常常见的排序算法,对于一个数组,每趟排序时依次比较两个相邻的数,如果他们的顺序错误就交换两数位置。所以,没趟排序都会排好一个数字,下一轮排序就可以少比较一个数字,直到只剩下一个数字,就全部排序好了。
举个例子,假设最终需要的结果是从小到大排列,对于数组:
[3, 5, 2, 6, 1, 7, 4]
[3, 5, 2, 6, 1, 7, 4]
// 比较过程:
// 1. 比较 3 和 5,发现顺序正确,则不变
[3, 5, 2, 6, 1, 7, 4]
// 2. 比较 5 和 2,发现顺序错误,交换位置
[3, 2, 5, 6, 1, 7, 4]
// 3. 比较 5 和 6,发现顺序正确,不变
[3, 2, 5, 6, 1, 7, 4]
// 4. 比较 6 和 1,发现顺序错误,交换位置
[3, 2, 5, 1, 6, 7, 4]
// 5. 比较 6 和 7,发现顺序正确,不变
[3, 2, 5, 1, 6, 7, 4]
// 5. 比较 7 和 4,发现顺序错误,交换位置
[3, 2, 5, 1, 6, 4, 7]
排序过程中,所有相邻数字对都比较了一遍,比较的过程中,实质上是比较的相邻位置,而不管位置上的数字是否在上一次比较中交换了位置,只管一个一个位置的比较下去,数字顺序错误就把数字位置交换。经过这趟排序,发现最大的数字 7 已经排到了最后一个位置,所以下一趟排序就不需要再比较最后一个位置的数字了。
// 经过第一趟排序后的数组
[3, 2, 5, 1, 6, 4, 7]
// 比较过程:
// 1. 比较 3 和 2,发现顺序错误,交换位置
[2, 3, 5, 1, 6, 4, 7]
// 2. 比较 3 和 5,发现顺序正确,不变
[2, 3, 5, 1, 6, 4, 7]
// 3. 比较 5 和 1,发现顺序错误,交换位置
[2, 3, 1, 5, 6, 4, 7]
// 4. 比较 5 和 6,发现顺序正确,不变
[2, 3, 1, 5, 6, 4, 7]
// 5. 比较 6 和 4,发现顺序错误,交换位置
[2, 3, 1, 5, 4, 6, 7]
// 最后一个数字不用比较
经过第二趟排序后,数字 6 也排到了正确的位置。第三趟排序时,最后两位数字都不用比较了。
每一趟排序,都会把剩余数字中最大的排到最后面。后面的排序过程就不再分析了。清楚了排序过程,写代码来排序就很简单了,代码如下:
function bubbleSort(arr) {
var arr = arr.slice(0); // 保证排序后原数组不变
var len = arr.length;
var tmp;
// 只需要进行 len - 1 趟排序
// 因为只剩下一个数字时不用再比较了
for (var i = 0; i < len - 1; ++i) {
// 每一趟都会排序好一个数字
// 所以每趟只需排 len - i 个数字
for (var j = 1; j < len - i; ++j) {
// 如果右边的数比左边的小
// 就交换位置
if (arr[j] < arr[j-1]) {
tmp = arr[j];
arr[j] = arr[j-1];
arr[j-1] = tmp;
}
}
// 这里可以打印出每趟排序的结果
// 以便观察排序过程
// console.log(arr);
}
return arr;
}
原生js实现排序算法:冒泡排序、选择排序、插入排序、归并排序等
首先我们来看原生JS取消事件冒泡方法:原生JS阻止默认事件方法:而vue.js给我们提供了更简便的方法,我们可以通过function($event)来获取事件对象,$event.target则是选择发生事件的目标元素
在React中,我们可以在创建element的时候,传入事件和处理函数,这些事件会被做为合成事件来处理,当然,有些时候,我们也需要定义原生事件,比如给document绑定事件。有些情况下,就需要通过阻止事件冒泡来实现预期的交互效果。下面是几个简单的demo
在一个对象上触发某类事件,这个事件会向这个对象的的父级传播,从里到外,直至它被处理或者到达了对象层次的最顶层,即document对象。这个过程就是JavaScript的事件冒泡。
js冒泡和捕获是事件的两种行为,使用event.stopPropagation()起到阻止捕获和冒泡阶段中当前事件的进一步传播。使用event.preventDefault()可以取消默认事件。
方法一:使用vue阻止子级元素的click事件冒泡。简单得:可以直接用stop;这样点击div里面的按钮1,就不会触发div绑定时间test1()方法。可以自己写个阻止冒泡事件 然后在发生冒泡的元素中调用这个事件
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!