ES6 new - arrow function

Arrow functions provide a more concise way to write functions . The basic grammar is ：

Parameters => The body of the function
( Parameters ) => { The body of the function }

var fn = (x, y) => {
				console.log(this)
				return x + y
			}

This is our ES6 New arrow function

You can see from the above that the constructor is missing function, Then an arrow points to the code block of our function

！！！ Special attention should be paid to the following situation if our parameter has only one ！！！

fn=x=》{}

There is no need to write parentheses for parameters  

！！！ If the execution body of the arrow function has only one expression   Is the return value    Then you can omit the braces ！！！

var fn2=(a,b)=>a*b

Then we will discuss the greater difference between arrow function and general function

It's the arrow function this problem

var obj={
				name:"karen",
				say:function(){
					var fn=(a)=>{
						console.log(this,1111)
						

					}
					var fm=function(){
						console.log(this,2222)
					}
					fm()
				
					fn(2)//fn Who is the caller of the function  window
				}
			}
			obj.say()// caller obj

What you can see is our arrow function , One is that we normally construct early functions , And the function is basically similar internally, but why this The objects are different  

function tool(ad){
				ad()
			}
			var obj={
				name:"bob",
				say:function(){
					console.log(this.name)
					
				},
				makeMoney:function(){
					// var that=this;
					tool(function(){
						console.log(this.name+" Eat the rice ",111)
					})										
					// tool(()=>{
					// 	console.log(this.name+" Eat the rice ",111)
					// })
				}
			}
			obj.makeMoney()
            // Eat the rice  111

We can know from the results that the desired effect did not appear ,this.name It doesn't work because the callback function we use The function is specifically run in the second line of our code , therefore this The object is Windows, use es5 The way to solve this problem is to use a variable outside this function to save the current environment , Then use in the code

but ES6 Arrow function in this It's directly pointing to this obj object Why? ？

reason ： Arrow in function body this object , Is the object when the function is defined , Instead of the object when using the function .

This also leads to a problem ！

We can't use arrow functions to construct objects because this The problem of

The arrow function doesn't argument attribute , What is used to save the number of arguments ?

Use ... To accept ： There's nothing in the arrow function arguments, have access to …reset, The received array type , All arguments except formal parameters are received

for instance

var show = (a, b, ...reset) => {
	console.log(a + b);
	console.log(reset);
}
show(1, 2, 3, 4, 5);

The arrow function sums up

• Have an arrow

• The arrow is preceded by parentheses , Put formal parameters , Parentheses can be omitted when there is only one formal parameter ;

• After the arrow is the function body ;

• If the function body has only one statement , No, {}, The return value at this time does not need return;

• Inside the arrow function this Always point to the nearest function Inside this;

• Methods in objects , Try not to use arrow functions ;

• There's nothing in the arrow function arguments, have access to …reset, The received array type , All arguments except formal parameters are received ;