javascript 什么是bind函数?又如何封装一个bind函数呢？

小灰灰 2022-10-05 14:54 162阅读 0赞

>     function box(a, b, c, d) \{
> 
>             console.log(a, b, c, d)
> 
>             console.log(this);
> 
>             return '谷歌';
> 
>         \}
> 
>         box('1', '3', '1', '4');
> 
>         let pox = box.bind(\{ name: 'lee' \}, '9', '5', '2', '7')
> 
>         pox();

box() 打印的是1314，this指向的是window;

pox通过bind函数打印的是9527，this指向的是  \{ name: 'lee' \};

![20210609191958878.png][]

bind函数有三个特征，1，改变this的指向。2，第一个参数是this的值，后面的参数依次是函数接收的参数。3，返回值一样。

### 如何封装一个类似bind的函数呢？ ###

>       Function.prototype.myBind=function()\{
> 
>          let self = this;
> 
>           let args =\[...arguments\];       //  参数不固定，所以要用arguments来接收参数，因arguments是类数组，所以要用'...'来变成普通数组
> 
>           let val = args.shift();    //去掉数组第一个元素，并保存在val里，因为第一个元素是this  
> 
>           return function()\{               //查看bind  的用法是返回一个匿名函数  let pox = box.bind(\{ name: 'lee' \}, '9', '5', '2', '7')，所以这里也要返回一个匿名函数      
> 
>                 return self.apply(val,args);               //通过apply改变调用myBind函数的this指向，指到val值，具体查看apply用法
> 
>          \}
> 
>       \}

#  #

#  ================================================ #

#  如果你是新手想学前端可以加我， #

# **如果你是一个有基础，但学习前端没有明确的方向，可以加我** #

# **如果你刚毕业找到前端的工作，但工作上遇到问题或怕遇到问题解决不了的可以加我** #

# **一对一私人指导/教学（费用很便且）：微信：** #

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAdmVyc2lvbmxp_size_15_color_FFFFFF_t_70_g_se_x_16][]

[20210609191958878.png]: /images/20221005/99c1083d595742fb99f788326af0e9ff.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAdmVyc2lvbmxp_size_15_color_FFFFFF_t_70_g_se_x_16]: /images/20221005/15e5b64a887c4e6486b4f1155f867711.png