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 ...
随机推荐
- iOS开发——国际化支持Localizable.strings
这篇写的不多,但是绝对诚意满满.不会像别人一样,要不不详细,要不罗里吧嗦一堆. 1.创建Localizable.strings文件 Command+N—>iOS—>Resource—> ...
- const 和 pointer
一般的: const对pointer的修饰有两种: const type * p/type const * p:表示指针指向的变量的值不能改变,无论指针改变为指向哪一个变量 type * const ...
- Java Web Application——servlet
概述 是一个部署于web服务器中的实现了servlet接口的Java类,用于响应web请求 Web容器(也称为servlet容器)本质上是与servlet交互的Web服务器的组件.Web容器负责管理s ...
- ssh 免交互式登陆
脚本: vim key.sh #!/bin/bash#make key\rm -f /root/.ssh/id_dsassh-keygen -t dsa -f /root/.ssh/id_dsa -P ...
- 中断函数中不能使用printf的原因
vxworks 中断处理程序之所以不用printf,本质在于printf是将信息输出到标准输出设备(STDOUT)中, 整个标准输出设备是一个全局变量,由于有semTake操作,那么就会发生阻塞,vx ...
- 题解 P1179 【数字统计】
嚯嚯嚯,这道题很显然是削弱版的51nod P1042. 那么显然我们需要使用数位DP解题. 思路大致是这样的: 对于每一个数字,考虑三种影响关系: 1. 它对低位的影响 2. 它对高位的影响 3. 高 ...
- 二 MapReduce 各阶段流程分析
如果想要将问题变得清晰.精准和优雅, 需要关注 MapReduce 作业所需要的系统资源,尤其是集群内部网络资源使用情况. MR 可以运行在共享集群上处理 TB 级 甚至 PB 级的数据.同时,改作业 ...
- Lesson 2 Building your first web page: Part 1
In this ‘hands-on’ module we will be building our first web page in no time. We just need to quickly ...
- 104.virtual虚函数多态与异构数据结构
#include "mainwindow.h" #include <QApplication> #include <list> #include <Q ...
- 【转】Android应用底部导航栏(选项卡)实例
现在很多android的应用都采用底部导航栏的功能,这样可以使得用户在使用过程中随意切换不同的页面,现在我采用TabHost组件来自定义一个底部的导航栏的功能. 我们先看下该demo实例的框架图: 其 ...