匿名函数

1，基本概念

匿名函数顾名思义指的是没有名字的函数，在实际开发中使用的频率非常高！（在ES5中就已经有了匿名函数）

首先我们声明一个普通函数fun：

function fun(){console.log("Eula");
}

然后将函数的名字去掉即是匿名函数：

function (){console.log("Eula");
}

这样直接写在js中会直接报错，不符合语法规范；需要使用小括号包括起来：

 // 不在报错(function () {console.log("Eula");})

那怎么调用呢，普通函数的调用都是使用 ()小括号来调用，匿名函数也不例外；后面需要在加一个小括号实现自调用，同样括号里面也可以传参；

 (function (value) {console.log("name:" + value);})("Eula");// 打印结果name:Eula

2，匿名函数的应用场景

1，自调用

匿名函数想要自调用需要放在（）里面并后面使用小括号调用，里面可以传参；

(function (value){console.log("name:"+value);
})("Eula")
输出结果：
name:Eula

2、事件的绑定函数

<input type="button" value="Eula！" id="btn">
<script>//获得按钮元素var btn=document.querySelector("#btn");//给按钮增加点击事件。btn.onclick=function(){alert("姐是尤菈你记住！");}
</script>

3、在对象中使用

var obj={name:"Eula",fun:function(){return "我是"+this.name}
};
console.log(obj.fun());//我是Eula

4、函数表达式
JS中定义函数的方式有两种：一种是函数声明，另一种就是函数表达式。

//  1，函数声明
function fun(params){console.log(params)return ""
}// 2，函数表达式写法 将匿名函数赋值给变量fun。
var fun = function(params){console.log(params)return ""
}//调用方式与调用普通函数一样
console.log(fun());

注意：函数声明，它的一个重要特征就是函数会进行声明提升，意思是在执行代码之前会先读取函数声明。这就意味着可以把函数声明放在调用它的语句后面；

函数表达式的写法则不会进行js预编译的函数提升；

5、回调函数

概念：回调函数就是一个被作为参数传递的函数；

setInterval(function(){console.log("我是一个回调函数，每次1秒钟会被执行一次");
},1000);

6、作为返回值返回

	//将匿名函数作为返回值function fun() {//返回匿名函数return function () {return "Eula";};}//调用匿名函数console.log(fun()()); //Eula//或const handleFun = fun();console.log(handleFun()); //Eula

箭头函数

1，基本概念

箭头函数是ES6中新增一种语法，属于匿名函数； 将函数更加简单化的写法；也是非常的常用。

let funName = ()=>{console.log('今天天气很好  上课可惜了');
}

箭头函数写法的特殊性

他有一些特殊写法 在编辑函数的时候可以适当的做出一些省略：

1，当只有一个参数的时候 可以省略小括号

let fun1 = num=>{console.log(num + 300);
}

2，当没有参数或者多个参数的时候 ，不能省略小括号；

// 没有参数
let fun2 = ()=>{console.log(300);
}
// 多个参数
let fun3 = (a,b,c)=>{console.log(a);console.log(b);console.log(c);
}

3，当我们只有一句函数体的时候, 并且这句话是返回值的时候 ，可以同时省略return和大括号（函数体） ；

let fun4 = (num) => num+200
console.log(fun4(100));// 300 

4，如果说不省略return 那么大括号也不能省略；

 let fun4 = (num) => {return num+200}console.log(fun4(100));// 300 

5，如果返回值是对象 ，在省略大括号和return的情况下，需要在对象外面加上一层小括号（因为有歧义无法确定大括号是箭头函数的还是对象的 ）

// 省略大括号和return的写法
let fun5 = ()=>({name : 'Eula',age : 18,sex : '女'
})
console.log(fun5 ());// 正常写法
let fun5 = () => {return {name: "Eula",age: 18,sex: "女"};};console.log(fun5());

2，箭头函数的特点

1、只能定义匿名函数
2、箭头函数没有原型对象
3、箭头函数不能定义构造函数
4、箭头函数不能使用arguments new super
5、箭头函数没有自己的this （调用的是他的父级的this）

箭头函数this总是指向父级的this：

如下分情况进行讨论：

1，say方法是箭头函数 指向父级 ，obj3 的父级是window，所以say函数的this指向是window。

 	 let obj3 = {name: "Mary",age: 13,say: () => {return this; //返回的是window}};开始调用console.log(obj3.say());

2，say2方法指向的是父级的this,父级是say1函数，say1函数是普通函数只指向obj4； 所以say2的this指向是obj4对象。

	let obj4 = {name: "Tom",age: 3,say1: function () {console.log("this:",this); // 此处的this 是 {name: 'Tom', age: 3, say1: ƒ}return {name: "Jerry",age: 2,say2: () => {// 指向的是父级的this  父级是say1函数  say1函数是普通函数只指向obj4 所以 此处的this指向是{name: 'Tom', age: 3, say1: ƒ}return this;   }};}};开始调用console.log(obj4.say1().say2());

3，say2的this指向父级 父级say1也是箭头函数，那么this也指向父级的this，那么obj5对象的父级是window所以say2的this指向是window。

     let obj5 = {name: "Tom",age: 3,say1: () => {return {name: "Jerry",age: 2,say2: () => {// say2的this指向父级  父级say1也是箭头函数,那么this也指向父级的this,那么obj5对象的父级是window所以此处的this指向windowreturn this; }};}};开始调用console.log(obj5.say1().say2()); // 指向的是window

扩展

对象里面的函数写法会有多种写法，如下：

 	const action = {// 1，省略键名的写法one() {console.log(111);},// 2，普通函数的写法two: function () {console.log(222);},// 3，匿名函数的写法three: () => {console.log(333);}};