ES6新增—新增循环箭头函数

Posted 2020-09-02 夏至未至

5.新增循环：
以前for循环，for in循环
ES6新增循环：
for of 循环：遍历(迭代，循环)整个对象，变现类似于for in 循环
两者的区别：
for in循环:既可以循环数组，又可以循环json

循环数组：i代表数组的索引
var arr1=[‘apple‘,‘banana‘,‘appel‘,‘orange‘];
for(var i in arr1){
console.log(i); //0,1,2,3
}
循环json：name代表json的索引
var json=[a:‘apple‘,b:‘pear‘,c;‘orange‘];
for(var name in json){
console.log(name); //a,b,c
console.log(json[name]);
}

 

 

for of循环：可以循环数组，不可以循环json，该循环新增主要是为了循环map对象
循环数组：(用的很少)
1）只循环值value：
var arr1=[‘apple‘,‘banana‘,‘appel‘,‘orange‘];
for(var value in arr1){
console.log(value); //‘apple‘,‘banana‘,‘appel‘,‘orange‘
}
2）只循环索引key：
for(var key of arr1.keys()){
console.log(key); //0,1,2,3
}
3）值和索引都循环：
for(var name of arr1.entries()){
console.log(name); //0 apple,1 banana,2 appel,3 orange
}

 

循环map对象：
map对象：和json相似，也是一种key-value的形式，但与json对象也不完全相同
map对象是为了和for of循环而生的

创建并设置json对象：
var json={a:‘apple‘,b:‘pear‘,c:‘banana‘,d;‘orange‘}
获取json对象的某一项：json.a/json.b/json.c
删除json对象的某一项：delete json.b
循环json对象：使用for in 循环
for(var i in json){
console.log(json[i]);
}

 

创建map对象：var map=new Map();
设置map对象的内容：map.set(key,value);
获取map对象的内容：map.get(name);
删除map对象的内容：map.delete(name);
循环map对象：不能使用for in 循环
map循环的简写：
1）同时循环key和value
for(var name of map){
console.log(name); //这里的name既包含key,也包含value
}
2）只循环key,或者只循环value
for(var [key,value] of map){
console.log(key,value);
console.log(key);
console.log(value);
}
map循环的完整写法：
1)同时循环key和value，默认的情况是调用了map.entries()
for(var name of map){
console.log(name);
}
等价于：
for(var name of map.entries()){
console.log(name);
}
2)只循环索引key
for(var key of map.keys()){
console.log(key);
}
3）只循环value
for(var value of map.values()){
console.log(value);
}
示例：
var map=new Map();
map.set(‘a‘,‘apple‘);
map.set(‘b‘,‘pear‘);
map.set(‘c‘,‘orange‘);
map.set(‘d‘,‘banana‘);
alert(map.get(‘a‘)); //apple
map.delete(‘b‘); //删除pear这一项
for(var name of map){
console.log(name); //a apple, c orange, d banana
}
等价于：
for(var [key,value] of map){
console.log(key,value); //a apple, c orange, d banana
}

-----------------------------------------------------------------------------

6.箭头函数：
ES6一切从简：新增的是箭头函数
function show(a){return a;} var show=a=>a;
function show(a,b){return a+b;} var show=(a,b)=>a+b;
function show(){return ‘welcome‘} var show=()=>‘wlecome‘;
function show(){alert(1);} var show=()=>{alert(1);}
注意在箭头函数中：
this指向了window，并不是当前的执行对象，
形参arguments，不能使用了