JS 中的.bind是什么-Toy模板网

这篇具有很好参考价值的文章主要介绍了JS 中的.bind是什么。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

.bind 是 JavaScript 中的一个内置方法，可以将一个函数绑定到一个指定的对象上，从而改变该函数内部 this 的指向。.bind 方法的语法如下

function.bind(thisArg[, arg1[, arg2[, ...]]])

其中，thisArg 是需要绑定的指定对象，arg1、arg2 等是可选的参数列表，指定了调用函数时所传递的参数。

例如，假设有一个对象 obj：

let obj = {
  x: 10,
  getX: function() {
    return this.x;
  }
}

getX 函数内部的 this 应该是指向 obj 这个对象，但是如果我们直接调用 getX 函数，它的 this 值将指向全局对象：

let getX = obj.getX;
console.log(getX()); // 输出 undefined

为了解决 getX 函数内部的 this 指向问题，可以使用 .bind 方法将 getX 函数绑定到 obj 上：

let getX = obj.getX.bind(obj);
console.log(getX()); // 输出 10

现在，getX 函数内部的 this 将始终指向 obj，不管从哪里调用该函数。

在使用 .bind 方法时，可以传递一些额外的参数，这些参数会作为第二个参数开始传递给原函数：

function add(a, b) {
  return a + b + this.c;
}

let obj = {c: 10};
let addC = add.bind(obj, 5, 10);
console.log(addC()); // 输出 25

在上面的例子中，.bind 方法将 add 函数绑定到 obj 上，并且在调用 add 函数时，它会自动将 5 和 10 作为第一个和第二个参数传递给原函数。最终返回了 5 + 10 + 10 = 25。

需要注意的是，.bind 方法返回的是一个新的函数实例，它与原函数实例是不同的，且在调用时具有新的 this 值和预定义的参数。同时，通过 .bind 绑定的函数内部 this 值也比较难以更改，因为它一旦绑定了某个对象，就会一直保持在该对象上。

.bind 方法可以将函数绑定到指定的对象上，从而改变函数内部的 this 值的指向。它还可以作为一个通用的“函数工厂”，并生成一个新的函数实例，它具有预定义的参数和 this 值。

再比如这个例子

const obj = {
  x: 10,
  getX: function(y) {
    return this.x + y;
  }
};
const newX = obj.getX.bind({ x: 20 }, 5);
console.log(newX()); // 输出 25

在这个例子中，我们创建了一个新的函数 newX，它使用 obj.getX 函数并将其绑定到一个新的对象上（具有 x 值为 20）。我们还将 5 作为该函数的第二个参数传递。最终，我们通过调用 newX 函数来检索 obj 中的 x 值，并将其与传递给它的 5 相加。

可以在以下应用程序中使用 .bind 方法：

再次提醒，.bind 返回的是一个新的函数。新函数的函数名与原函数保持一致，但是函数身份和实现不同。此外，绑定函数难以通过普通的方式来创建函数的上下文，因为它与绑定时的上下文相关联。文章来源地址https://www.toymoban.com/news/detail-455957.html

到了这里，关于JS 中的.bind是什么的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

JS 中的.bind是什么