冒泡排序的优化和js跳出循环的方法

最新推荐文章于 2022-07-16 16:34:25 发布

zeng092210

最新推荐文章于 2022-07-16 16:34:25 发布

阅读量452

点赞数 2

分类专栏： javascript 文章标签： js 冒泡排序 js跳出循环冒泡排序优化

本文链接：https://blog.csdn.net/zeng092210/article/details/84590837

版权

javascript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1.冒泡排序

1）.今天下班时间看了《美团面试，我竟然输给了冒泡排序……》这篇博客，博主写的很666~~。

先说说冒泡排序，相信每个程序员都烂熟于心，所以直接放上代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div>冒泡排序和js跳出循环的方法</div>
    <script type="text/javascript">
        var arr = [8,9,3,4,6,7,8,2,1]
        var plan_arr
        // 冒泡排序
        for (let x = 0; x < arr.length; x++) {
            for (let y = 0; y < arr.length; y++) {
                if(arr[y] > arr[y + 1]){
                    plan_arr = arr[y]
                    arr[y] = arr[y + 1]
                    arr[y + 1] = plan_arr
                }
            }
        }
        console.log(arr)   //输出[1, 2, 3, 4, 6, 7, 8, 8, 9]
    </script>
</body>
</html>

2）.重点来了，冒泡排序的优化，其实一点也不难，只是实战中用不到冒泡排序，可能面试问到很懵

原理：当有一趟完整的比较中没有发生换位，那是不是就已经排好？而不需要继续比较。想通这一点相信已经明白了。

比如：8,7,1,2,3,4,5 那我们看优化的代码：

首先我们看这个数组在没有优化（注释了）是的代码和输出：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div>冒泡排序和js跳出循环的方法</div>
    <script type="text/javascript">

        function bubbling(){
            var arr = [8,7,1,2,3,4,5]
            var plan_arr
            // var step_out
            var num = 0
            // 冒泡排序
            for (let x = 0; x < arr.length; x++) {
                // step_out = false
                for (let y = 0; y < arr.length; y++) {
                    num++
                    if(arr[y] > arr[y + 1]){
                        plan_arr = arr[y]
                        arr[y] = arr[y + 1]
                        arr[y + 1] = plan_arr
                        // step_out = true
                    }
                }
                console.log(num)
                console.log(arr) 
                // if(!step_out){
                //     return
                // }
            }
        }
        bubbling()
    </script>
</body>
</html>

打印输出结果是：

我们在看放开上文中的注释加优化的后的代码和输出：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div>冒泡排序和js跳出循环的方法</div>
    <script type="text/javascript">

        function bubbling(){
            var arr = [8,7,1,2,3,4,5]
            var plan_arr
            var step_out
            var num = 0
            // 冒泡排序
            for (let x = 0; x < arr.length; x++) {
                step_out = false
                for (let y = 0; y < arr.length; y++) {
                    num++
                    if(arr[y] > arr[y + 1]){
                        plan_arr = arr[y]
                        arr[y] = arr[y + 1]
                        arr[y + 1] = plan_arr
                        step_out = true
                    }
                }
                console.log(num)
                console.log(arr) 
                if(!step_out){
                    return
                }
            }
        }
        bubbling()
    </script>
</body>
</html>

输出结果：

到此我们应该很容易看出效果，数组元素越多效果可想而知。

在说代码中用到的return 和加的函数，从而引出js循环中跳出循环的方法(break,continue,return)以及区别。

2.js循环中跳出循环的方法(break,continue,return)以及区别

1） break 简单理解就是直接跳出循环

break语句会使运行的程序立刻退出包含在最内层的循环或者退出一个switch语句。

break在循环或switch中用否则会报错

2) continue 简单理解跳出本次循环进入下次循环

continue语句和break语句相似。所不同的是，它不是退出一个循环，而是开始循环的一次新迭代。

continue语句只能用在while语句、do/while语句、for语句、或者for/in语句的循环体内否则会报错

3) return 直接跳出函数并指定返回值

return语句就是用于指定函数返回的值。return语句只能出现在函数体内否则会报错

retrun面熟好像在哪儿见过！注意的是用在函数之外会报错（Uncaught SyntaxError: Illegal return statement）！如下：

而return 还有一个常用的方法就是阻止表单提交：

 <form id="form" onSubmit="return false">
      <!-- 表单内容 -->
 </form>

代码解释上述三种方法：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div>js循环中跳出循环的方法发</div>
    <div>三种方法：<mark>break、continue、return</mark></div>
    <script type="text/javascript">
        var array = [9,8,7,6,5,4,3,2,1]
        // break
        document.write('break:')   
        for (let i = 0; i < array.length; i++) {
            if(array[i] == 3){
                break
            }
            document.write(array[i])   //输出：987654 
        }
        document.write('<br/>')

        // continue
        document.write('continue:')
        for (let i = 0; i < array.length; i++) {
            if(array[i] == 3){
                continue
            }
            document.write(array[i])   //输出： 98765421 
        }
        document.write('<br/>')

        // return
        function fun(){
            document.write('return:')
            for (let i = 0; i < array.length; i++) {
                if(array[i] == 3){
                    return
                }
                document.write(array[i])   //输出：987654 
            }
        }
        fun()
    </script>
</body>
</html>

三种方法的输出结果为：

参考博主文章：https://blog.csdn.net/fxss5201/article/details/52980138

参考博主文章：https://blog.csdn.net/csdnsevenn/article/details/84452866

zeng092210

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
冒泡排序的优化和js跳出循环的方法

1.冒泡排序1）.今天下班时间看了《美团面试，我竟然输给了冒泡排序……》这篇博客，博主写的很666~~。先说说冒泡排序，相信每个程序员都烂熟于心，所以直接放上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="v...
复制链接

扫一扫