ES6函数写法 · PHP学习

# ES6函数写法 **1、函数参数的默认值** 函数的参数支持默认值，如果有多个值，要传参时，只能省略最后一个 ``` <pre class="calibre10">``` function str(x=10,y=20) { console.log(x, y); }; str(100);//100 20 ``` ``` 如果非要传y，可采用对象的形式来写 ``` <pre class="calibre10">``` function str({x,y=20}) { console.log(x, y); } //str();//报错 //str({y:50});//undefined 50 str({});//undefined 20 x没有默认值会输出undefined ``` ``` **2、函数参数的rest参数把剩余的参数包装到数组里** ``` <pre class="calibre10">``` function arr(x,y,...args) { //console.log(x);//1 //console.log(y);//2 //console.log(args);//[3,4,5] console.log(arguments);//实参个数是object对象，也是伪数组，不能使用数组的方法 args.forEach(function (item,i) { console.log(item);//3 4 5 }) } arr(1,2,3,4,5) ``` ``` 3、箭头函数有两种函数的写法函数的声明–>箭头函数不能用于有名函数函数的表达式 ``` <pre class="calibre10">``` let add = (x,y) => { return x+y; } //let add = (x,y) => x+y; console.log(add(10, 20));//30 //等效 function add(x,y){return x+y;} ``` ``` 简写：只有一个参数，可以省略() ``` <pre class="calibre10">``` let add = x =>{return x;} //let add = x =>x; console.log(add(50));//50 //等效 function add(x){return x;} ``` ``` 简写：当函数体只有一条语句时，后面表达式的值直接可以作为返回值 ``` <pre class="calibre10">``` let add = (x,y) => x+y; console.log(add(10, 20));//30 //等效 function add(x,y){return x+y;} ``` ``` 匿名函数： ``` <pre class="calibre10">``` var arr = [1,2,3,4]; //function(){} arr.forEach(function (item,i) { console.log(item); }) //es6： //()=>{} arr.forEach((item,i) => { console.log(item); }) //简写：x=>x省略括号（一个参数，当函数体只有一条语句时） arr.forEach(item => console.log(item)); ``` ``` 4、箭头函数中的this ``` <pre class="calibre17">``` //es5： function F() { console.log(this);//实例对象F var that = this; setTimeout(function () { console.log(this);//window console.log(that);//实例对象F },100); }; var per = new F(); function Fo() { console.log(this);//实例对象Fo var that = this; setTimeout(function () { console.log(this);//window console.log(that);//实例对象Fo }.bind(this),100); }; var per1 = new Fo(); //es6： function Foo() { setTimeout(() => { console.log(this);////实例对象Foo },1000) } var per2 = new Foo(); ``` ```