js闭包问题

最新推荐文章于 2024-03-20 05:25:06 发布

ICY___

最新推荐文章于 2024-03-20 05:25:06 发布

阅读量163

点赞数

分类专栏： ICY___的js进阶文章标签： js闭包

本文链接：https://blog.csdn.net/ICY___/article/details/86707231

版权

js 同时被 2 个专栏收录

35 篇文章 1 订阅

订阅专栏

ICY___的js进阶

14 篇文章 0 订阅

订阅专栏

闭包可以说是js的一个疑难问题，之所以难，是因为连概念都很复杂，在百度上搜了搜，解释一大堆，愣是没看懂，依照我的理解，如果你是初学者，就将它理解成一种跨越局部和全局的桥梁吧，如果你是大佬，跪求通俗且合理的解释，留言谢谢。

这里，我总结了一些题，大体思路以备注，由于是习题，所以我觉得每个人要有自己的理解和方法，表示曾今也被所谓的参考答案“害”的不能自己独立思考，所以只写出了最终答案，没有写自己的想法，也希望大家都能真正的理解。

<!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>闭包</title>
</head>

<body>
        <button class="btn">按钮</button>
        <button class="btn">按钮</button>
        <button class="btn">按钮</button>
        <button class="btn">按钮</button>
        <button class="btn">按钮</button>
        <button class="btn">按钮</button>
        <button class="btn">按钮</button>
    <script>
        /* showname();
         function showname(){
         var num=10;
         return num;
         }
         showstu();
         function showstu(){
         console.log(showname());
         }//输出结果为 10
         //变量的全局与否都是1相对的，在showtu 中，num相当于全局变量*/


        // 没有关键字的变量为全局变量
        // function f1(){
        //  n = 999;
        //  console.log(n);
        //  }
        //  f1();
        //  console.log(n);　　//999



        // f1();
        // function f1() {
        //     n = 999;
        //     function f2() {
        //         console.log(n); //999
        //         return n;
        //     }
        // }
        // 重点
        //          function f1(){
        //  var num=10;
        //  function f2(){
        //  return num;
        //  }
        //  return f2;
        //  }
        //  var res=f1()();//res=f2;
        //  console.log(res);//第一种写法
        // //  var res=f1();//第二种写法  //res=f2;
        // //  res();
        // // console.log(res());//两种方法含义一样，第一种借助第一种理解




        // var nAdd = null;

        // function f1() {
        //     var n = 999;
        //     nAdd = function () {

        //         n += 1;

        //     }

        //     function f2() {
        //         console.log(n);

        //     }
        //     return f2;
        // }


//闭包的应用    值会存在内存中
        // var result = f1(); //n
        // result(); //999
        // nAdd(); //999
        // result = f1();
        // result(); //999
        // nAdd();
        // result = f1();
        // result(); //999
        // nAdd();

        // result(); //999
        // nAdd();

        // result(); //999
        // nAdd();




        // function foo(x) {
        //  var tmp = 3;
        //  return function f2(y) {
        //  alert(x + y + (++tmp));
        //  };
        //  }
        //  var bar = foo(2); // bar 现在是一个闭包    bar=f2
        //  bar(10);//表示 f2 的执行
        // //  var bar=foo(2)(10);    等同于上两行


//重点
        //  function fun(n,o) {
        //  console.log(o)
        //  return {
        //  fun:function(m){
        //  return fun(m,n);
        //  }
        //  };
        //  }
        //  var a = fun(0);  a.fun(1);  a.fun(2);  a.fun(3);//undefined 0   0   0  
        //  var b = fun(0).fun(1).fun(2).fun(3);//undefined   0   1    2
        //  var c = fun(0).fun(1);  c.fun(2);  c.fun(3);//undefined  0  1   1




        //   function f1(a,b,c,d){
        //  /*!*arguments 是当前函数的参数列表  类似于数组的集合  使用索引值来取*!*/
        //  console.log(arguments.length);
        //  }
        //  f1(1,2,3,4);
        // var sum = function () {
        //     var cache;
        //     if (arguments.length === 1) {
        //         cache = arguments[0];//如果arguments对象的长度为1，也就是参数只有1个时，将这个参数赋值给cache，暂存
        //         return function (number) {//返回一个函数，函数里的参数（也就是第二个括号里的参数）与之前第一个括号里的参数相加
        //             return cache + number
        //         }
        //     } else {
        //         return arguments[0] + arguments[1]//如果arguments对象的长度不为1，那么两个参数相加
        //     }
        // }
        // console.log(sum(2, 3));//5
        // console.log(sum(2)(3));//5
        // sum(2)= function (number) sum(2)(3)=function (number)()  大体理解，原理上是错的

     /*   function f1() {
            function f2() {
                console.log(1);
            }

            return f2;
        }
        var res = f1();//f2
        res();
        var res = f1()();*/
        // 还是一样的原理
        var btn = document.getElementsByClassName("btn");
    for (var i = 0; i < btn.length; i++) {
        //参数的传递   桥梁
        /* btn[i].index=i;
         btn[i].onclick=function (){
         alert(this.index);
         }*/
        /*自执行函数的闭包*/
        (function (x) {
            btn[i].onclick = function () {
                alert(x);
            }
        })(i);
    }
    </script>
</body>

</html>

ICY___

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js闭包问题

闭包可以说是js的一个疑难问题，之所以难，是因为连概念都很复杂，在百度上搜了搜，解释一大堆，愣是没看懂，依照我的理解，如果你是初学者，就将它理解成一种跨越局部和全局的桥梁吧，如果你是大佬，跪求通俗且合理的解释，留言谢谢。这里，我总结了一些题，大体思路以备注，由于是习题，所以我觉得每个人要有自己的理解和方法，表示曾今也被所谓的参考答案“害”的不能自己独立思考，所以只写出了最终答案，没有写自己...
复制链接

扫一扫