JavaScript函数变量的生命周期,自执行函数、闭包、反转数组案例及冒泡排序案例

这篇具有很好参考价值的文章主要介绍了JavaScript函数变量的生命周期,自执行函数、闭包、反转数组案例及冒泡排序案例。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、变量的生命周期

JavaScript 变量的生命期从它们被声明的时间开始。

局部变量会在函数运行以后被删除。

全局变量会在页面关闭后被删除。

二、自执行函数

执行函数通常都是定义之后立即执行,以后都不再会调用,所以声明时可以省略函数名,因此自执行函数又叫匿名函数

通用的自执行函数方式有两种:

1、在给该函数加上小括号,后面紧跟小括号

(function(){console.log('我是匿名函数')})()

2、在函数后边加上小括号,然后再用个小括号把函数和小括号一起包起来

(function(){console.log('我是匿名函数')}())

案例:一个列表里有6个li,要求点击li的时候打印当前被点击li的索引。

<ul>
        <li>这是第1个li</li>
        <li>这是第2个li</li>
        <li>这是第3个li</li>
        <li>这是第4个li</li>
        <li>这是第5个li</li>
        <li>这是第6个li</li>
    </ul>
<script>
        //函数的自执行
        // (function(){
        //     console.log('123456');
        // })()
        //
        var lis = document.querySelectorAll('li');
        for (var i = 0; i < lis.length; i++) {
            (function(i){
                lis[i].index = i;
                lis[i].onclick = function () {
                console.log(this.index)
              }
            })(i)
            
        }
    </script>

点击对应li获取下标

JavaScript函数变量的生命周期,自执行函数、闭包、反转数组案例及冒泡排序案例

三、闭包

闭包就是能够读取其他函数内部变量的函数。例如在javascript中,只有函数内部的子函数才能读取局部变量,所以闭包可以理解成“定义在一个函数内部的函数“。在本质上,闭包是将函数内部和函数外部连接起来的桥梁。

总而言之,闭包就是对函数的嵌套

四、反转数组案例

第一种方法:

         // var arr = [78,11,22,77,45,1,6]
        // function reverse(arrone){
        //     var newArr=[];
        //     for(var i = 0 ;i<=arr.length-1;i++){
        //         newArr[arr.length-1-i] = arr[i];
        //     }
        //     return newArr;
        // }
        // console.log(reverse(arr));

核心思想,是创建一个新的数组,使原数组的下标到新数组时从后向前排列newArr[arr.length-1-i] = arr[i];

第二种方法:

        function reverse(arrone){
            var newArr = [];
            for(var i = arrone.length-1; i>=0;i--){
                newArr[newArr.length] = arrone [i]
            }
            return newArr;
        }
        var arr = reverse([78,11,22,77,45,1,6]);
        console.log(arr);

核心思想,创建一个新数组,使原数组按照倒着的顺序排放进新数组,最后将新数组输出

 

五、冒泡排序

封装一个函数,输入任意一个数,都能让这个数组从大到小进行排序
        var arr =[];
        function list(arr){
             var temp;
             for(var l = 0;l<=arr.length-1;l++){
             for(var b=0;b<=arr.length-1-l;b++){
                 if(arr[b]<arr[b+1]){
                     temp = arr[b+1]
                     arr[b+1] = arr[b]
                     arr[b] = temp
                 }
             }
         }
         console.log(arr);
         }
         list([5,35,4,1,88,45,12,41,31,66])

 

核心:设置一个第三方变量,当后者大于前者时,用三个变量之间交换位置的方法依次进行排序 文章来源地址https://www.toymoban.com/news/detail-741800.html

到了这里,关于JavaScript函数变量的生命周期,自执行函数、闭包、反转数组案例及冒泡排序案例的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 理解移动语义(二)--延长变量的生命周期

    目录 代码1,无右值引用,生命周期立刻结束 代码2,有右值引用,生命周期延长到引用的生命周期结束时 以上结论只适用于纯右值,不适用将亡值 右值引用的一个作用是延长纯右值的生命周期。对比如下的代码: 结果:   可见,析构发生在i.a = 打印之前。 结果:  可见,

    2023年04月08日
    浏览(24)
  • C++的作用域、变量作用域、生命周期和变量分类介绍

    C++ 中的作用域(scope)指的是变量、函数或其他标识符的可见和可访问的范围。 变量作用域(Variable Scope)是指变量的生命周期和可见性,也就是变量在程序中的哪些部分可以使用。按照作用域(Scope)变量可分类为全局变量和局部变量。 还可按照生命周期(Lifetime)进行分

    2024年02月13日
    浏览(31)
  • Vue父子组件生命周期执行顺序是什么?

    执行顺序:父组件先创建,然后子组件创建;子组件先挂载,然后父组件挂载,即“父beforeCreate- 父create - 子beforeCreate- 子created - 子mounted - 父mounted”。 在单一组件中,钩子的执行顺序是beforeCreate- created - mounted-… -destroyed,但当父子组件嵌套时,父组件和子组件各拥有各自独

    2024年02月09日
    浏览(27)
  • C语言变量的作用域,生命周期和链接相关

    本文介绍C语言的三个很重要的概念: 变量的作用域 变量的生命周期 变量或者函数的链接 先介绍一个概念: 翻译单元 C语言中有两种文件, 头文件.h , 代码文件.c 翻译单元指的是 包含头文件,并且将头文件展开以后的代码文件.c ,而每个翻译单元都有一个 文件作用域 ,实

    2024年02月04日
    浏览(36)
  • Ionic4 生命周期钩子函数和angular生命周期钩子函数介绍

    Ionic 4(以及之后的 Ionic 版本)使用了 Angular 生命周期钩子,因为 Ionic 是基于 Angular 构建的。因此,Ionic 4 中的生命周期与 Angular 组件生命周期非常相似。以下是一些常见的 Ionic 4 生命周期钩子: ionViewDidLoad : 在页面加载完成后触发。通常用于执行一次性的初始化任务。不推

    2024年02月07日
    浏览(43)
  • Bean 作用域、生命周期和Spring执行流程

    假设现在有⼀个公共的 Bean,提供给 A ⽤户和 B ⽤户使⽤,然⽽在使⽤的途中 A ⽤户却“悄悄”地修改了公共 Bean 的数据,导致 B ⽤户在使⽤时发⽣了预期之外的逻辑错误。 我们可以看到,B 用户在使用这个Bean对象时,得到的Dog是被A 用户修改过的,这无疑会给 B 用户带来很

    2024年02月12日
    浏览(35)
  • 深入理解JavaScript堆栈、事件循环、执行上下文和作用域以及闭包

    在JavaScript中,内存堆是内存分配的地方,调用栈是代码执行的地方。 原始类型的保存方式:在变量中保存的是值本身,所以原始类型也被称之为值类型。 对象类型的保存方式:在变量中保存的是对象的“引用”,所以对象类型也被称之为引用类型。 调用栈理解非常简单,当

    2024年02月03日
    浏览(38)
  • 【Spring】Bean的作用域与生命周期详情:请简述Spring的执行流程并分析Bean的生命周期?

     我们都知道,Spring框架为开发人员提供了很多便捷,这使得开发人员能够更加专注于应用程序的核心业务逻辑,而不需要花费大量时间和精力在技术细节上。作为一个包含众多工具方法的IoC容器,存取JavaBean是其极为重要的一个环节。本文就对Spring中的Bean的作用域和生命周

    2024年02月12日
    浏览(38)
  • JavaScript(函数,作用域和闭包)

    类似于Java中的方法,是完成特定任务的代码语句块 特点 使用更简单 不用定义属于某个类,直接调用执行 分类 系统函数 自定义函数 1.将字符串转换为整型数字 js示例1 从下标为0起,依次判断每个字符是否可以转换为一个有效数字 如果不是有效数字,则返回NaN,不再继续执

    2024年02月10日
    浏览(28)
  • Angular--父子组件生命周期钩子(lifecycle hooks)执行过程

    组件初始化过程中,生命周期钩子执行顺序: constructor()构造函数,初始化class,(constructor不属于Angular生命周期钩子的范畴,这里只是说明组件组件初始化会先调用构造函数)。 ngOnChanges()--如果组件没有输入属性(@Input()),或者使用时没有提供任何输入属性,那么angular不会调用它

    2024年01月20日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包