call(),apply()和bind()的详解使用:
obj.call(thisObj, arg1, arg2, ...);
obj.apply(thisObj, [arg1, arg2, ...]);
两者作用一致,都是把obj(即this)绑定到thisObj,这时候thisObj具备了obj的属性和方法。或者说thisObj『继承』了obj的属性和方法。绑定后会立即执行函数。
两者的不同之处:传递参数不同,call已正常参数传递,apply传参数的形式是以数组的形式传递。
bind():把obj绑定到thisObj,这时候thisObj具备了obj的属性和方法。与call和apply不同的是,bind绑定后不会立即执行。obj.bind(thisObj, arg1, arg2, ...);bind()只是起到绑定作用并不执行,只有执行才会触发obj.bind(thisObj, arg1, arg2, ...)();
function add(a,b) {
this.num1 = a;
this.num2 = b;
return num1 + num2;
}
function sub(a,b) {
this.num1 = a;
this.num2 = b;
return num1 - num2;
}
console.log( add(3,5) );//
console.log( sub(5,3) );//
console.log( sub.call(add,5,3) );//把sub()的方法绑定到add()方法上。实现了sub()方法。
console.log( sub.apply(add,[5,3]) );//
console.log( add.call(sub,5,3) );//
console.log( add.apply(sub,[5,3]) );//
在对象中的使用:
var person = {
sex: "boy",
action: function() {
console.log( this.sex+" good good study,day day up!" );
//return this.sex+" good good study,day day up!";
}
}
console.log(person.action);//f() {}
var p1 = person.action;
p1();//undefined good good study,day day up!
p1.call(person);//boy good good study,day day up!
p1.apply(person);//boy good good study,day day up!
//使用call(),apply();被调用的对象的方法能够访问对象的属性,赋给调用者。同样可以传递参数。
var person1 = {
sex: "boy",
action: function(a,b) {
console.log( this.sex+" good good study,day day up!"+"age: "+a+"job: "+b );
//return this.sex+" good good study,day day up!";
}
}
console.log(person1.action);//f() {}
var p1 = person1.action;
p1(23,"IT");//undefined good good study,day day up!age: 23job: IT
p1.call(person1,23,"IT");//boy good good study,day day up!age: 23job: IT
p1.apply(person1,[23,"IT"]);//boy good good study,day day up!age: 23job: IT
利用call()或者apply()方法可对对象等使用其他数据类型的方法;(可以理解为把谁的方法添加到调用的对象上)
var a = {
a: 1,
b: "assassin",
c: 2
}
//console.log(a.slice());//TypeError a.slice is not a function
console.log( Array.prototype.slice.call(a) );//[]
可以扩展到自己的方法中:
var animate = {
name: "animate",
fnAn: function() {
console.log("animate...");
}
}
var pp = {};
animate.fnAn.call(pp);//speak...
animate.fnAn.call(pp);//speaking
通过call和apply,我们可以实现对象继承。
function People() {
this.age = 23;
this.name = "assassin";
}
var people = {};
console.log( People);//ƒ People() {//...}
console.log( people );//{}
//People.call(people);
People.apply(people);
console.log(people);//{age: 23, name: "assassin"}
//同样可以传递参数:
function People1(age,name) {
this.age = age;
this.name = name;
}
var people1 = {};
console.log( People1);//ƒ People(age,name) {//...}
console.log( people1 );//{}
//People.call(people,23,"assassin");
People1.apply(people1,[23,"assassin"]);
console.log(people1);//{age: 23, name: "assassin"}
bind();方法使用详解
function fn1(a,b) {
console.log( a*b );
}
function fn2(a,b) {
console.log( a/b );
}
fn1(6,3);//
fn1.bind(fn2,6,3);//并没有执行
fn1.bind(fn2,6,3)();//
call(),apply()和bind()的详解使用:的更多相关文章
- JS中的call、apply、bind方法详解
bind 是返回对应函数,便于稍后调用:apply .call 则是立即调用 . apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(co ...
- c/c++ 标准库 bind 函数 详解
标准库 bind 函数 详解 bind函数:接收一个函数名作为参数,生成一个新的函数. auto newCallable = bind(callbale, arg_list); arg_list中的参 ...
- 汇总apply()、call()、bind()用法详解
先看明白下面: 例 1 obj.objAge; // 17 obj.myFun() // 小张年龄 undefined 例 2 shows() // 盲僧 比较一下这两者 this 的差别,第一个打印 ...
- JavaScript 中 apply 、call 的详解
apply 和 call 的区别 ECMAScript 规范给所有函数都定义了 call 与 apply 两个方法,它们的应用非常广泛,它们的作用也是一模一样,只是传参的形式有区别而已. 原文作者:林 ...
- [荐]Js apply()和call()方法详解 - http://www.w3cfuns.com/article-5596443-1-1.html
本帖最后由 默默DE人生 于 2013-3-19 13:22 编辑 Js apply方法详解我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文 ...
- 【巷子】:关于Apply、call、bind的详解
call方法: 语法:call(thisObj,'',''........) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 说明:call方法可以用来代替另一个对象调用一个方法.call方法 ...
- 《Javascript高级程序设计》读书笔记之bind函数详解
为什么需要bind var name = "The Window"; var object = { name: "My Object", getNameFunc ...
- javascript 中的apply()和call()方法详解
1.语法 先来看看JS手册中对call的解释: call 方法 调用一个对象的一个方法,以另一个对象替换当前对象. call([thisObj[,arg1[, arg2[, [,.argN]]]]]) ...
- bind函数详解(转)
var name = "The Window"; var object = { name: "My Object", getNameFunc: function ...
随机推荐
- 运维派 企业面试题3 为上题中的 "十个随机字母_test.html" 文件 更名
Linux运维必会的实战编程笔试题(19题) 企业面试题3 #将试题2中创建的文件名uopiyhgawe_test.html# test-->修改为omg,html-->HTML 方法一: ...
- bzoj1025 [SCOI2009]游戏 动态规划
题目描述 对于一些长度为n的排列,将其作为一个置换,那么可能有一个自置换的次数使其回到1,2,3,...,n的情况.求对于所有能够回到1,2,3..,n的排列,不同的次数共有多少种. 题解来自黄学长 ...
- 通过浏览器地址进行 post get 请求
首先安装curl 1.post chcp 65001 title 接口测试脚本 d: cd D:\curl\ curl -l -X POST -d "params" url ech ...
- windows下用winscp的root连接ubuntu“拒绝访问”的解决方法
转载:https://www.cnblogs.com/weizhxa/p/10098640.html 解决: 1.修改ssh配置文件:sudo vim etc/ssh/sshd_config 在#Pe ...
- (转载)详细图解mongodb下载、安装、配置与使用
记得在管理员模式下运行CMD,否则服务将启动失败 转载:http://blog.csdn.net/boby16/article/details/51221474 详细图解,记录 win7 64 安装m ...
- python web开发 框架 模板 MVC
我是跟着廖雪峰老师学习的,对于我这样的纯小白来说,跟着他的网站学习,简直是被妈妈抱在怀里一样无忧无虑,这样的学习本来没有记录下来的必要,但是由于我的粗心大意,经常会出现一些错误,所以我决定把这些错误记 ...
- HDU 4398 Template Library Management (最优页面调度算法)
中等偏易题.操作系统理论中的最优页面调度算法,贪心.当需要淘汰某个模版时,淘汰掉当前手中在最远的将来才会被用到(或者以后永远不再用到)的那个. 代码: #include <iostream> ...
- 05001_Linux简介
1.Linux的概述 (1)Linux是基于Unix的开源免费的操作系统,由于系统的稳定性和安全性几乎成为程序代码运行的最佳系统环境.Linux是由Linus Torvalds(林纳斯•托瓦兹)起初开 ...
- 一个最不可思议的MySQL死锁分析
1 死锁问题背景 1 1.1 一个不可思议的死锁 1 1.1.1 初步分析 3 1.2 如何阅读死锁日志 3 2 死锁原因深入剖析 4 2. ...
- HTML学习----------DAY1 第三节
本章通过实例向您演示最常用的 HTML 标签. 提示:不要担心本章中您还没有学过的例子,您将在下面的章节中学到它们. 提示:学习 HTML 最好的方式就是边学边做实验.我们为您准备了很好的 HTML ...