js bind（）（关于原生js中bind函数的简单实现）

：暂无数据 2026-07-17 21:50:02 ：0

各位老铁们好，相信很多人对js bind()都不是特别的了解，因此呢，今天就来为大家分享下关于js bind()以及关于原生js中bind函数的简单实现的问题知识，还望可以帮助大家，解决大家的一些困惑，下面一起来看看吧！

本文目录

关于原生js中bind函数的简单实现
js什么时候用bind绑定this
[JS] 先bind后new，this的指向

关于原生js中bind函数的简单实现

今天继续研究了bind函数的实现，也知道了shim和polyfill的说法，现在总结一下，
if
(!Function.prototype.bind)
{
Function.prototype.bind
=
function
(oThis)
{
if
(typeof
this
!==
"function")
{
//
closest
thing
possible
to
the
ECMAScript
5
internal
IsCallable
function
throw
new
TypeError("Function.prototype.bind
-
what
is
trying
to
be
bound
is
not
callable");
}
var
aArgs
=
Array.prototype.slice.call(arguments,
1),
fToBind
=
this,
fNOP
=
function
()
{},
fBound
=
function
()
{
return
fToBind.apply(this
instanceof
fNOP
&&
oThis
?
this
:
oThis
||
window,
aArgs.concat(Array.prototype.slice.call(arguments)));
};
fNOP.prototype
=
this.prototype;
fBound.prototype
=
new
fNOP();
return
fBound;
};
}
这是官方文档上的实现，我分二个方面来谈我要说的东西，
第一个是参数，agruments的使用
var
aArgs
=
Array.prototype.slice.call(arguments,
1),这里是将bind函数的参数数组取出来，第一个参数不要（就是不要oThis）也就是要被绑定方法的那个对象，第二个是
aArgs.concat(Array.prototype.slice.call(arguments)));
这里是用了数组的方法，把参数插在参数数组后面，要注意，这个函数是要被return
出去然后执行的，他的参数数组是return出去的那个fBound函数的参数数组，所以上下两个参数数组是不一样的，有点像柯里化。
第二个是上下文，在其中上下文的变化比较难理解，bind函数主要就是为了绑定上下文来使用的
fToBind
=
this
这里是保存了对象的上下文，紧接着下面的apply方法让要被绑定的那个对象可以使用该上下文
fNOP.prototype
=
this.prototype;
fBound.prototype
=
new
fNOP();
这里是以fNOP为中介把this.prototype这个原对象的属性给fBound，确保fBound是在定义的时候的那个上下文里面执行。本来
bound.prototype
=
self.prototype就可以将原属性集成过来了，但是这样两个对象属性都指向同一个地方，修改
bound.prototype
将会造成self.prototype
也发生改变，这样并不是我们的本意。所以通过一个空函数
nop
做中转，能有效的防止这种情况的发生。
以上这篇关于原生js中bind函数的简单实现就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

js什么时候用bind绑定this

在JavaScript中，我们经常用到函数绑定，而当你需要在另一个函数中保持this上下文时，使用Function.prototype.bind()会很方便.
var myObj = {
specialFunction: function () {
},
anotherSpecialFunction: function () {
},
getAsyncData: function (cb) {
cb();
},
render: function () {
var that = this;
this.getAsyncData(function () {
that.specialFunction();
that.anotherSpecialFunction();
});
}
};
myObj.render();
为了保持myObj上下文，设置了一个变量that=this，这样是可行的，但是没有使用Function.prototype.bind()看着更整洁：
render: function () {
this.getAsyncData(function () {
this.specialFunction();
this.anotherSpecialFunction();
}.bind(this));
}

[JS] 先bind后new，this的指向

非严格模式下，以下调用方式中， this 绑定为全局对象 window ，

而在严格模式下， this 绑定为 undefined 。

值得注意是的，只有 this 处于严格模式中，才会绑定为 undefined ，
与 f 被调用的位置是否处于严格模式无关。

可见 new 对 this 的影响比 bind 优先级要高，
g 虽然通过 bind 绑定了 this 指向的对象为 {a:1} ，
但是使用 new g 调用的时候， this 仍然指向以 f 为构造函数的实例。

值得注意的有两点，
（1） bind 之后， g.prototype 为 undefined 。

（2） new g 返回的对象 obj ，使用 instanceof 判断 f 和 g 都为 true ，
原因就在于， V instanceof target 首先会先用 target(V) 来判断，
然后再判断， target.prototype 是否在 V 的原型链上，参考 ECMAScript Language Specification

但是 bind 的柯里化作用还是有用的，

使用 call 或者 apply ，将 this 绑定为 null 或 undefined 并不会凑效，
此时， this 将绑定为全局对象。

然而，在严格模式下， this 将绑定为 null 或 undefined ，

值得一提的是，在非严格模式下， f.call(1); 会自动将 1 包装成 new Number(1) ，
然后 this 指向的是这个包装对象。

而在严格模式下， f.call(1); 会将 this 绑定为 1 。

b={} 相当于 b=new Object ，因此， b 是 Object 构造函数的实例。
而 Object.create(null) 会创建一个空对象，它没有原型。

注意， Object.create(undefined); 会报错，

赋值表达式的返回值是函数的引用，因此相当于 f() ，
而不是 obj1.f() ，也不是 obj2.f() 。

你不知道的JavaScript（上卷）