JS中call和apply
作用:
替换当前对象的方法中的this。
理解:
call和apply是为了动态改变this出现的,当一个object没有某个方法,但是其他的有,我们可以借助call或apply用其它对象的方法来操作。
用的比较多的,通过document.getElementsByTagName选择的dom 节点是一种类似array的array。
它不能应用Array下的push,pop等方法。我们可以通过:
var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));
这样domNodes就可以应用Array下的所有方法了。
语法:
call([thisObj[,arg1[, arg2[, [,.argN]]]]]) ##没提供thisObj , Global 对象将被用作 thisObj。参数用逗号分隔。
apply([thisObj [,argArray]]) ##没提供 thisObj , Global 对象将被用作 thisObj。参数为一个数组,与call的主要区别就在参数形式上,这样如果参数个数确定可以用call,如果参数个数不确定就用apply。
技巧:
1.把arguments转为数组
function args2arr() {
return [ ].slice.call(arguments, 0);
//return Array.prototype.slice.call(arguments, 0); //和上边的写法效果相同
}
args2arr(1, 2, 3, 5, 6, 7, 8); //[1, 2, 3, 5, 6, 7, 8]
2.返回数组中的最大值
function argsMax() {
// 找出对象 arguments 当中数字最大的值
return Math.max.apply(null,arguments);
}
argsMax(1, 2, 3, 5, 6, 7, 8) //
Math.max([number1[, number2[. . . [,numberN]]]]) : 返回给出的零个或多个数值表达式中较大者。
max本身接收用逗号分隔的参数,通过apply方法传入数组形式的参数,第一个参数给了一个null,这个是因为没有对象去调用这个方法,我只需要用这个方法帮我运算,得到返回的结果就行,.所以直接传递了一个null过去。
3.合并两个数组
var arr1=new Array("1","2","3");
var arr2=new Array("4","5","6");
Array.prototype.push.apply(arr1,arr2);
arrayObj.push([item1 [item2[. . . [itemN ]]]]) : 将新元素添加到一个数组中,并返回数组的新长度值。
这里arr1作为劫持Array的push方法的对象,把arr2当做参数传入。
例子:
1.借用函数
function getName() {
return this.name
}
var obj = {name: "jack"};
getName.call(obj) //jack,js 中的函数其实是对象,函数名是对 Function 对象的引用。
2.借用对象方法
var obj1 = {
name: "panxuepeng",
getName: function() {return this.name}
}
var obj2 = {name: "jack"};
obj1.getName.call(obj2) //jack
3.稍复杂的对象
//构造函数,对应的对象就是Animal.
function Animal(){
this.name = "Animal";
this.showName = function(){
alert(this.name);
}
} function Cat(){
this.name = "Cat";
} var animal = new Animal();
var cat = new Cat(); animal.showName.call(cat); //Cat,调用对象中的方法必须先实例化类
/*
*调用Animal对象的方法showName必须先实例化Animal类,如果只是调用属性
*可以直接Animal.property就行
*所以上边的写成Animal.showName.call会报错
*/
//animal.showName.apply(cat,[]);
4.继承
function Animal(name){
this.name = name;
this.showName = function(){
alert(this.name);
}
}
function Cat(name){
Animal.call(this, name);
}
var cat = new Cat("Black Cat");
cat.showName(); //Black Cat
JS中call和apply的更多相关文章
- js中call和apply的实现原理
js中call和apply的实现原理 实现call的思路: /* 还有就是call方法是放在Function().prototype上的也就是构造函数才有的call方法 (我门可 ...
- JS中 call() 与apply 方法
1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call ...
- 区别和详解:js中call()和apply()的用法
1.关于call()和apply()的疑点: apply和call的区别在哪里 什么情况下用apply,什么情况下用call apply的其他巧妙用法(一般在什么情况下可以使用apply) 2.语法和 ...
- JS中call、apply的用法说明
JS Call()与Apply()的区别 ECMAScript规范给所有函数都定义了Call()与apply()两个方法,call与apply的第一个参数都是需要调用的函数对象,在函数体内这个参数就是 ...
- js中call、apply、bind那些事
前言 回想起之前的一些面试,几乎每次都会问到一个js中关于call.apply.bind的问题,比如- 怎么利用call.apply来求一个数组中最大或者最小值 如何利用call.apply来做继承 ...
- js中call、apply和bind的区别
在JS中,这三者都是用来改变函数的this对象的指向的,他们有什么样的区别呢.在说区别之前还是先总结一下三者的相似之处:1.都是用来改变函数的this对象的指向的.2.第一个参数都是this要指向的对 ...
- js中的call,apply,bind区别
在JavaScript中,call.apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向. call.apply.bind方法的共同点和区别:app ...
- JS中call和apply区别有哪些 记录
一.call和apply区别 传递参数的方式.用法上不同,主要是参数不完全同 (1).B.Function.call(A,arg,arg) 这个例子是讲A对象“调用”B对象的Function(某个具体 ...
- JS 中 call 和 apply 的理解和使用
本文受到了知乎问题 如何理解和熟练运用js中的call及apply? 的启发. obj.call(thisObj, arg1, arg2, ...); obj.apply(thisObj, [arg1 ...
随机推荐
- 【BZOJ 1492】【NOI 2007】货币兑换Cash
这是道CDQ分治的例题: $O(n^2)$的DP: f [1]←S* Rate[1] / (A[1] * Rate[1] + B[1]) Ans←SFor i ← 2 to n For j ←1 to ...
- 172C
模拟 #include<iostream> #include<algorithm> #include<vector> #include<cstdio> ...
- Freemarker list标签,list数据判断使用
<#if listSecMDIF?exists && (listSecMDIF?size>0)> <ul style="float: left;mar ...
- oracle 11g 新特性UTL_TCP、UTL_HTTP 和 UTL_SMTP程序包发邮件
首先,创建一个 ACL: begindbms_network_acl_admin.create_acl (acl => 'utlpkg.xml', ---创建的访问控制列 ...
- Invalid initial heap size: -Xms
-Xxs512m注意 Xxs 和 512m中间无空格就行了.
- Stream篇
本文转自: http://www.cnblogs.com/JimmyZheng/archive/2012/03/17/2402814.html 什么是Stream? 什么是字节序列? Stream的构 ...
- codevs 1063 合并果子//优先队列
1063 合并果子 2004年NOIP全国联赛普及组 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 钻石 题目描述 Description 在一个果园里,多多已经将所有的果 ...
- 第三次作业——K米评测
第一部分 调研,评测 1.第一次上手体验 其实让我下载一个APP并且长期使用它是一件特别难的事情,不仅是因为占空间,需要注册个人信息,绑定账号,更是因为每款软件的功能虽然都很齐全,但是你并在没有真正用 ...
- HTML5系列四(特征检测、Modernizr.js的相关介绍)
Modernizr:一个HTML5特征检测库 Modernizr帮助我们检测浏览器是否实现了某个特征,如果实现了那么开发人员就可以充分利用这个特征做一些工作 Modernizr是自动运行的,无须调用诸 ...
- web前端开发修炼之道--编写高质量代码
想想自己的页面实现是否糟糕 Web标准--结构.样式和行为的分离 Web标准可分为三个部分:结构标准.样式标准.行为标准. 结构标准包括XML标准.XHTML标准.HTML标准 样式标准主要是指的CS ...