对于bind,我愣了下,这个方法常用在jquery中,用于为被选元素添加一个或多个事件处理程序。

查了下手册,发现bind的作用和apply,call类似都是改变函数的execute context,也就是return时this关键字的指向。但是使用方法略有不同。一个函数进行bind后可稍后执行。

var altwrite = document.write;
altwrite("hello");

上面的程序运行,会报错:Uncaught TypeError: Illegal invocation  非法调用

报错的原因就是this指向问题,因为altwrite指向的是windowd对象,而write指向的是document对象

我们可以通过bind()修改altwrite的上下文,把它指向document,就可以了,修改如下:

var altwrite = document.write;
altwrite.bind(document)("hello");

当然也可以使用call()方法:

altwrite.call(document, "hello")

绑定函数

bind()最简单的用法是创建一个函数,使这个函数不论怎么调用都有同样的this值。

将方法从对象中拿出来,然后调用,并且希望this指向原来的对象。如果不做特殊处理,一般会丢失原来的对象。使用bind()方法能够很漂亮的解决这个问题:

;
var mymodule = {
  num: ,
  getNum: function() { return this.num; }
};

module.getNum(); 

var getNum = module.getNum;
getNum(); // 9, 因为在这个例子中,"this"指向全局对象

// 创建一个'this'绑定到module的函数
var boundGetNum = getNum.bind(module);
boundGetNum(); 

和setTimeout一起使用

一般情况下setTimeout()的this指向window或global对象。当使用类的方法时需要this指向类实例,就可以使用bind()将this绑定到回调函数来管理实例。

function Bloomer() {
  ) + ;
}

// 1秒后调用declare函数
Bloomer.prototype.bloom = function() {
  window.setTimeout();
};

Bloomer.prototype.declare = function() {
  console.log('我有 ' + this.petalCount + ' 朵花瓣!');
};

注意:对于事件处理函数和setInterval方法也可以使用上面的方法

Javascript中bind()方法的使用与实现的更多相关文章

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

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

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

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

  3. 【转载】JS中bind方法与函数柯里化

    原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...

  4. JavaScript中reduce()方法

    原文  http://aotu.io/notes/2016/04/15/2016-04-14-js-reduce/   JavaScript中reduce()方法不完全指南 reduce() 方法接收 ...

  5. JavaScript中的方法、方法引用和参数

    首先,我们来看一段代码,如果觉得不甚明白的,则本文会对你有益: var player = function (e) {             return (function f(m) {      ...

  6. 详解 JavaScript 中 splice() 方法

    splice() 方法是一个比较少用的方法,但是功能确实很好,并且在我们 coding 的时候,经常有需要 splice() 方法,先介绍一下该方法. 在 JavaScript 中 splice() ...

  7. JavaScript中的方法

    JavaScript中的方法 在JavaScript中,可以通过对象来调用对应的方法.在JavaScript中,有三个重要的window对象方法:用于显示警告信息的alert.用于显示确认信息的con ...

  8. JavaScript中Array方法总览

    title: JavaScript中Array方法总览 toc: true date: 2018-10-13 12:48:14 push(x) 将x添加到数组最后,可添加多个值,返回数组长度.改变原数 ...

  9. javascript中concat方法深入理解

    最近在恶补js知识的时候,总是会因为js强大的语法而感到震撼.因为以前对前端方面的疏忽,导致了一些理解的错误.因此痛改前非,下定决心,不管做什么事情,都要有专研的精神. 在介绍前,抛出一个问题:如何将 ...

随机推荐

  1. bzoj 3226 [Sdoi2008]校门外的区间(线段树)

    3226: [Sdoi2008]校门外的区间 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 615  Solved: 227[Submit][Stat ...

  2. 基于CodeBlocks上的wxWidgets开发环境配置

    本文摘自http://www.cnzui.com/?p=962 在原文的基础上根据自己的实践做了一些修改 我的IDE为C::B 12.11,wxWidgets版本为wxWidgets-2.8.12 在 ...

  3. 转载:在Ubuntu系统下装Win7并引导双系统

    转载自http://blog.sina.com.cn/s/blog_9f6451990101blef.html 本人的系统原先是就单ubuntu系统,而且是未分区情况下自动安装的,现在又装了个wind ...

  4. [Yii][RBAC]Yii中应用RBAC完全指南

    开端筹办 Yii供给了强大的设备机制和很多现成的类库.在Yii中应用RBAC是很简单的,完全不须要再写RBAC代码.所以筹办工作就是,打开编辑器,跟我来. 设置参数.建树数据库 在设备数组中,增长以下 ...

  5. CentOS搭建GIT服务器【一】-仓库搭建以及基于gitosis的SSH方式访问

    1.安装GIT核心 yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel perl-devel gcc g ...

  6. Duff in Love - 588B(素数的判断)

    题目大意:如果一个数的所有因子都不是别的数的平方,那么这个数就是lovely数,现在给定一个数,求出这个数所有因子里面最大的lovely数 分析:很有意思的一道题,如果把这个数因子分解成最基本的苏因子 ...

  7. MFC发送自定义消息-PostMessage和SendMessage

    PostMessage:把消息投放到线程的消息队列,不能消息被处理就立即返回SendMessage:消息被处理完后才返回 几种发送消息的写法:   ::PostMessage(GetSafeHwnd( ...

  8. CSS+JS下拉菜单和纯CSS下拉菜单

    下拉菜单 (思路:先把二级定位到屏幕外,鼠标悬停重新定位回来:另一个就是ul浮动,li也浮动) 下拉菜单的一般思路就是把子导航嵌套在无序列表中,把列表定位到屏幕之外,当鼠标悬停在其父列表项上时,重新定 ...

  9. wxPython中添加窗口标题图标

    这种添加方法可以避免要将应用程序和图标放在同一个目录,可以实现从模块中读取图标 #用于从module中读取ico,避免了要在程序所在路径附上此ico exeName = win32api.GetMod ...

  10. 查看数据库中有哪些活动的事务,对应的会话id,执行的语句

    select dbt.database_id, DB_NAME(dbt.database_id) '数据库名', dbt.transaction_id, at.name, at.transaction ...