云迈博客

您现在的位置是:首页 > 前端技术 > 原生js相关 > 正文

原生js相关

JavaScript特点之闭包

dengkai2022-06-30原生js相关183
​一、定义闭包结构˃通过一个简单的例子,模拟星期更替。functioniterator(arr){vari=0;console.log("外层函数的i:"+i);

一、定义闭包结构

通过一个简单的例子,模拟星期更替。

function iterator(arr){
    var i = 0;
    console.log("外层函数的i:"+i);
    return function(){
        console.log(arr[i % arr.length]);
        i++;
    }
}

从形式上看,外层函数包裹着内部函数,并将内部函数作为返回值。内部函数可以访问外层函数的变量。

二、调用方式

1.每次先执行外层函数,再执行内层函数

var week=["星期一","星期二","星期三","星期四","星期五","星期六","星期天"];
iterator(week)();
iterator(week)();
iterator(week)();
iterator(week)();
iterator(week)();
iterator(week)();
iterator(week)();
iterator(week)();
iterator(week)();

效果:不管调用多少次,始终输出的是数组的第一个值。

  1. 执行一次外层函数,使用变量保留外层函数的返回值,由于返回值类型是一个函数,故此变量可以加括号运行
var week=["星期一","星期二","星期三","星期四","星期五","星期六","星期天"];
var nextday = iterator(week);
nextday();
nextday();
nextday();
nextday();
nextday();
nextday();
nextday();
nextday();
nextday();

效果:循环输出数组中的每一个值。

三、总结

1.在函数外部不能访问该函数的内部函数

2.通过闭包可以访问内部匿名函数

3.第二种调用方式可以让局部变量的值始终保存在内存中

四、应用

闭包可以获得新的作用域,所以

let myModule = (function (window) {
    let moduleName = 'module'  // private
    // public
    function setModuleName(name) {
      moduleName = name
    }
    // public
    function getModuleName() {
      return moduleName
    }
    return { setModuleName, getModuleName }  // 暴露行为
  })(window)

发表评论

评论列表

  • 这篇文章还没有收到评论,赶紧来抢沙发吧~