// 一.箭头函数 // 1.ES6新增一个使用(=>)箭头符号定义函数的语法特征 // let fn=name=>name; // console.log(fn('Mr.Lee'));
// 翻译成函数代码为: // let fn=function(name){ // return name; // }
// 2.箭头函数也可以传递两个或以上的参数,并实现运算后返回 // let fn=(x,y)=>x+y; // console.log(fn(10,20));
// 翻译成函数代码: // let fn=function(x,y){ // return x+y; // }
// 3.若定义的函数,不需要传参,可用()括号方式直接返回 // let fn=()=>'Mr.Lee'; // console.log(fn());
// 翻译成函数: // let fn=function(){ // return 'Mr.Lee'; // }
// 4.函数体需要更复杂的操作,可以将箭头符号右边使用传统函数体 // let fn=(x,y)=>{ // return x+y; // } // console.log(fn(10,20));
// 5.若箭头符号右边是对象,返回的是对象,则需要用圆括号包含着 // let fn=name=>({name:name,age:100}); // console.log(fn('Mr.Lee').name);
// 翻译成函数 // let fn=function(name){ // return{ // name:name, // age:100 // } // }; // console.log(fn('Mr.Lee').name);
// 6.若箭头符号左边是对象作为参数,右边是对象的属性运算,也支持 // let fn=({name,age})=>name+','+age; // console.log(fn({name:'Mr.Lee',age:100}));
// 7.自我立即执行函数,也可以使用箭头函数来创建 // ((name)=>{ // console.log(name); // })('Mr.Lee');
// 翻译成函数代码 // (function(name){ // console.log(name); // })('Mr.Lee');
// 二.绑定this // 1.ES6之前有个this指向的问题 // let obj={ // name:'Mr.Lee', // age:100, // fn:function(){ // // console.log(this); // // setTimeout(function(){ // // console.log(this.name+','+this.age);undefined // // },500) // let that=this; // setTimeout(()=>{ // console.log(that.name); // },500) // } // } // obj.fn();
// 2.上例,this全局指向window,在某个对象内部指向当前对象 // 3.当obj对象下包含类似setTimeout函数内部,this指向出问题 // 4.Web环境下,它指向window,node环境下它指向setTimeout // 5.通俗做法,将this在 setTimeout外部进行赋值保存 // 6.箭头函数的出现,彻底解决this在内部的指向问题,直接指向我们所需要的 // 7.箭头函数中this是最外层定义的函数绑定,不受内部影响 // let obj={ // name:'Mr.Lee', // age:100, // fn:function(){ // setTimeout(()=>{ // console.log(this); // console.log(this.name+','+this.age); // },500) // } // } // obj.fn();