深入JavaScript: 手写call和apply

最新推荐文章于 2023-02-21 19:31:15 发布

IDeU

最新推荐文章于 2023-02-21 19:31:15 发布

阅读量1.4k

点赞数 1

分类专栏：笔记

本文链接：https://blog.csdn.net/qq_49316966/article/details/121348771

版权

笔记专栏收录该内容

13 篇文章 0 订阅

订阅专栏

本文详细讲解了JavaScript中Function.prototype.call和apply的方法，如何通过它们改变this指向并处理不定参数。通过实例演示了如何在函数内部设置作用域和使用扩展运算符处理arguments对象。

摘要由CSDN通过智能技术生成

Function.property.call

函数功能:

改变this指向
接受不定向传参

思路:
1.如何改变this的指向
: 在指定作用域添加函数作为其属性: 使this优先指向该作用域

2.如何接受不定向传参
:es 6扩展远算符 + arguments类数组

let id = 10017;
let obj = {
  id: 10018;
}
function Id(psw) {
  console.log(this.id)
  console.log(psw)
}
Id.call(obj)// 10018

Function.property.Mycall=function(context){
  context.func = this;
  context.func()
  delete context.func()
}

Function.property.Mycall=function(context){
  let context = context || window;
  context.func = this;
  let args = [];
  for(let i=1,len=arguments.length,i<len,i++) {
    args.push(arguments[i]);
  }
  let result = context.func(...args);
  delete context.func();
  return result;
}

Function.prototype.Mycall = function(content = window) {
    content.func = this;
    let args = [...arguments].slice(1);
    let result = content.func(...args);
    delete content.func;
    return result;
}

apply

Function.prototype.apply2 = function(context = window) {
    context.fn = this
    let result;
    // 判断是否有第二个参数
    if(arguments[1]) {
        result = context.fn(...arguments[1])
    } else {
        result = context.fn()
    }
    delete context.fn
    return result
}