JavaScript 无侵入式 bind 函数实现与动态作用域绑定

作者:代码拾荒

时间:2026-10-24

浏览:109

本文介绍一种不扩展原生对象的 JavaScript bind 函数实现方案。通过保存原函数引用并利用 apply 方法,该方法允许指定新的作用域(context)并预设部分参数。代码展示了如何合并预置参数与调用时传入的参数,从而实现灵活的作用域绑定与参数偏应用。

文章目录

无侵入式 bind 函数设计思路

关于动态 this 与动态绑定的具体结论,可参考《javascript下动态this与动态绑定实例代码》。本文重点在于设计一个不侵入原生对象的绑定函数。


  

[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]


遵循不扩展原生对象的原则,实现了此 bind 函数(此处 dom 作为作用域)。其用法与 Prototype 框架中的 bind 方法类似。


代码如下:

 
bind 函数核心代码实现dom.bind = function(fn,context){
// 第二个参数若偏好,可命名为 thisObject 或 scope,
// 其本质均为指定一个新的作用域对象。
if (arguments.length < 2 && context===undefined) return fn;
var method = fn,
slice = Array.prototype.slice,
args = slice.call(arguments, 2) ;
return function(){// 此处传入原 fn 所需的参数
var array = slice.call(arguments, 0);
method.apply(context,args.concat(array))
} 

函数用法与参数说明

使用示例:第一个参数指定需绑定作用域的函数,第二个参数指定 window 或其他对象,后续参数为任意预设值。



[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]


另一个应用示例:


  

[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章