在 ECMAScript 2021 中，函数绑定是一个非常有用的特性。它允许你将一个函数固定在一个对象上，使得这个函数总是使用该对象作为其上下文。本文将详细介绍函数绑定的概念、用法，以及一些实用技巧。
什么是函数绑定？
函数绑定是一种将函数上下文或作用域修改为特定对象的技术。与常规函数调用不同，函数绑定保留了函数的原始定义环境，并绑定到指定对象上。
基本用法
-- -------------------- ---- ------- ----- --- - - ----- ------- ---- -- -- -------- ------- - ------------------- -- ---- -- ------------ --- - -- ----------- ----- ------- - ----- ---------- - ---------------- ------------- -- ------ -- ---- -- ---- --- - -- -- ----- ----
上述代码中，我们定义了一个对象 obj 和一个函数 hello。我们将 hello 函数使用 bind 方法绑定到了 obj 上，然后将其赋值给一个变量 boundHello。当我们调用 boundHello 时，它将始终使用 obj 对象作为其上下文。
绑定函数参数
我们还可以使用 bind 方法来绑定函数的参数。这在开发中非常有用，因为它允许我们在调用函数时为其传递一些常规参数，而无需改变函数本身。
function greet(name, message) {
console.log(`${name}, ${message}`);
}
const boundGreet = greet.bind(null, 'John');
boundGreet('Hello'); // John, Hello
boundGreet('Bonjour'); // John, Bonjour我们将 greet 函数使用 bind 方法绑定到对象 null 上，并且传递了一个名为 John 的参数。此时，我们得到的是 boundGreet 函数，它接受一个参数 message，并在 greet 函数中将其与 John 组合打印输出。
使用箭头函数绑定
另一种尤其流行的函数绑定技巧是使用箭头函数。因为箭头函数没有自己的上下文，它会继承其父级函数的上下文。因此，当我们将箭头函数绑定到某个对象上时，它将继承该对象的上下文。
-- -------------------- ---- -------
----- --- - -
----- -------
---- ---
--------- ---------- -
----- -- - -- -- -
------------------- -- ---- -- ------------ --- - -- ----------- ----- -------
--
-----
-
--
--------------- -- ------ -- ---- -- ---- --- - -- -- ----- ----在上述代码中，我们定义了一个对象 obj 和一个函数 sayHello。sayHello 函数内部定义了一个箭头函数 hi。当我们调用 obj.sayHello() 时，hi 函数将继承 obj 对象的上下文，因此它将始终使用 obj 作为其上下文。
结论
函数绑定是一种非常有用的技术，它允许我们将函数与指定的对象绑定在一起。这使得我们可以轻松地创建不同上下文的函数，并且可以在调用时为其传递常规参数。同时，我们还可以使用箭头函数继承其父级函数的上下文。这可以使我们编写更加简洁和易于理解的代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67764b506d66e0f9aa1df0c0