ES语法中一些细节东西,怕久不用就忘 ,先mark下来。
1.es5中的forEach
let arr=[1,2,3,4,5];
arr.forEach(function (value) {
console.log(value); //1,2,3,4,5
});
这里有个注意的时,闭包里使用return返回值是不行的,并且不能使用break跳出循环
2.for…of语法
这是支持 return , break , continue语句的,遍历数组效果很好
相对于for–in 用于遍历对象的属性。而for-of 用于遍历数组中的元素。for..of还可以直接支持遍历字符串
for(let i of "abcdefg"){
console.log(i);
}
比如,我们可以通过一个set的对象,对数组进行去重的操作
let test=['a','a','b','c'];
let test2="aabbc";
let uniqueSets=new set(test); //或者 new set(test2);
for(let i of uniqueSets){
console.log(i); //a,b,c
}
比如,也可以建立一个map对象,然后使用for..of去遍历
let m = new Map();
m.set(1, "black");
m.set(2, "red");
m.set("colors", 2);
for (var [key, value] of m) {
console.log(key + "is: " + value);
}
原则上for...of是不用来遍历对象的,但也有一些方法遍历,比如使用Ojbect.keys()方法
let Obj={
name:'saitama',
length:5,
weight:'50KG'
};
for (var key of Object.keys(obj)) {
console.log(key + ": " + obj[key]);
}
3.箭头函数的用法,当只需要直接return的时候可以写成如下方式
箭头函数中使用this的话,this是指向外部,而不是函数体本身。强行在箭头函数使用this会返回undefined
let a=b=10;
const fn = (a, b) => a + b;
console.log(fn(a,b)); //20
效果和如下一样
function fn(a=10,b=10){
return a+b;
}
4.解析对象结构的写法
const props = {
className: 'btn-primary',
loading: '...',
clicked: '#save',
disabled: 'disabled'
}
将对象拆解成一个个独立的变量,
var { className,loading, clicked } = props;
// var {className='default'}设置默认值,当找不到的时候就输入默认值
console.log(loading); //...
console.log(className); //btn-primary