首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

手写JS函数call、apply、bind

之所以要写这篇,是因为曾经面试被要求在白纸上手写bind实现  结果跟代码一样清晰明确,一阵懵逼,没写出来!  下面,撸起袖子就是干!~  把call、apply、bind一条龙都整一遍!...context : window) // 防止覆盖掉原有属性 const key = Symbol() // 这里this为需要执行方法 context[key] = this // 方法执行...context : window) // 防止覆盖掉原有属性 const key = Symbol() // 这里this为需要执行方法 context[key] = this // 方法执行...定义与使用Function.prototype.bind(): developer.mozilla.org/zh-CN/docs/…// Function.prototype.bind()样例function...指向,返回新function对象const newFun = fun.bind(_this)newFun(1, 2)// 输出:YIYING3手写实现/** * 自定义bind实现 * @param context

1.2K20

手写JS函数call、apply、bind

之所以要写这篇,是因为曾经面试被要求在白纸上手写bind实现  结果跟代码一样清晰明确,一阵懵逼,没写出来!  下面,撸起袖子就是干!~  把call、apply、bind一条龙都整一遍!...context : window) // 防止覆盖掉原有属性 const key = Symbol() // 这里this为需要执行方法 context[key] = this // 方法执行...context : window) // 防止覆盖掉原有属性 const key = Symbol() // 这里this为需要执行方法 context[key] = this // 方法执行...定义与使用Function.prototype.bind(): developer.mozilla.org/zh-CN/docs/…// Function.prototype.bind()样例function...指向,返回新function对象const newFun = fun.bind(_this)newFun(1, 2)// 输出:YIYING3手写实现/** * 自定义bind实现 * @param context

1.1K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    js原生函数之call和apply,bind

    call 和 apply call 和 apply 和 bind 都是为了改变某个函数运行时 context 即上下文而存在,换句话说,就是为了改变函数体内部 this 指向。...js原生函数call和apply都不陌生,这两个方法作用相似,接受两类参数。 第一类是context(上下文),传入参数作为执行函数上下文,也是要传入第一个参数。...bind方法用于明确指定调用 this 方法。在作用域方面,类似于 call 和 apply 。当你将一个对象绑定到一个函数 this对象时,你就会用到 bind。...(tom)());//reading bind 和 call使用方式很类似,同样接受两部分参数,上下文this和作用函数后续参数,下面是我猜想bind模拟实现方法。...和call主要区别在于,bind返回是一个新函数,而call这是直接执行了该函数

    89000

    jsbind函数那些你可能没想过

    1 js中对一个bind返回函数执行new时会怎样 function A(a,b){ this.a=a; this.b=b } var a = A.bind({x:1},1) var...2 js中当函数执行bind后再次执行bind或call时会怎样 var test = function(x,y){ console.log(this,arguments) } var a=test.bind...bind函数说明中我们知道,当我们用一个函数调用bind时候,返回函数中会保存这三个参数。...所以最后调用call时候执行函数是目标函数,也就是调用了bind函数,传入this也是bind调用时传入,这些都是无法被修改了,但是参数是调用bind和call时叠加,这是我们唯一可以修改地方...3 js中对bind返回函数执行new时候,instanceof行为 function A(){ } var b = A.bind({}) var c = new b(); c instanceof

    58510

    一起手写JS函数call、apply、bind

    之所以要写这篇,是因为曾经面试被要求在白纸上手写bind实现  结果跟代码一样清晰明确,一阵懵逼,没写出来!  下面,撸起袖子就是干!~  把call、apply、bind一条龙都整一遍!...context : window) // 防止覆盖掉原有属性 const key = Symbol() // 这里this为需要执行方法 context[key] = this // 方法执行...context : window) // 防止覆盖掉原有属性 const key = Symbol() // 这里this为需要执行方法 context[key] = this // 方法执行...定义与使用Function.prototype.bind(): developer.mozilla.org/zh-CN/docs/…// Function.prototype.bind()样例function...指向,返回新function对象const newFun = fun.bind(_this)newFun(1, 2)// 输出:YIYING3参考 前端进阶面试题详细解答手写实现/** * 自定义bind

    30830

    JS call apply bind 方法

    jscall apply bind 方法都很常见,目的都是为了改变某个方法执行环境(context) call call([thisObj[,arg1[, arg2[,   [,.argN]]]]]...bind bind(thisArg [, arg1 [, arg2, …]]); bind 也是改变某个方法执行环境,区别也在于第二个参数(也是一个个参数形式)和“返回值”特性。   ...它将一个func绑定给thisArg上下文,并传入相应参数,并以一个新函数形式返回,以供调用。...注1:但IE9(包括IE9)以上才支持bind 所以,在不支持bind浏览器上,我们需要模拟一下 Function.prototype.Bind = function(context){ var...,1); // 返回一个新函数 return function(){ // 将相关参数赋给这个bind所在方法,并将执环境赋给context return

    1.6K30

    参数绑定---bind函数

    标准库bind函数 我们可以解决向check_size传递一个长度参数问题。 方法是使用一个新名为bind标准库函数,它定义在头文件functional中。...可以将bind函数看作一个通用函数适配器,它接受一个可调用对象,生成一个新可调用对象来适应原对象参数列表 调用bind一般形式为: auto newCallable=bind(callable,...与bind函数一样,placeholders命名空间也定义在functional头文件中 bind参数 我们可以用bind绑定给定可调用对象中参数或重新安排其顺序。...标准库中还有一个cref 函数,生成一个保存const引用类 与bind一样,函数ref和cref定义在头文件functional中 注意: 标准库中定义了两个分别为bindlst和bind2nd函数...由于这些函数局限太强,在新标准库中已经被弃用。 新c++程序应该使用bind

    1.2K30

    JS 手写: call、apply、bind

    # Try it bind() 方法创建一个新函数,在 bind() 被调用时,这个新函数 this 被指定为 bind() 第一个参数,而其余参数将作为新函数参数,供调用时使用。...如果 bind 函数参数列表为空,或者 thisArg 是 null 或 undefined,执行作用域 this 将被视为新函数 thisArg。 arg1, arg2, ......# 描述 bind() 函数会创建一个新绑定函数(bound function,BF)。...# 示例 # 创建绑定函数 bind() 最简单用法是创建一个函数,不论怎么调用,这个函数都有同样 this 值。...只要将这些参数(如果有的话)作为 bind() 参数写在 this 后面。当绑定函数被调用时,这些参数会被插入到目标函数参数列表开始位置,传递给绑定函数参数会跟在它们后面。

    1.5K30

    apply、call、bind函数区别

    apply、call、bind函数区别一、前言大多数人都知道,使用apply、call、bind可以调用函数,并改变函数中this指向。做一个简单记录,免得以后忘记了。...var showInfo2 = user.showInfo.bind(other);showInfo2(other.age, other.sex);可以看到,bind在使用时候会返回一个改变this函数...call、bind他们异同点相同点:都可以改变函数中this指向,且都将作为第一个参数进行使用不同点(传参方面)apply:在传入改变this对象之后,将原来函数参数,打包成一个数组进行传参call...:在传入改变this对象之后,依次传入原本函数参数bind:由于特性,它传参分为一次参数和二次传参,一次传参与call相同;二次传参首次传参与call类似,后一次调用传参补全原函数剩余参数不同点...(调用方面)apply、call:函数.apply()或者函数.call(),即可发起调用bind:先返回一个改变指向函数,再通过这个函数进行调用我是半月,祝你幸福!!!

    9210

    JS中call apply bind用法

    谁调用当前属性或者方法,它就是谁 /* 2.1.bind方法作用 修改函数或者方法中this为指定对象, 并且会返回一个修改之后函数给我们 注意点...: bind方法除了可以修改this以外, 还可以传递参数, 只不过参数必须写在this对象后面 */ //call apply bind修改this.../*call:修改函数或者方法中this为指定对象, 并且会立即调用修改之后函数 注意点: call方法除了可以修改this以外, 还可以传递参数, */.../*apply:修改函数或者方法中this为指定对象, 并且会立即调用修改之后函数 注意点: apply方法除了可以修改this以外, 还可以传递参数, 只不过参数必须通过数组方式传递...console.log(this); } test(10,20); window.test(); let fn=test.bind

    2.9K30

    JS手撕(四) call、apply、bind、柯里化、偏函数

    JS手撕(四)    call、apply、bind、柯里化、偏函数 call call()方法就是使用一个指定this值和一个或多个参数来调用一个函数。...bind bind()也能够像上面一样,使用指定this值,不过有一个很大不同,那就是bind()是返回一个函数,而不是立即调用。...顺带提一下一个注意点:调用bind()时,可以传参,调用该方法返回函数也可以传参。所以会有两拨参数。...,实际上,我们想要是Person {name: 'tttt', age: 21}结果,而且使用原生bind是能正常得到结果。...手写题(搞懂后,提升真的大) - 掘金 GitHub - qianlongo/fe-handwriting: 手写各种js Promise、apply、call、bind、new、deepClone…

    45540

    JSbind、apply、call理解

    概要 call、apply、bind 都是用来修改函数this, 传参时,call是一个个传参,apply是数组形式传参,call和apply立即执行并且返回值是你调用方法返回值,若该方法没有返回值...bind是改变this后返回一个新函数,他不会立即执行。 这三个方法不会改变原方法this指向。 Bind 复制原方法传入新this指向后生成新方法,参数可传多个。...console.info(this.name + "和" + name + "一块玩"); } }; let b = { name: "小红" }; a.play("小刚"); a.play.bind..." }; a.play("小刚", "小李"); a.play.apply(b, ["小刚", "小李"]); 显示 小明和小刚、小李一块玩 小红和小刚、小李一块玩 结论: call、apply、bind...是Function.prototype下方法,作用是执行一下目标函数,执行时顺便把目标函数this改一下,然后把结果输出,执行后,不会影响原函数this!

    96210

    jsthis、call、apply、bind、继承、原型链

    本文来自我github 0.前言 这些都是js基础进阶必备了,有时候可能一下子想不起来是什么,时不时就回头看看基础,增强硬实力。...= 1 } var f = new F() call、apply、bind 指向传入函数第一个参数。...前两者都是一样,只是参数表现形式不同,bind表示是静态前两者,需要手动调用 a.call(b,args)让函数a执行上下文指向b,也就是b属性就算没有a函数,也能像b.a(args)这样子调用...} } 此外,需要注意,一个函数bind后,以后无论怎么用call、apply、bind,this指向都不会变,都是第一次bind上下文 3.从call到继承 首先,js没有严格意义上子类父类...但是,无法获取F原型上属性。 另外,方法也是写在内部 this.f = function(){} 也注定无法实现函数复用了,每一个实例都有一个函数,浪费内存。

    96010

    boost::bind 不能处理函数重载 (error: no matching function for call to bind)

    不过此时我仍怀疑是参数问题,于是增加了一个同名函数重载,参数照抄 create_task,结果就失败了;最神奇是改为之前那版 start_task 也不行了,这才开始怀疑是函数重载问题。...bind + 函数重载" 得到一些新方案 (不能加 boost,bing 坑我),主要分两种: 强制转换 模板参数 其实不管哪种方式,都是在 bind 无法区分重载函数场景下,告诉 bind 我们要绑定是哪个重载版本...按理说根据提供给 bind 参数,再匹配重载函数参数列表,应该可以挑选正确重载版本。...当然,比较迷是,这里只有一个两参数版本,bind 仍然报错了,这是够懒。另外有些网上文章说 (附录 4),bind 会挑选重载函数中第一个声明版本,如果通过就通过,如果不通过就报错。...使用boost::bind和重载函数访客模式 [6]. std::bind 和 成员函数重载函数 [7].  C++类重载函数function和bind使用 [8].  C++ 闭包 探秘

    1.2K50

    js call()、apply()、bind()用法和区别

    特性: fun.call(thisArg,arg1,arg2,…) 会立即调用fun函数; call 方法将一个函数对象上下文从初始上下文改变为由 thisArg 指定新对象,如果没有提供 thisArg...() 语法: fun.bind(thisArg,[arg1,arg2,…]) fun: 表示一个函数 thisArg: this要指向对象,如果是null 和 undefined,则指向window全局对象...特性: fun.bind(thisArg,arg1,arg2,…) 不会立即调用fun函数,会返回一个新指定了this函数bind方法将一个函数对象上下文从初始上下文改变为由 thisArg...(obj, 1, 2); // 返回是一个新指定了this函数 newFun(); // 3 4. call()、apply()和bind()应用 1. call() call 常用来继承,因为...() 如果我们想改变某个函数内部this指向,但又不需要立即调用该函数,此时用bind: 点击 let

    1.1K30

    重写手动实现bind函数

    前面发了一篇文章,面试题目之原生实现call、apply、bind,这篇文章介绍了如何手动实现call、apply、bind,但是前不久重读这篇文章时发现了实现bind代码不是很完善,我们看一段代码...我们得到结论:用bind改变了this指向函数,如果用new操作符来调用,bind将会失效。...} } 我们用自己实现mybind函数,来实现文章最上面的例子,测试一下如果,用mybind函数改变了构造函数this,然后用new来执行生成函数,能否得到和原生bind一样效果,测试代码如下...我们用上面实现mybind改变函数this,然后调用new方法,发现并未实现和原生bind一样效果,我们实现mybind方法和原生bind实现功能还有些差距,那么我们如何修正呢?...完美实现了和原生bind一样效果,对一个知识点进行比较深入研究确实不容易,越深入发现涉及知识越广泛,就像这篇文章,虽然说得是bind手动实现,但是其实涉及了new操作符调用原理,instanceof

    1.5K32
    领券