揭开web前端的面纱

ES6之函数扩展

2017-03-13  本文已影响45人  ferrint

关键词:函数扩展

参数的默认值
     function fn(a,b=3,c){
       return {a,b,c}
     }
     console.log(fn(1));  // Object {a: 1, b: 3, c: undefined}
属性的默认值
   function ajax(options){
       var opt = {
        type:options.type || 'get'
       }
   };
rest:获取函数的多余参数
  function fn1(a,b,c,...rest){
    console.log(rest)  // 用于获取函数的多余参数
   }
   fn1(1,2,3,4,5,6,7);

// [4,5,6,7]

   var arr = [1,2,3,4,5,6,7];
   console.log(Math.max.apply(null, arr));
   // ES6 扩展运算符
   console.log(Math.max(...arr));

   var str = "ferrinte";
   var arr1 = [...str];  
   console.log(arr1); // ["f", "e", "r", "r", "i", "n", "t", "e"]
箭头函数
var f = v => v;
//  相当于
var f = function(v) {
  return v;
};
var f = () => 5;
// 等同于
var f = function () { return 5 };

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

// 箭头函数可以与变量解构结合使用。
const full = ({ first, last }) => first + ' ' + last;
// 等同于
function full(person) {
  return person.first + ' ' + person.last;
}

箭头函数使用注意:
1.函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
2.不可以当作构造函数,即不可以使用new命令,否则会抛出一个错误。
3.不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用Rest参数代替。
4.不可以使用yield命令,因此箭头函数不能用作Generator函数。
this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,导致内部的this就是外层代码块的this。正是因为它没有this,所以也就不能用作构造函数。

除了this,以下三个变量在箭头函数之中也是不存在的,指向外层函数的对应变量:arguments、super、new.target。
箭头函数没有自己的this,所以当然也就不能用call()、apply()、bind()这些方法去改变this的指向。

Set()
   // 数据结构
   // Set 是一个构造函数,可以传入一个数组
   var set = new Set([1,2,3,3,4,4,5]);
   console.log(set);      // Set {1, 2, 3, 4, 5}
   console.log(set.size); //5
   set.add(6);
   set.delete(5);
   console.log(set);         // Set {1, 2, 3, 4, 6}
   console.log(set.has(6));  // true
   set.clear();
   console.log(set);    // Set {}
Map()
   var obj = {
      name:'hexun'
   }
   var map = new Map([['name','lein'],['age','20'],['age','30'],[obj,23]]);
   map.set('sex','man')
   console.log(map);
   console.log(map.size);  // 4
   var arr = [...map];    
   console.log(arr);   // [Array[2], Array[2], Array[2], Array[2]]

   map.forEach(function(value,attr){
       console.log(arguments);  // 
   })
   for(var key of map.keys()){
       console.log(key)
   }
   for(var value of map.values()){
       console.log(value);
   }
   for(var [key,value] of map.entries()){
       console.log(key,value);
Symbol()
   // 唯一ID 
   var s = Symbol();
   console.log(s);
   console.log(typeof s);

   var s1 = Symbol('test');
   var s2 = Symbol('test');
   console.log(s1 == s2);

上一篇 下一篇

猜你喜欢

热点阅读