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;
 
 
 
 

  
  };
 
 

如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。

 
 

  
  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对象，该对象在函数体内不存在。