#yyds干货盘点#【js学习笔记二十八】手写bind

简介: #yyds干货盘点#【js学习笔记二十八】手写bind

#yyds干货盘点#【js学习笔记二十八】手写bind

原创

前端歌谣            2022-05-13 17:38:22

               文章标签                                    返回函数                                                                                文章分类                                JavaScript                                前端开发                                                阅读数78


前言


我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷


导语


手写bind


image.pngimage.png

代码部分


Function.prototype.mybind = function (target) {
      //target:改变返回函数执行时的this指向
      var obj = target || window;
      console.log(arguments,"arguments")
      var args = [].slice.call(arguments, 1); //获取bind时传入的绑定实参
      var args1 = [].slice.call(arguments, 0); //获取bind时传入的绑定实参
      console.log(args,"args")
      console.log(args1,"args1")
      var self = this; //要bind的函数
      console.log(self,"self")
      var _fn = function () {
        var _args = [].slice.call(arguments, 0); //新函数执行时传递的实际参数
        console.log(_args,"_args")
        return self.apply(obj, args.concat(_args));
      }
      return _fn
    }
    var name = 'fangfang';
    var obj = {
      name: 'geyao'
    };
    function fn(a, b, c) {
      console.log(a + b + c + this.name);
      return a + b + c + this.name
    };
    fn.mybind(obj,"我的","老婆","是")(); // 我的老婆是geyao
相关文章
|
8天前
|
前端开发 JavaScript 开发者
揭秘JavaScript魔法三剑客:call、apply、bind,解锁函数新世界,你的前端之路因它们而精彩!
【8月更文挑战第23天】在 JavaScript 的世界里,`call`、`apply` 和 `bind` 这三个方法常常让新手感到困惑。它们都能改变函数执行时的上下文(即 `this` 的指向),但各有特点:`call` 接受一系列参数并直接调用函数;`apply` 则接收一个参数数组,在处理不确定数量的参数时特别有用;而 `bind` 不会立即执行函数,而是创建一个新版本的函数,其 `this` 上下文已被永久绑定。理解这三个方法能帮助开发者更好地运用函数式编程技巧,提升代码灵活性和可维护性。
18 0
|
30天前
|
JavaScript 前端开发
深入浅出 妙用Javascript中apply、call、bind
【8月更文挑战第1天】深入浅出 妙用Javascript中apply、call、bind
15 0
|
2月前
|
JavaScript
js【详解】call()、apply()、bind()方法
js【详解】call()、apply()、bind()方法
30 6
|
2月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的云的学习笔记系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的云的学习笔记系统附带文章源码部署视频讲解等
29 0
|
2月前
|
JavaScript
js【详解】bind()、call()、apply()( 含手写 bind,手写 call,手写 apply )
js【详解】bind()、call()、apply()( 含手写 bind,手写 call,手写 apply )
17 0
|
2月前
|
JavaScript
JS【详解】函数.bind()
JS【详解】函数.bind()
14 0
|
3月前
|
JavaScript 前端开发 开发者
【JavaScript】JavaScript中call、apply与bind的区别:进阶特性与应用场景
【JavaScript】JavaScript中call、apply与bind的区别:进阶特性与应用场景
33 0
|
4月前
|
JavaScript 前端开发
JavaScript的`bind`方法:函数的“复制”与“定制”
JavaScript的`bind`方法:函数的“复制”与“定制”
|
4月前
|
前端开发 JavaScript
【Web 前端】 js中call、apply、bind有什么区别?
【4月更文挑战第22天】【Web 前端】 js中call、apply、bind有什么区别?
【Web 前端】 js中call、apply、bind有什么区别?
|
4月前
|
移动开发 JavaScript 前端开发
webgl学习笔记3_javascript的HTML DOM
webgl学习笔记3_javascript的HTML DOM
47 0
webgl学习笔记3_javascript的HTML DOM