淘先锋技术网

首页 1 2 3 4 5 6 7

es6参考:点击打开链接

rest参数

        rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。

function sorNumber(){
    return [].slice.call(arguments,0).sort()
}
function sorNumberRest(x,y,...values){
    return values.sort()
}
sorNumber(1,8,9,6,7,8,4,3,2);       //[2, 3, 4, 6, 7, 8, 9]
sorNumberRest(1,8,9,6,7,8,4,3,2);   //1, 2, 3, 4, 6, 7, 8, 8, 9

函数的严格模式:    

        规定只要函数参数使用了默认值、解构赋值、或者扩展运算符,那么函数内部就不能显式设定为严格模式,否则会报错。因为函数内部的严格模式,同时适用于函数体和函数参数。但是,函数执行的时候,先执行函数参数,然后再执行函数体。这样就有一个不合理的地方,只有从函数体之中,才能知道参数是否应该以严格模式执行,但是参数却应该先于函数体执行。

function a(value = 070){"use strict"}
name属性

        返回函数名

 箭头函数 

let foo = () => 5;//直接返回5
let foo = (x,y,...values) => { return {x+y,values} };//多余的放进代码块里,用return 返回

        注意: 

            (1)函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。

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

            (3)不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。

            (4)不可以使用yield命令,因此箭头函数不能用作 Generator 函数。

 function Timer() {
  this.s1 = 0;
  this.s2 = 0;
  // 箭头函数
  setInterval(() => this.s1++, 1000);
  // 普通函数
  setInterval(function () {
    this.s2++;
  }, 1000);
}

var timer = new Timer();

setTimeout(() => console.log('s1: ', timer.s1), 3100);
setTimeout(() => console.log('s2: ', timer.s2), 3100);
// s1: 3
// s2: 0

        怎么实现箭头函数的这一特性的了,用es5实现es6来一窥究竟

function foo() {
  setTimeout(() => {
    console.log('id:', this.id);
  }, 100);
}

// ES5
function foo() {
  var _this = this;

  setTimeout(function () {
    console.log('id:', _this.id);
  }, 100);
}

        这里可以看到,箭头函数其实是直接调用的外层的this,同理可知thisargumentssupernew.target在箭头函数之中也是不存在的,指向外层函数的对应变量

双冒号运算

     箭头函数可以绑定this对象,大大减少了显式绑定this对象的写法(callapplybind)。但是,箭头函数并不适用于所有场合,所以现在有一个提案,提出了“函数绑定”(function bind)运算符,用来取代callapplybind调用。

foo::bar;
// 等同于
bar.bind(foo);

foo::bar(...arguments);
// 等同于
bar.apply(foo, arguments);

const hasOwnProperty = Object.prototype.hasOwnProperty;
function hasOwn(obj, key) {
  return obj::hasOwnProperty(key);
}
//如果双冒号左边为空,右边是一个对象的方法,则等于将该方法绑定在该对象上面
var method = obj::obj.foo;
// 等同于
var method = ::obj.foo;

let log = ::console.log;
// 等同于
var log = console.log.bind(console);
//如果双冒号运算符的运算结果,还是一个对象,就可以采用链式写法。
import { map, takeWhile, forEach } from "iterlib";

getPlayers()
::map(x => x.character())
::takeWhile(x => x.strength > 100)
::forEach(x => console.log(x));
尾调用优化

    1、尾调用

        函数编程的额一个重要概念,指函数的最后一步是调用一个函数

function f(x){
  return g(x);
}
/***************************错误示范*****************************/
// 情况一
function f(x){
  let y = g(x);
  return y;
}

// 情况二
function f(x){
  return g(x) + 1;
}

// 情况三
function f(x){
  g(x);
}

       2、尾调用优化:

       当我们在函数a里调用函数b的时候会在a的调用帧上在开一个b的调用帧,很占内存(如果b里又调用了c,那么会一层一层形成调用栈)。当尾调用的函数不再依赖外层函数的时候,我们删除a的调用帧,保留b的调用帧,就可以很大的节省内存。

function a(param){
  var v1 = 1,
      v2 = 2;
  return b(param);
}

function a(param){
  var v1 = 1;
  function inner(b){
    return b + v1;
  }
  return inner(param);
}

        注意:1、这里的param只是把它的值作为参数传给b,传的是param的值不是变量param,并不是依赖param变量,

                2、ES6 的尾调用优化只在严格模式下开启,正常模式是无效的。这是因为在正常模式下,函数内部有两个变量,可                      以跟踪函数的调用栈。

            func.arguments:返回调用时函数的参数。            

            func.caller:返回调用当前函数的那个函数。

               尾调用优化发生时,函数的调用栈会改写,因此上面两个变量就会失真。严格模式禁用这两个变量,所以尾调用模式仅在                 严格模式下生效。

尾递归

        顾名思义就是在函数尾调用出,调用的是自己形成递归,这回不断的产生调用帧,形成调用栈,很可能超出最大调用栈,所以我们考虑优化它,主要思路是把递归变成循环

       下面是一个递归,我们运行就会超出醉倒调用栈

function sum(x, y) {
  if (y > 0) {
    return sum(x + 1, y - 1);
  } else {
    return x;
  }
}

sum(1, 100000)

        蹦床函数(trampoline)可以将递归执行转为循环执行

function trampoline(f) {
  while (f && f instanceof Function) {
    f = f();  //注意这里返回的是一个函数,然后执行这个函数,而不是返回函数的执行结果
  }
  return f;
}
function sum(x, y) {
  if (y > 0) {
    return sum.bind(null, x + 1, y - 1);
  } else {
    return x;
  }
}
trampoline(sum(1, 100000))
// 100001

        蹦床函数并不是真正的尾递归优化,下面的实现才是。

function tco(f) {
  var value;
  var active = false;
  var accumulated = [];

  return function accumulator() {
    accumulated.push(arguments);
    if (!active) {
      active = true;
      while (accumulated.length) {
        value = f.apply(this, accumulated.shift());
      }
      active = false;
      return value;
    }
  };
}

var sum = tco(function(x, y) {
  if (y > 0) {
    return sum(x + 1, y - 1)
  }
  else {
    return x
  }
});

sum(1, 100000)
// 100001
         上面代码中, tco 函数是尾递归优化的实现,它的奥妙就在于状态变量 active 。默认情况下,这个变量是不激活的。一旦进入尾递归优化的过程,这个变量就激活了。然后,每一轮递归 sum 返回的都是 undefined ,所以就避免了递归执行;而 accumulated 数组存放每一轮 sum 执行的参数,总是有值的,这就保证了 accumulator 函数内部的 while 循环总是会执行。这样就很巧妙地将“递归”改成了“循环”,而后一轮的参数会取代前一轮的参数,保证了调用栈只有一层