JavaScript 用箭头函数 => 来写个闭包

###先来个简单的知识点过渡
//我们一步一步演化，这样好过干巴巴的介绍箭头函数的语法。
顺便说一句右边这货就是箭头函数： =>
####普通的匿名函数与【箭头函数】

//这是一个普通的匿名函数
var foo = (function() {
    return "大家好，我是笨笨，笨笨的笨，笨笨的笨，谢谢！";
});

//这是对应的箭头函数
var foo = () => "大家好，我是笨笨，笨笨的笨，笨笨的笨，谢谢！";
//当然如果有强迫症的话也可以写成这样:
var foo = (() => "大家好，我是笨笨，笨笨的笨，笨笨的笨，谢谢！");
//或这样：
var foo = (() => 
	"大家好，我是笨笨，笨笨的笨，笨笨的笨，谢谢！"
);
//测试
alert(foo());//弹窗：大家好，我是笨笨，笨笨的笨，笨笨的笨，谢谢！

####带参数的匿名函数与【箭头函数】

//这是一个带参数的匿名函数
var foo = (function(n) {
    return n*10;
});

//这是对应的箭头函数
var foo = (n) => n*10;
//顺便说一句：向上面没有参数的情况，括号是一定要的。但是如果只有一个参数可以省掉,像这样：
var foo = n => n*10;

//测试
alert(foo(1));// 10
alert(foo(2));// 20
alert(foo(3));// 30

####带参数的匿名函数与【箭头函数】

//这是一个带参数的匿名函数
var foo = (function(n) {
    return n*10;
});

//这是对应的箭头函数
var foo = (n) => n*10;
//顺便说一句：向上面没有参数的情况，括号是一定要的。但是如果只有一个参数可以省掉,像这样：
var foo = n => n*10;

//测试
alert(foo(1));// 10
alert(foo(2));// 20
alert(foo(3));// 30

####多行语句的情况

//匿名函数这样
var name = function name(str) {
   str = "---------" + str + "-----------";
   return str;
};

//这是对应的箭头函数（这就长的差不多了）
var name = str => {
   str = "---------" + str +"-----------";
   return str; 
}

####返回一个对象的情况

//匿名函数这样
var boy = function boy(str) {
  return { name: str };
};

//这是对应的箭头函数
var boy = str => ({name:str}); 

//测试
var boy = str => ({name:str}); 
var me = boy("笨笨");
alert(me.name);

###下面我们正式开始

//----------------------------------------
//我们来写个闭包函数。实现个简单的记数器。
//用两种方式：1、普通的匿名函数，2、吊炸天的箭头函数 =>
//初始从 1 起步，步长就用 ++ 好了。 
var init = 1;

//这是一个闭包函数。 匿名函数写法
var closure = function(n) {
    //本例中内层函数是调用了外层函数的参数来实现的闭包。
    //当然你也可以向往常那样在这一层里声明局部变量，给下面的内层函数用。
    //var n = 100;
    return function() {
        return n++;
    };
}(init);

//这是对应的箭头函数
var closure = (n => (() => n++))(init);

//----------------------------------------
// 下面我们跑个循环，测试下输出的效果,正常来说会看到 1到20 这些数字。
var arr = [];
for (var i = 0; i < 20; i++) {
	arr.push(closure());
}
alert(arr);

一不做二不休，再来个广告吧
在这里插入图片描述

来源：CSDN

作者：笑虾

链接：https://blog.csdn.net/jx520/article/details/53407673

标签

foo

var函数