ES6中的箭头函数的语法、指向、不定参数

箭头函数的语法

  function fn1() {
            console.log(1);
        }

        let fn2 = () => {
            console.log(2);
        }
        fn1()//1
        fn2()//2

        //箭头函数： 形参=>返回值
        //单个形参的最简写法，箭头函数作为匿名的回调函数是可以省略let fn ,既(形参)=>{语句}
        let fn = nub => nub * 2
        console.log(fn(10));//20

		//多个形参，语句单一。(形参1，形参2)=>返回值
		let fn = (num1, num2, num3) => num1 * num2 * num3
        console.log(fn(2, 3, 4))//24

        //多个形参，多条语句，不加return返回undefined
        let fn = (num1, num2, num3) => { let a = num1 + num2; let b =              num1 + num3 ;console.log(a + b)}
        console.log(fn(2, 3, 4))//报错undefined,与普通函数的没有return的值相同都是undefined

 		//多个形参，多条语句，必须用return返回函数值
 		let fn = (num1, num2, num3) => { let a = num1 + num2; let b =             num1 + num3 ;return(a + b)}
        console.log(fn(2, 3, 4))//11

箭头函数的不定参

不定参对应普通函数的arguments

         function fn1() {
            console.log(arguments);
        }
        fn1(1, 2, 3, 4)//伪数组arguments[1,2,3,4]

        let fn2 = () => {
            console.log(arguments);
        }
        fn2(1, 2, 3, 4)//arguments is not defined,也就是箭头函数没有不定参

		//解决剩余参数的方法
	let fn3 = (a, b, ...c) => {
            console.log(a, b, c)
        }
        fn3(1, 2, 3, 4)//1,2,[3,4],剩余参数以数组保存

        let fn3 = (a, b, ...c) => {
            console.log(c[0])
        }
         fn3(1, 2, 3, 4)//3,注意剩余参数以Array[3,4]进行保存

箭头函数的this的指向

		//本质，箭头函数的this在定义时所在的对象，其实质是因为箭头函数没有自己的this,用的是外层的this
	function fn1() {
            console.log(this);
        }
        fn1()//window

        let fn2 = () => {
            console.log(this);
        }
        fn2()//window,箭头函数本身没有this指向，在调用时指向其声明时所在作用域，这里声明在全局作用域下所以指向window

		//在点击事件中
		document.onclick = function () {
            let fn = () => { console.log(this) }
            fn()//this指向#document,指向调用时的作用域
        }

	//深入理解
	let fn
        let fn2 = function () {
            console.log(this);
            fn = () => { console.log(this) }
        }
        fn2()//先调用fn2为了给fn赋值为函数，全局函数this打印结果是指向window
        fn()//箭头函数调用时应指向声明所在的作用域，fn声明在fn2中，所以指向与fn2相同

	//深入理解--变形
       	let fn
        let fn2 = function () {
            console.log(this);
            fn = () => { console.log(this) }
        }
        fn2 = fn2.bind(document.body)//先调用fn2为了给fn赋值为函数
        fn2()//body
        fn()//body