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()的详解使用:的更多相关文章

  1. JS中的call、apply、bind方法详解

    bind 是返回对应函数,便于稍后调用:apply .call 则是立即调用 . apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(co ...

  2. c/c++ 标准库 bind 函数 详解

    标准库 bind 函数 详解 bind函数:接收一个函数名作为参数,生成一个新的函数. auto newCallable = bind(callbale, arg_list); arg_list中的参 ...

  3. 汇总apply()、call()、bind()用法详解

    先看明白下面: 例 1 obj.objAge; // 17 obj.myFun() // 小张年龄 undefined 例 2 shows() // 盲僧 比较一下这两者 this 的差别,第一个打印 ...

  4. JavaScript 中 apply 、call 的详解

    apply 和 call 的区别 ECMAScript 规范给所有函数都定义了 call 与 apply 两个方法,它们的应用非常广泛,它们的作用也是一模一样,只是传参的形式有区别而已. 原文作者:林 ...

  5. [荐]Js apply()和call()方法详解 - http://www.w3cfuns.com/article-5596443-1-1.html

    本帖最后由 默默DE人生 于 2013-3-19 13:22 编辑 Js apply方法详解我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文 ...

  6. 【巷子】:关于Apply、call、bind的详解

    call方法: 语法:call(thisObj,'',''........) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 说明:call方法可以用来代替另一个对象调用一个方法.call方法 ...

  7. 《Javascript高级程序设计》读书笔记之bind函数详解

    为什么需要bind var name = "The Window"; var object = { name: "My Object", getNameFunc ...

  8. javascript 中的apply()和call()方法详解

    1.语法 先来看看JS手册中对call的解释: call 方法 调用一个对象的一个方法,以另一个对象替换当前对象. call([thisObj[,arg1[, arg2[, [,.argN]]]]]) ...

  9. bind函数详解(转)

    var name = "The Window"; var object = { name: "My Object", getNameFunc: function ...

随机推荐

  1. 隐藏div,文本框角圆滑,消除外边框

    #div_1 /*将div设置完成,并且隐藏,当需要的时候对其属性值进行修改*/ { height: 36px; width: 1099px; background-color: #F0DFDF; m ...

  2. NodeJS学习笔记 进阶 (13)Nodejs进阶:5分钟入门非对称加密用法

    个人总结:读完这篇文章需要5分钟,这篇文章讲解了Node.js非对称加密算法的实现. 摘录自网络 地址: https://github.com/chyingp/nodejs-learning-guid ...

  3. [POI2010]GIL-Guilds(结论题)

    题意 给一张无向图,要求你用黑白灰给点染色,且满足对于任意一个黑点,至少有一个白点和他相邻:对于任意一个白点,至少有一个黑点与他相邻,对于任意一个灰点,至少同时有一个黑点和白点和灰点与他相邻,问能否成 ...

  4. php后端控制可跨域的域名,允许图片跨域上传

    跨域问题经常需要面对,前端需要做的比较直接要么选择ajax异步提交,XML或者jsonp,要么表单提交前端常见跨域解决方案 jsonp基本可以搞定大部分跨域问题,但问题也比较明显,只能通过get方式提 ...

  5. 二叉树、B树、B+树、B*树、LSM树

      HBase 对于数据产品,底层存储架构直接决定了数据库的特性和使用场景.RDBMS(关系型数据库)使用 B树 及 B+树 作为数据存储结构. HBase 使用 LSM树. .     二叉树    ...

  6. apache kafka监控系列-KafkaOffsetMonitor

    apache kafka中国社区QQ群:162272557 概览 近期kafka server消息服务上线了,基于jmx指标參数也写到zabbix中了.但总认为缺少点什么东西.可视化可操作的界面. z ...

  7. How to search Installed Updates

    Windows本身的控制面板中自带的搜索,无法根据补丁编号进行搜索 可以将补丁信息导出到文本,再用文本编辑器进行查找 https://www.concurrency.com/blog/w/search ...

  8. assert 的理解

    assert 可以实现如下功能: 保证参数之间的大小等约束关系: 函数执行过程中得到的中间结果是否符合预期: def gen_batch(batch_size, skip_window, num_sk ...

  9. 让透明div里的文字不透明

    最近在工作中遇到一个问题,我在div里写上文字,当我把div变为半透明的时候,里面的文字也会随之透明.情况如下: <div class="box"> 这是一段不应该透明 ...

  10. 动态调用web服务 --WSHelper.cs

    using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Net;us ...