Properties of arrow functions

Cannot be called with the new keyword. Arrow functions have no [[Construct]] method and therefore cannot be used as constructors. If you call arrow functions with the new keyword, the program will throw an error.

There is no prototype, and since you cannot call the arrow function with the new keyword, there is no need to build a prototype, so there is no prototype attribute for the arrow function.

It is not possible to change the binding of this. Arrow functions do not bind this and capture the value of this of the context in which they are located as their own value. (Normal functions’ this refers to the object on which they are called.)

Arguments objects are not supported, and arrow functions have no arguments binding, so you must access function arguments using both named and undefined arguments.

Duplicate named arguments are not supported. Arrow functions do not support duplicate named arguments in strict or non-strict mode. In traditional functions, duplicate named parameters are prohibited only in strict mode.

Basic use of arrow functions

1. Basic parameter usage (two parameters)

Const demo= (item,num)=>{console.log(item,num)} demo(1,2) // 1,2Copy the code

2. For a parameter, omit the parameter parentheses

        const sum= item=>{
		return item*item
	}
	console.log(sum(2)) //4
Copy the code

3. No parameters

        const sum= ()=>{
		console.log('')
	}
	sum()
Copy the code

4. Simplified writing of a function if there is only one line of code

// const sum=(num1,num2)=>{return num1*num2} console.log(sum(1,2)) const Sum = (num1, num2) = > num1. * num2 console log (sum (1, 2)) / / 2Copy the code

This shows the code in vUE

new Vue({
  render: h => h(App)
  render: (h)=>{
	  return h(app)
  }
})
Copy the code

The arrow function this points to the problem

1. Sample 1

SetTimeout (function(){console.log(this) //window},1000) // arrow function setTimeout(()=>{console.log(this) //window The outer this object is window},1500)Copy the code

2. Sample 2

Const abj={a:function(){setTimeout(function(){console.log('a1',this) // pointing to this}) setTimeout(()=>{a:function(){setTimeout(){console.log('a1',this) // pointing to this}) Console. log('a2',this) // pointing to a,b context this}) console.log('a',this) // calling this within an object points to the calling object itself A,b}, B: the function () {setTimeout (() = > {the console. The log (' b1 ', this) / / points to a, b context this})}} abj. () a.Copy the code