es6 数组排序_JavaScript面经之冒泡排序

c33f827497a3a60ef8ca52141d38ef10.png

文/大白老师

图/大白老师

我们去大厂面试前端的时候,最容易被问及的一个内容就是排序,而其中,冒泡排序作为最基础的排序算法,很多时候是被要求进行手写代码的,面试官通过对手写代码的考察,可以看出求职者的算法基础功底、JavaScript语言功底以及在开发时,对变量的语义化水平。

下面,大白老师将对冒泡排序的原理进行讲解。

01

冒泡排序原理

假设数组中有n个数,比较相邻两个数的大小,若前者大于后者,则两数交换位置。这样,第一轮结束的时候,就可以选出最大的一个数放在最后面,那么,经过n-1轮之后,所有的数就完成了排序。

02

代码演示

7256a0ec31b2bfbbdf4ee5483bb05d49.png

上图中,是我们使用ES5语法进行的一个冒泡排序封装函数。

首先,需要封装一个名为bubbleSort()的函数(名字最好语义化一些),在该函数中传入一个arr形参,目的是方便在后续调用该方法的时候,可以利用形参接收传入方法中的真实参数。

471356adefc9cf25fa741bde3a6d9724.png

其次,我们在函数体内定义了一个temp变量,用它来作为一个中间量,在后续交换变量位置时,可以起到临时保存的作用。

fc1f7c406a289f4406900eef6ba31872.png

当有了这些之后,我们开始在函数体内进行第一次for循环。目的是来确定,完成整个排序,需要进行多少次的数据访问。

4f73f5c099292d3888040cebd16c857f.png

紧接着,我们在第一个for循环内部嵌套写入第二个for循环,目的是来获取相邻的两个数。

f1feef8787baabc981c07fcd3eaa0f70.png

然后,我们在第二个for循环体内进行判断,如果前者大于后者,那么这两个数交换对应位置,进行排序。

fbac3568eea195e26e75e62c656de9fb.png

最后,我们将排序完成的数组返回给形参arr中。

上述步骤是我们采用ES5的语法来进行实现的,随着前端技术的发展,新的ES6语法也已经问世,所以,除了ES5语法外,我们还可以利用ES6语法的新特性来实现,当然,基本原理是一样的。

9779912ae3325c07f32b00fd3c70aa32.png

上面这个代码块就是我们使用ES6语法来实现的,里面大部分代码和ES5差不多,但是有以下几点不同:

1、let关键字是新增的,没有var关键字变量提升的特点。

2、在进行位置交换时,采用了解构赋值的新特性。

03

总结

1、外层for循环控制循环次数

2、内层for循环进行两数交换,找到每次最大数,放在最后

3、设置标志位,减少不必要的训话次数

看到这里,想必你已经对冒泡排序有了一定认知。后续,大白老师还还会陆续进行许多面经技术文,希望可以助你一臂之力。

德云IT学院,

致力于培养IT技术紧缺型人才,

教育之路,道阻且长,

我们期待与你进行思维的碰撞。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值