Javascript中bind()方法的使用与实现
对于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()方法的使用与实现的更多相关文章
- 博文推荐】Javascript中bind、call、apply函数用法
[博文推荐]Javascript中bind.call.apply函数用法 2015-03-02 09:22 菜鸟浮出水 51CTO博客 字号:T | T 最近一直在用 js 写游戏服务器,我也接触 j ...
- 面试官:能解释一下javascript中bind、apply和call这三个函数的用法吗
一.前言 不知道大家还记不记得前几篇的文章:<面试官:能解释一下javascript中的this吗> 那今天这篇文章虽然是介绍javascript中bind.apply和call函数 ...
- 【转载】JS中bind方法与函数柯里化
原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...
- JavaScript中reduce()方法
原文 http://aotu.io/notes/2016/04/15/2016-04-14-js-reduce/ JavaScript中reduce()方法不完全指南 reduce() 方法接收 ...
- JavaScript中的方法、方法引用和参数
首先,我们来看一段代码,如果觉得不甚明白的,则本文会对你有益: var player = function (e) { return (function f(m) { ...
- 详解 JavaScript 中 splice() 方法
splice() 方法是一个比较少用的方法,但是功能确实很好,并且在我们 coding 的时候,经常有需要 splice() 方法,先介绍一下该方法. 在 JavaScript 中 splice() ...
- JavaScript中的方法
JavaScript中的方法 在JavaScript中,可以通过对象来调用对应的方法.在JavaScript中,有三个重要的window对象方法:用于显示警告信息的alert.用于显示确认信息的con ...
- JavaScript中Array方法总览
title: JavaScript中Array方法总览 toc: true date: 2018-10-13 12:48:14 push(x) 将x添加到数组最后,可添加多个值,返回数组长度.改变原数 ...
- javascript中concat方法深入理解
最近在恶补js知识的时候,总是会因为js强大的语法而感到震撼.因为以前对前端方面的疏忽,导致了一些理解的错误.因此痛改前非,下定决心,不管做什么事情,都要有专研的精神. 在介绍前,抛出一个问题:如何将 ...
随机推荐
- tomcat web容器中,调用jersey client端报错的处理
在web工程中,写main方法,运行ok. 发布到tomcat中后,报错. javax.ws.rs.core.UriBuilder.uri(Ljava/lang/String;)Ljavax/ws/r ...
- HDOJ/HDU 1256 画8(绞下思维~水题)
Problem Description 谁画8画的好,画的快,今后就发的快,学业发达,事业发达,祝大家发,发,发. Input 输入的第一行为一个整数N,表示后面有N组数据. 每组数据中有一个字符和一 ...
- 传输层之TCP
---恢复内容开始--- 坞无尘水槛清,相思迢递隔重城. 秋阴不散霜飞晚,留得枯荷听雨声. --李商隐 上一篇中我们了解了socket编程是基于TCP或者UDP,所以我们有必要对TCP,和UDP ...
- .Net 调式案例—实验4 高CPU(High CPU)回顾
原文地址:http://blog.csdn.net/directionofear/article/details/8033506 如果Web应用程序经常遇到的问题按频率排名的话,我觉得 第一名unha ...
- SSL 通信及 java keystore 工具介绍
http://www.javacodegeeks.com/2014/07/java-keystore-tutorial.html Table Of Contents 1. Introduction 2 ...
- hdoj 1054 Strategic Game【匈牙利算法+最小顶点覆盖】
Strategic Game Time Limit: 20000/10000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) ...
- The server does not support version 3.1 of the JEE Web module specification.
使用MyEclipse2015打开MyEclipse2014编辑的项目,在服务器Tomcat 7部署时,提示"The server does not support version 3.1 ...
- linux 创建连接命令 ln -s 软连接
这是linux中一个非常重要命令,请大家一定要熟悉.它的功能是为某一个文件在另外一个位置建立一个同不的链接,这个命令最常用的参数是-s, 具体用法是:ln -s 源文件 目标文件. 当 我们需要在不同 ...
- Intent是什么?
一.理解Intent: 在一个Android应用中,主要是由四种组件组成的,这四种组件可参考“Android应用的构成”.而这四种组件是独立的,它们之间可以互相调用,协调工作,最终组成一个真正的And ...
- MySql中having字句对组记录进行筛选使用说明
having字句可以让我们筛选成组后的各种数据 having的用法 having字句可以让我们筛选成组后的各种数据,where字句在聚合前先筛选记录,也就是说作用在group by和having字句前 ...