bind方法,顾名思义,就是绑定的意思,到底是怎么绑定然后怎么用呢,下面就来说说我对这个方法的理解。

语法

fun.bind(this,arg1,arg2,...)

bind()方法会创建一个新的函数,称为绑定函数,fun方法在this环境下调用

该方法可传入两个参数,第一个参数作为this,第二个及以后的参数则作为函数的参数调用

实例 

1.创建绑定函数

 1 this.a = 1;
2 var module = {
3 a : 2,
4 getA:function() {
5 return this.a;
6 }
7 };
8 module.getA();//2
9
10 var getA1 = module.getA;
11 // getA在外部调用,此时的this指向了全局对象
12 getA1();//1
13
14 // 再把getA1方法绑定到module环境上
15 var getA2 = getA1.bind(module);
16 getA2();

从上面的例子可以看出,为什么要创建绑定函数,就是当我们调用某些函数的时候是要在特定环境下才能调用到,所以我们就要把函数放在特定环境下,就是使用bind把函数绑定到特定的所需的环境下。

2.让函数拥有预设的参数

使用bind()方法使函数拥有预设的初始参数,这些参数会排在最前面,传给绑定函数的参数会跟在它们后面

 1 function list(){
2 // 让类数组arguments拥有数组的方法slice,这个函数实现了简单把类数组转换成数组
3 return Array.prototype.slice.call(arguments);
4 }
5
6 list(1,2,3);//[1,2,3]
7
8 //给list绑定一个预设参数4
9 var list1 = list.bind(undefined,4);
10
11 list1();//[4]
12
13 list1(1,2,3);//[4,1,2,3]

3.setTimeout的使用

正常情况下,调用setTimeout的时候this会指向全局对象,但是使用类的方法时我们需要指向类的实例,所以要把this,绑定要回调函数方便继续使用实例

 1 function Fun1() {
2 this.name = 1;
3 }
4 Fun1.prototype.fun2 = function() {
5 window.setTimeout(this.fun3.bind(this), 1000);
6 }
7 Fun1.prototype.fun3 = function(){
8 console.log('name:'+this.name);//name:1
9 }
10 var fun = new Fun1();
11 fun.fun2();

4.快捷方法--把类数组转换成数组

第一种方法是使用apply方法

1 function fun1() {
2 var slice = Array.prototype.slice;
3 return slice.apply(arguments);
4 }
5
6 fun1(1,2,3);//[1,2,3]

第二种方法是使用call方法和bind方法一起使用

function fun2() {
var unboundSlice = Array.prototype.slice;
// 把函数的call方法绑定在数组slice方法上,之后再给call方法传递参数
var slice = Function.prototype.call.bind(unboundSlice);
return slice(arguments);
} fun2(1,2,3);//[1,2,3]

javascript方法--bind()的更多相关文章

  1. (转)javascript方法--bind()

    地址:https://www.cnblogs.com/xxxxBW/p/4914567.html bind方法,顾名思义,就是绑定的意思,到底是怎么绑定然后怎么用呢,下面就来说说我对这个方法的理解. ...

  2. javascript中bind函数的作用

    javascript的bind的作用 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  3. 博文推荐】Javascript中bind、call、apply函数用法

    [博文推荐]Javascript中bind.call.apply函数用法 2015-03-02 09:22 菜鸟浮出水 51CTO博客 字号:T | T 最近一直在用 js 写游戏服务器,我也接触 j ...

  4. 面试官:能解释一下javascript中bind、apply和call这三个函数的用法吗

    一.前言    不知道大家还记不记得前几篇的文章:<面试官:能解释一下javascript中的this吗> 那今天这篇文章虽然是介绍javascript中bind.apply和call函数 ...

  5. jQuery基础学习5——JavaScript方法获取页面中的元素

    给网页中的所有<p>元素添加onclick事件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...

  6. Android中通过WebView控件实现与JavaScript方法相互调用的地图应用

    在Android中通过WebView控件,可以实现要加载的页面与Android方法相互调用,我们要实现WebView中的addJavascriptInterface方法,这样html才能调用andro ...

  7. 节点插入--对比jQuery和JavaScript方法(一)

    二.插入元素: 1 <div> 2 <p>面朝大海,春暖花开</p> 3 </div> (一).jQuery方法 1.在节点内部插入: 方法 说明 ap ...

  8. Nginx 错误处理方法: bind() to 0.0.0.0:80 failed

    Nginx 错误处理方法: bind() to 0.0.0.0:80 failed 今天启动window上的nginx总是报错 错误信息是bind() to 0.0.0.0:80 failed (10 ...

  9. Iframe 父子窗体互调javascript方法及相互获取控件

    父窗体中的Iframe标签如下,子窗体为Default.aspx; <iframe id="left" name="left" src="Def ...

随机推荐

  1. Highcharts配置

    一.基础使用 <script src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script> ...

  2. android stduio 引入 .so

  3. Website Speed Optimization Guide for Google PageSpeed Rules

    原链接地址:http://www.artzstudio.com/2016/07/website-speed-optimization-guide-for-google-pagespeed-rules/ ...

  4. DVB系统几种传输方式

    卫星 (DVB-S 及 DVB-S2)有线 (DVB-C)地面无线 (DVB-T)手持地面无线 (DVB-H)

  5. Some good questions

    (一)#include <stdio.h>#include <stdlib.h>void getmemory(char *p){ p=(char *) malloc(100); ...

  6. 张高兴的 Windows 10 IoT 开发笔记:HC-SR04 超声波测距模块

    HC-SR04 采用 IO 触发测距.下面介绍一下其在 Windows 10 IoT Core 环境下的用法. 项目运行在 Raspberry Pi 2/3 上,使用 C# 进行编码. 1. 准备 H ...

  7. C#中一道关于多线程的编程题

    题目的意思是这样的:让两个线程A和B将自己的ID轮番写入一个文件中,每个线程重复十次写入后执行一个回调函数,说“I'm OK”,就这样.我是一名QA,不是开发,出于兴趣报考了公司的C#课程考试,多线程 ...

  8. BZOJ 2226 【SPOJ 5971】 LCMSum

    题目链接:LCMSum 这个题显然就是要我们推式子了……那么就来推一波: \begin{aligned}&\sum_{i=1}^n lcm(i,n) \\=&\sum_{i=1}^n\ ...

  9. 安装ecb

    mac emacs上安装ecb,通过elpa折腾得要死,死活无法使用. 解决办法:下载https://github.com/alexott/ecb,添加路径,(require 'ecb),直接ok.

  10. PHPCMS 后台学习

    1.final 不能被子类改写,不可扩展2.私有不能被继承3.构造方法,第一个被调用的方法4.static访问 类名::方法名 parent::test();这里test可以不静态 m=模块名& ...