JacaScript实现call apply bind函数

一、call函数

模拟实现第一步：整体思路

Function.prototype.call2=function(context){

   context.fn=this; //1、将函数（谁调用 即this）设为对象（参数）的属性

   context.fn(); //2、执行该函数

   delete context.fn;//3、删除对象中的函数属性

}

模拟实现第二步：加上参数

Function.prototype.call2 = function(context) {

    context.fn = this;

    var args = [];

    for(var i = 1, len = arguments.length; i < len; i++) {

        args.push('arguments[' + i + ']'); //// 执行后 args为 ["arguments[1]", "arguments[2]", "arguments[3]"]

    }

    eval('context.fn(' + args +')'); //这里 args 会自动调用 Array.toString() 这个方法。

    delete context.fn;

}

模拟实现第三步：一些小问题

Function.prototype.call2 = function (context) {

    var context = context || window; //this 参数可以传 null，当为 null 的时候，视为指向 window

    context.fn = this;

    var args = [];

    for(var i = 1, len = arguments.length; i < len; i++) {

        args.push('arguments[' + i + ']');

    }

    var result = eval('context.fn(' + args +')'); //函数是可以有返回值的！

    delete context.fn

    return result;

}

Function.prototype.call = function (context, ...args) {

  var context = context || window;

  context.fn = this;

  var result = eval('context.fn(...args)'); //采用ES6的语法

  delete context.fn

  return result;

}

二、apply函数

Function.prototype.apply = function (context, arr) {

    var context = Object(context) || window;

    context.fn = this;

    var result;

    if (!arr) {

        result = context.fn();

    }

    else {

        var args = [];

        for (var i = 0, len = arr.length; i < len; i++) {

            args.push('arr[' + i + ']');

        }

        result = eval('context.fn(' + args + ')')

    }

    delete context.fn

    return result;

}

Function.prototype.apply = function (context, arr) {

  let context = context || window;

  context.fn = this;

  let result = eval('context.fn(...arr)');

  delete context.fn

  return result;

}

巴特西

JacaScript实现call apply bind函数

一、call函数

模拟实现第一步：整体思路

模拟实现第二步：加上参数

模拟实现第三步：一些小问题

二、apply函数

最新文章

热门文章