.冒泡排序思想:数组当前项和后一项比较,前比后大则交换位置,最大的数放后面。
以下代码实现
function bubbleSort(arr){
let temp=null;
var len=arr.length;
for(let i=0; i<len-1; i++){
for(let j=0; j<len-1-i; j++){
if(arr[j]>arr[j+1]){
temp=arr[j];
arr[j]=arr[j+1];
arr[j+1]=temp;
}
}
}
return arr;
}
var newArr=bubbleSort([5,6,4,9,1,3,4,10,44,33,66]);
console.log(newArr);
控制台输出:
2.插入排序:抽扑克牌,和手里的扑克牌依次比较
function insertSort(arr){
let handle=[];
handle.push(arr[0]);
let len=arr.length;
for(let i=1; i<len; i++){
let A=arr[i];
for(let j=handle.length-1; j>=0; j--){
let B=handle[j];
if(A>B){
handle.splice(j+1,0,A);
break;
}
if(j===0){
handle.unshift(A)
}
}
}
return handle;
}
var newArr=insertSort([5,6,4,9,1,3,4,10,33,55,66]);
console.log(newArr);
控制台输出:
3.快速排序:找到中间项,把它从原来数组中移除
function quickSort(arr){
if(arr.length<=1){
return arr;
}
let middleIndex=Math.floor(arr.length/2);
let middleValue=arr.splice(middleIndex,1)[0];
let arrLeft=[];
let arrRight=[];
for(let i=0; i<arr.length; i++){
let item=arr[i];
item < middleValue ? arrLeft.push(item) : arrRight.push(item);
}
var newArr=quickSort(arrLeft).concat(middleValue, quickSort(arrRight));
return newArr;
}
var newArr=quickSort([5,6,4,9,1,3,4,10,55,33,66,77]);
console.log(newArr);
控制台打印:
TML ul li 横排居中排列的方法,三步骤及实例
无序列表的列表项默认情况下是竖着排的,因为li元素是块级元素,会自动分行。那如果要将列表的列表项进行横排,比用无序列表ul元素定义一个导航条。那该怎么办呢?这当中有三个应当被解决的东西,一个是横排本身,另一个就是应当把无序列表项的圆点去掉,第三则是让ul定义的列表居中显示,包括水平居中和垂直居中。方法如下:
HTML ul li 横排居中排列的方法,三步骤及实例
将ul无序列表元素中的列表项li元素的display属性设置成inline或inline-block,个人比较常用的是后者:
ul li{display:inline-block;}
水平居中方法:只要将ul元素包含于一个div元素,并将div元素的text-align属性设置为center即可将ul水平居中。除此之外,因为ul的列表默认情况下是有左内边距的,所以,为了能够让列表能够更好地水平居中,需要将ul的左内边距padding-left设置为0,具体可见下方的综合实例。
垂直居中方法:为包含ul元素的div元素设置宽度width和高度height(实际上导航条一般也需要有宽度和高度的设置),然后将ul的line-height属性设置为父元素的高度height即可。
将ul元素的list-style属性设置为none即可。
HTML ul li 横排居中排列的方法,三步骤及实例
<div class='e1'>
<ul class='e2'>
<li>HTML</li>
<li>python</li>
<li>golang</li>
</ul>
</div>
<style>
.e1{width:100%;height:50px;border:1px solid skyblue;text-align:center;}
.e2{list-style:none;padding-left:0%;}
.e2 li{line-height:50px;display:inline-block;}
</style>
HTML ul li 横排居中排列的方法,综合实例在线 - HTML教程
如上代码,一定要将ul的左内边距padding-left设置为0,否则ul列表的“水平居中”将偏向右边,大家可以将.e2中的padding-left删除掉,然后再在线运行看一看效果。
笨鸟工具-璞玉天成,大器晚成
快速排序和冒泡排序是常见的排序算法在java、JavaScript等多种语言中都有的两种排序算法
var arr=[3,4,1,2,6,7,9,0,5,8];
// arr=[9,8,7,6,5,4,3,2,1,0];
console.log('排序前:'+arr);
// 排列次数的最大应该为数组的长度-1
for(var j=0; j<arr.length-1; j++){
//获取到数组中的每一个元素
for(var i=0; i<arr.length-1; i++){
//比较当前元素和后一个元素的大小
//当前元素 arr[i] 后一个元素arr[i+1]
// console.log(arr[i], arr[i+1]);
if(arr[i] > arr[i+1]){
// 前边的元素大于后边的元素,交换两个元素的位置
var temp=arr[i];
arr[i]=arr[i+1];
arr[i+1]=temp;
}
}
console.log('排序后:'+arr);
}
var arr=[3,4,1,2,6,7,9,0,5,8];
//创建一个快速排序的函数
// 对array进行排序,返回一个排好序的新数组
function quickSort(array) {
//设置基线条件
if(array.length <=1){
return array;
}
// 获取一个基准值,获取数组的最后一个元素作为基准值
var base=array[array.length-1];
//创建两个数组
var left=[]; //左数组,存储小于base的元素
var right=[]; //右数组,存储大于base的元素
//比较每个元素和base的大小
for(var i=0; i<array.length - 1; i++){
// 比较当前值和基准值的大小
if(array[i] < base){
//放入到左数组
left.push(array[i]);
}else{
//放入到右数组
right.push(array[i]);
}
}
//left base right
// 将left base right 拼接为一个数组返回
return quickSort(left).concat(base, quickSort(right));
}吧
var result=quickSort(arr);
console.log(arr+'');//原数组
console.log(result+''); //(排序后)新数组
function mergeSort(arr) {
// 基线条件:当数组长度小于等于 1 时,直接返回该数组
if (arr.length <=1) {
return arr
}
const mid=Math.floor(arr.length / 2) // 计算数组的中间位置
const left=arr.slice(0, mid) // 将数组分为左右两部分
const right=arr.slice(mid)
// 递归地对左右两部分进行归并排序,并将结果合并
return merge(mergeSort(left), mergeSort(right))
}
function merge(left, right) {
const result=[]
let i=0
let j=0
// 比较左右两个子数组的元素,并按顺序加入结果数组
while (i < left.length && j < right.length) {
if (left[i] <=right[j]) {
result.push(left[i])
i++
} else {
result.push(right[j])
j++
}
}
// 处理剩余元素(如果有)
while (i < left.length) {
result.push(left[i])
i++
}
while (j < right.length) {
result.push(right[j])
j++
}
return result
}
const nums=[3,4,1,2,6,7,9,0,5,8]
console.log(mergeSort(nums)) // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
欢迎关注我的原创文章:小伙伴们!我是一名热衷于前端开发的作者,致力于分享我的知识和经验,帮助其他学习前端的小伙伴们。在我的文章中,你将会找到大量关于前端开发的精彩内容。
学习前端技术是现代互联网时代中非常重要的一项技能。无论你是想成为一名专业的前端工程师,还是仅仅对前端开发感兴趣,我的文章将能为你提供宝贵的指导和知识。
在我的文章中,你将会学到如何使用HTML、CSS和JavaScript创建精美的网页。我将深入讲解每个语言的基础知识,并提供一些实用技巧和最佳实践。无论你是初学者还是有一定经验的开发者,我的文章都能够满足你的学习需求。
此外,我还会分享一些关于前端开发的最新动态和行业趋势。互联网技术在不断发展,新的框架和工具层出不穷。通过我的文章,你将会了解到最新的前端技术趋势,并了解如何应对这些变化。
我深知学习前端不易,因此我将尽力以简洁明了的方式解释复杂的概念,并提供一些易于理解的实例和案例。我希望我的文章能够帮助你更快地理解前端开发,并提升你的技能。
如果你想了解更多关于前端开发的内容,不妨关注我的原创文章。我会不定期更新,为你带来最新的前端技术和知识。感谢你的关注和支持,我们一起探讨交流技术共同进步,期待与你一同探索前端开发的奇妙世界!
#文章首发挑战赛#
*请认真填写需求信息,我们会在24小时内与您取得联系。