Call、Apply和Bind
首先说一下bind,灵活的通过bind来改变this指针
bind方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入bind方法的第一个参数作为this,
传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数.
首先bind是Function下的函数
var pp = { name: 'wk', show: function () { console.log(this.name) } };
如果给按钮绑定事件
这样写的话就有问题,因为show里面的this是button对象,将返回''
document.getElementById('btn').addEventListener("click", pp.show);
document.getElementById('btn').onclick = pp.show;
document.getElementById('btn').addEventListener("click", function () {
pp.show();
});
document.getElementById('btn').addEventListener("click", pp.show.bind(pp));
function people() {
this.name = 'wk';
this.salary = 6000;
}
people.prototype.addSalary = function (address) {
if (address) {
console.log(address);
}
window.setTimeout((function () {
var newsalary = this.salary + 1000;
console.log('原工资为:' + this.salary + ',过了一秒后,工资为:' + newsalary);
}).bind(this), 1000);
}
var p1 = new people();
p1.addSalary();
p1.addSalary.call(p1, '北京');
var ordata = { age: 12 };
function showdata() {
console.log(this.age);
}
//showdata(); undefined ×
showdata.bind(ordata)();//12 √
var arr = [1, 4, 67, 23];
console.log(arr.slice(2, 4)); //[67,23]
我们把这个方法提起出来
var getSlice = Array.prototype.slice;
现在要执行getSlice这方法getSlice(),需要this
console.log(getSlice.call(arr, 2, 4));
console.log(getSlice.apply(arr, [2, 4]));
console.log(getSlice.bind(arr, 2, 4)());//都是一样的
apply和call以及bind都是Function.prototype下的
Call、Apply和Bind的更多相关文章
- JS核心系列:浅谈 call apply 与 bind
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...
- Javascript中call,apply,bind方法的详解与总结
在 javascript之 this 关键字详解 文章中,谈及了如下内容,做一个简单的回顾: 1.this对象的涵义就是指向当前对象中的属性和方法. 2.this指向的可变性.当在全局作用域时,thi ...
- JS中call、apply、bind使用指南,带部分原理。
为什么需要这些?主要是因为this,来看看this干的好事. box.onclick = function(){ function fn(){ alert(this); } fn();}; 我们原本以 ...
- Javascript中call、apply、bind函数
javascript在函数创建的时候除了自己定义的参数外还会自动新增this和arguments两个参数 javascript中函数也是对象,call.apply.bind函数就是函数中的三个函数,这 ...
- 图解call、apply、bind的异同及各种实战应用演示
一.图解call.apply.bind的异同 JavaScript中函数可以通过3种方法改变自己的this指向,它们是call.apply.bind.它们3个非常相似,但是也有区别.下面表格可以很直观 ...
- js里function的apply vs. bind vs. call
js里除了直接调用obj.func()之外,还提供了另外3种调用方式:apply.bind.call,都在function的原型里.这3种方法的异同在stackoverflow的这个答案里说的最清楚, ...
- JS之apply,call,bind区别
为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法.整理笔记的过程也是一个再次学习的过程. apply和call js中的调用apply和call方法可以改变某个 ...
- JavaScript中call、apply、bind、slice的使用
1.参考资料 http://www.cnblogs.com/coco1s/p/4833199.html 2.归结如下 apply . call .bind 三者都是用来改变函数的this对象的指向 ...
- JS中的控制函数调用:call(),apply()和bind()
所有的函数都具有call(),apply()和bind()方法.它们可以在执行方法的时候用一个值指向this,并改变面向对象的作用域. apply方法: 以下的两种表达式是等价的: func(arg1 ...
- JS中的call、apply、bind方法
JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]] ...
随机推荐
- Intel X86 CPU 系列的寻址方式
Intel X86 CPU 系列的寻址方式 数据总线和地址总线要尽量相同,这个是一个地址就是一个指针.
- 线程TLAB区域的深入剖析
(1) 堆是JVM中所有线程共享的,因此在其上进行对象内存的分配均需要进行加锁,这也导致了new对象的开销是比较大的 (2) Sun Hotspot JVM为了提升对象内存分配的效率,对于所创建的线程 ...
- gvim 窗口最大化启动
此文来源于vimer的程序世界 首先需要 gvimfullscreen.dll 文件 下载gvimfullscreen.dll 下载源码 之后只需要在vimrc中配置如下代码就可以按F11使Vim全 ...
- 15、USB摄像头图片采集+QT显示
一.Qt的下载和的安装 关于Qt的安装,网络上有很详细的介绍.这里只做简单介绍. 需要的安装包一共有两个:Qt Creator 和QTE. 1)QT Creator 下载地址:qt-sdk-linux ...
- js中退出语句break,continue和return 比较 (转)
在 break,continue和return 三个关键字中, break,continue是一起的,return 是函数返回语句,但是返回的同时也将函数停止 首先:break和continue两个一 ...
- Linux上制作Window启动盘
Linux上制作Window启动盘 注意: U盘在Linux中的标签(依具体情况而定:执行df查看) U盘 ----- /dev/sdb4 格式化U盘 建立U盘的启动分区 安装关键工具 ms-sys ...
- OpenCV从入门到放弃(五):像素!
一.概念 1.图像本质上面是由数值组成的矩阵.矩阵中的一个元素相应一个像素. 2.对于灰度图像(黑白图像),像素是8位无符号数(CV_8U).0表示黑色,255表示白色.对于彩色图像,是用三原色数据合 ...
- 《今天你买到票了吗?——从铁道部12306.cn站点漫谈电子商务站点的“海量事务快速处理”系统》
<今天你买到票了吗?--从铁道部12306.cn站点漫谈电子商务站点的"海量事务快速处理"系统> 首发地址: http://bbs.hpx-party.org/thre ...
- angular表单经验分享
原文 https://www.jianshu.com/p/af359bd04f32 大纲 1.表单的名字不可以和传入的值的名字相同 2.在模板驱动表单的时候要使用angular表单的验证功能,需要将n ...
- 【Nutch2.2.1基础教程之3】Nutch2.2.1配置文件 分类: H3_NUTCH 2014-08-18 16:33 1376人阅读 评论(0) 收藏
nutch-site.xml 在nutch2.2.1中,有两份配置文件:nutch-default.xml与nutch-site.xml. 其中前者是nutch自带的默认属性,一般情况下不要修改. 如 ...