ECMAScript6新增属性
…操作符
…是es6中新添加的一种操作符,有两种意识,具体是哪种,看你如何使用它。
- 展开操作符 Spread
'use strict'
let food=['土豆','西红柿','香菜'];
console.log(food);
console.log(...food);
let foods=['木耳',...food];
console.log(foods);
console.log(...foods);
2.剩余操作符 Rest,一般用在函数的参数里面
function breakfast(dessert,drink,...food){
console.log(dessert,drink,food);
console.log(dessert,drink,...food);//这里的...就是展开操作符
}
breakfast("cake","mike","tomato","potato","fish");
解构参数
使用解构对象的方法,我们很容易为函数去设置一个对象的参数,
function breakfast(dessert,drink,{location,restaurant}={}){
console.log(dessert,drink,location,restaurant);
}
breakfast("cake","mike",{location:"济南",restaurant:"深夜食堂"});
输出:cake mike 济南 深夜食堂
name属性
使用name属性可以得到函数的名字
let breakfast=function(argument){
}
console.log(breakfast.name); //输出breakfast
let dinner=function superDinner(argument){
}
console.log(dinner.name);//输出superDinner,因为superDinner的优先级更高
箭头函数 Arrow Function
先定义一个变量,这个变量就可以作为函数的名字,等号的右边就是这个函数可以接收的函数的参数的名字。然后加一个箭头,箭头的左边是函数的参数,右边是函数返回的那个值。
'use strict'
let breakfast=(dessert,drink)=>dessert+drink;//与下面的代码作用相同
// let breakfast=function breakfast(dessert,drink){
// return dessert+drink;
// }
或者可以把有右边的返回值放在一个花括号里面
let breakfast=(dessert,drink)=>{
return dessert+drink;
}
对象表达式
现在你如果想在对象里面添加跟变量名一样的属性的话,并且这个属性的值就是这个变量表示的值,我们可以直接在变量上面加上这些属性而不需要再指定值。
let dessert="cake";
let drink="water";
// let food={
// dessert:dessert,
// drink:drink,
// breakfast:function(){
//
// }
// };//以前的版本
let food={
dessert,
drink,
breakfast(){
}
};
console.log(food);
输出:{dessert: “cake”, drink: “water”, breakfast: ƒ}