手写call,apply,bind实现

待我称王封你为后i 2024-04-17 13:53 35阅读 0赞

## call,apply,bind函数其本质是实现改变函数上下文环境,即改变this ##

### call实现 ###

Function.prototype._call = function (context) {
          var context = context || window; 
          context._fn_ = this;
          var [_this, ...args] = arguments
          var result = context._fn_(...args)
          delete context._fn_;
          return result; //可能this函数会有返回值
        }
    复制代码

### apply实现 ###

Function.prototype._apply = function (context) {
          var context = context || window;
          context._fn_ = this;
          var [_this, args] = arguments //需要校验args为数组
          console.log('args :', args);
          var result = context._fn_(...args)
          delete context._fn_;
          return result;
        }
    复制代码

### bind实现 ###

###### 借助apply实现 ######

Function.prototype._bind = function (context, ...args) {
          return () => {
            this.apply((context || window), args)
          }
        }
    复制代码

###### 纯原生实现 ######

Function.prototype._bind2 = function (context=window, ...args) {
          context._fn_ = this
          return () => {
            context._fn_(...args);
          }
        }
    复制代码

转载于:https://juejin.im/post/5d47b164f265da03f47c0604

发表评论取消回复

表情：

评论列表（有 0 条评论，35人围观）

还没有评论，来说两句吧...

相关阅读

相关手写实现bind()

> 逐步实现js的`bind`方法 > > 1. 原函数无参数版 `bind` > 2. 原函数带参数版 `bind` > 3. 区分原函数是否作为构造函数一.

淩亂°似流年/ 2022年11月21日 09:45/ 0 赞/ 180 阅读

相关手写实现call(), apply()

一、call() 1. ES6之前 Function.prototype.myCall = function (_context){

╰半橙微兮°/ 2022年11月21日 09:40/ 0 赞/ 134 阅读

相关 JSONP的手写实现

JSONP的前世今生 JSONP的出现是为了解决`跨域`——浏览器请求资源调用的问题而出现的。在了解跨域概念之前，需要先学习`同源策略` 同源策略同源策略是

梦里梦外;/ 2022年10月30日 12:21/ 0 赞/ 127 阅读

相关手写实现一个HashMap

手写实现一个HashMap 前言 HashMap是Java中常用的集合，而且Hash

Myth丶恋晨/ 2022年05月28日 01:40/ 0 赞/ 156 阅读

相关手写签名的实现

使用`UberSignature`实现手写签名功能。 [UberSignature][] 效果图 ![手写签名][70] 代码示例 [demo][] 使用说明

怼烎@/ 2022年05月17日 23:05/ 0 赞/ 262 阅读

相关手写ArrayList的实现

一.引言众所周知ArrayList是一种数组的实现方式,也就说明其有序有下标不肯重复,查询快增删慢的特点,今天有时间就研究了一下其实现方法并手写了一些,实现原理草考以下链接

矫情吗；*/ 2022年03月19日 04:55/ 0 赞/ 202 阅读

相关手写实现一个Promise

function NewPromise (fn) { this.state = 'pending' this.fulfillL

骑猪看日落/ 2022年02月22日 16:46/ 0 赞/ 330 阅读

相关 python手写神经网络实现识别手写数字

-------------------- 写在开头：这个实验和[matlab手写神经网络实现识别手写数字][matlab]一样。 --------------------

矫情吗；*/ 2021年12月18日 14:39/ 0 赞/ 317 阅读

相关手写JS实现Promise

Promise是一个管理异步编程的方案，它是一个构造函数，每次使用可用new创建实例；它有三种状态：pending、fulfilled和rejected，这三种状态不会受...

朱雀/ 2020年05月10日 16:26/ 0 赞/ 886 阅读

相关手写JS实现Promise

Promise是一个管理异步编程的方案，它是一个构造函数，每次使用可用new创建实例；它有三种状态：pending、fulfilled和rejected，这三种状态不会受...

朱雀/ 2020年05月07日 09:18/ 0 赞/ 862 阅读