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

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,不能使用了

时间: 2024-07-30 06:56:20

ES6新增—新增循环、箭头函数的相关文章

es6 入门 变量,箭头函数,变量字符串拼接

ES6里面,变量表示方法不再只有var 一种,而变成了三种. var , let, const let 和var 的区别呢,是无法定义let 两次,但是内容还是可以换的. 这避免了不小心覆盖了变量的可能性. let oop = '00p' oop=23; console.log(oop); //23 ____________________________ let oop = '00p' let oop=23; console.log(oop); // SyntaxError: Identifi

关于es6的箭头函数使用与内部this指向

特型介绍:箭头函数是ES6新增的特性之一,它为JS这门语言提供了一种全新的书写函数的语法. 'use strcit'; let arr = [1,2,3]; //ES5 let es5 = arr.map(function(n){ return n*2; }); //ES6 let es6 = arr.map(n => n*2); console.log(es5); //[2,4,6] console.log(es6); //[2,4,6] 箭头函数简化了原先的函数语法,不需要再写 functi

ES6中箭头函数的作用

我们知道在ES6中,引入了箭头函数,其本质就是等同有ES5中的函数.类似于下面的写法: let test1=() => "abc"; let test2=() => { return "abc"}; let sum=(a,b) => a+b; 比如上面的3个ES6的箭头函数的写完,如果用ES5就像下面的写完一样. 其实其等同于下面的ES5的写法: function test1() { return "abc" } functio

深入理解this机制系列第三篇——箭头函数

× 目录 [1]痛点 [2]解决 [3]基本用法[4]回调函数[5]注意事项 前面的话 this机制与函数调用有关,而作用域则与函数定义有关.有没有什么是可以将this机制和作用域联系起来的呢?本文将介绍ES6新增的内容——箭头函数 痛点 对于闭包的痛点在于,闭包的this默认绑定到window对象,但又常常需要访问嵌套函数的this,所以常常在嵌套函数中使用var that = this,然后在闭包中使用that替代this,使用作用域查找的方法来找到嵌套函数的this值 var a = 0;

箭头函数

在ES6以前我们用 function 来定义函数,还记得楼主刚学js那会儿老是把function写错 (╯‵□′)╯︵┻━┻,但是自从ES6中出现了箭头函数以后,妈妈再也不担心我写成 fnuction了,那么我们下面开始正式学习! 基本语法: ES6允许使用"箭头"(=>)定义函数. let func = (num) => num; 上面的箭头函数等同于: let func = function (num) { return num; } 小伙伴们发现了什么?没错, ES6

箭头函数中的this指向

最近做的项目中遇到了在箭头函数里使用this时报错的问题,把箭头函数的写法改成function()后,this的指向才达到预期.关于这个问题值得研究一下. 在箭头函数出现之前的ES5时代,this指向它的调用者.是哪个对象调用了这个属性或方法,this就指向这个对象.这有点像"我"这个人称代词,是从谁的嘴里说出了"我",这个"我"就指代了谁. 一个简单的例子: // 用var定义的变量,this指向window // 调用sayName()等于调

ES6的新增特性

目录 第一篇.开发环境搭建 第二篇.三种声明方式 2.1 var(全局声明) 2.2 let(局部声明) 2.3 const(常量声明) 第三篇.解构赋值 3.1 数组的解构赋值 3.2 对象的解构赋值 3.3 字符串的解构赋值 第四篇.对象扩展运算符和rest运算符 4.1 对象扩展运算符 4.2 rest运算符 第五篇.新增字符串 5.1 字符串模板 5.2 字符串查找 5.3 字符串的复制 第六篇.数字的操作 6.1 数字判断 第七篇.数组方法 7.1 Array.from() 7.2 A

ES6的箭头函数详解:

箭头函数是ES6中新增一个函数表达形式,它是对函数的一种简化ES6允许使用"箭头"(=>)定义函数. Eg: var f = v => v; 等同于之前 var f = function(v) { return v; }; const Even = n => n % 2 == 0; const Square = n => n * n; 注: 箭头函数就是省略了function 参数集与函数体之间一定要有一个箭头=> 对于参数集而言: 零个参数用 () 表示

【转载】ES6——箭头函数

转载自:https://segmentfault.com/a/1190000004470909 侵删! 箭头函数 定义 定义一个箭头函数很简单,基本语法是: ([param] [, param]) => { statements } param => expression param 是参数,根据参数个数不同,分这几种情况:() => { ... } // 零个参数用 () 表示:x => { ... } // 一个参数可以省略 ():(x, y) => { ... } //