ES6学习（三）（for ...of循环，箭头函数）

本文主要是介绍ES6学习（三）（for ...of循环，箭头函数），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1、for ... of 循环

JavaScript原有的for...in循环，只能获得对象的键名，不能直接获取键值。ES6提供for...of循环，允许遍历获得键值。

    上面代码表明，for...in循环读取键名，for...of循环读取键值。

     for...of循环还可以遍历对象。

     上面代码一共包含三个例子，第一个是for...in 循环的例子，后两个是for...of循环的例子。最后一个例子是同时遍历对象的键名和键值。

2、箭头函数(arrow)
(1) 定义

 ES6允许使用"箭头"（=>）    定义函数。

 var f  = v => v;上面的箭头函数等同于：

 var f = function(v){
     return v;
 }

如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。
var f = () =>5;

//等同于

 
var f = () => 5; 
// 等同于
var f = function (){ return 5 };
var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
    return num1 + num2;
};

 
var sum = (num1, num2) => { 
  console.log(...[num1,num2]);
  return num1 + num2; 
}

由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号。

     
var getTempItem = id => ({ id: id, name: "Temp" });

（2）实例：回调函数的简化
箭头函数的一个用处是简化回调函数。

 
// 正常函数写法
[1,2,3].map(function (x) {
  return x * x;
});
// 箭头函数写法
[1,2,3].map(x => x * x);

另一个例子是

     
// 正常函数写法
var result = values.sort(function(a, b) {
    return a - b;
});
// 箭头函数写法
var result = values.sort((a, b) => a - b);

（3）注意点

箭头函数有几个使用注意点。

●函数体内的this对象，绑定定义时所在的对象，而不是使用时所在的对象。

●不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。

●不可以使用arguments对象，该对象在函数体内不存在。

这篇关于ES6学习（三）（for ...of循环，箭头函数）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！