JavaScript:模拟实现call和apply

2021/7/19 11:06:38

本文主要是介绍JavaScript:模拟实现call和apply,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

call实现

call的作用

call() 方法在使用一个指定的 this 值和若干个指定的参数值的前提下调用某个函数或方法。

代码实现

直接上代码:

Function.prototype.call2 = function (context) {
    var context = context || window; //若context是null,最后this指向window
    context.fn = this; // 给这个上下文添加一个fn对象指向调用的的函数

    var args = [];
    for(var i = 1, len = arguments.length; i < len; i++) {
        args.push('arguments[' + i + ']');
    }

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

    delete context.fn //添加了fn之后还要删除这个属性
    return result; // 函数一般都有返回值
}

测试

var foo = {
    value: 1
};

function bar(name, age) {
    console.log(name)
    console.log(age)
    console.log(this.value);
}

bar.call2(foo, 'kevin', 18); 
// kevin
// 18
// 1

eval使用

apply实现

与call类似,注意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;
}


这篇关于JavaScript:模拟实现call和apply的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程