javascript中 Function.prototype.apply()与Function.prototype.call() 对比详解

Function.prototype.apply()|Function.prototype.call()

apply()方法可以在使用一个指定的 this 值和一个参数数组(或类数组对象)的前提下调用某个函数或方法。call()方法类似于apply(),不同之处仅仅是call()接受的参数是参数列表。
简而言之:
apply()一个this,一个参数
call()   一个this,多个参数
语法

fun.apply(thisArg[, argsArray])|fun.call(thisArg[, arg1[, arg2[, ...]]])

参数

apply():
thisArg:在fun函数运行时指定的this值。需要注意的是,指定的this值并不一定是该函数执行时真正的this值,如果这个函数处于非严格模式下,则指定为null和undefined的this值会自动指向全局对象(浏览器中就是window对象),同时值为原始值(数字,字符串,布尔值)的this会指向该原始值的自动包装对象。
argsArray:数组(或类数组对象)
call():
thisArg:同apply()的参数描述。
arg1[,arg2[,arg3[……]]]:参数列表

本文原创博客地址:http://www.cnblogs.com/unofficial官网地址: www.pushself.com

DEMO

//apply()的demo
function SiteInfo(name,site) {
	this.name = name;
	this.site = site;
}
function ContactMe(name,site,qq) {
	//SiteInfo.apply(this, {0:name, 1:site, length:2});
	//SiteInfo.apply(this, [name, site]);
	SiteInfo.apply(this, arguments);
	this.qq = qq;
}
var contactMe = new ContactMe("unofficial","www.pushself.com","1936**3***");
console.log("你好,我是"+contactMe.name+",欢迎访问"+contactMe.site+",有问题可以留言,也可以通过QQ:"+contactMe.qq+"及时联系到我");

这里是apply()的应用,其中主要注意的是argsArray这个参数,它可以是数组,也可以是类数组对象。
arguments对象是所有方法中提供的一个局部变量;不能在方法的原型属性中使用。需要特别说明的是arguments不是一个数组,只是一个类数组。

//call()的demo
function SiteInfo(name,site) {
	this.name = name;
	this.site = site;
}
function ContactMe(name,site,qq) {
	SiteInfo.call(this, name, site);
	this.qq = qq;
}
var contactMe = new ContactMe("unofficial","www.pushself.com","1936**3***");
console.log("你好,我是"+contactMe.name+",欢迎访问"+contactMe.site+",有问题可以留言,也可以通过QQ:"+contactMe.qq+"及时联系到我");

这里是call()的应用,其中需要注意的是第二个参数是由很多的参数构成的一个列表。
本文原创博客地址:http://www.cnblogs.com/unofficial 官网地址: www.pushself.com

扩展DEMO

可以用apply()求数组中最大值,例如,我要求一个数组var arr = [19,360,0,3000];

var arr = [19,360,0,3000],
    maxVal = Math.max.apply(null, arr),
    minVal = Math.min.apply(null, arr);
console.log("arr中最大值为:"+maxVal+",最小值为:"+minVal);

这个是利用apply()求数组中的最大值,通常我们利用Math.max()求的是一个列表的最大值,例如:Math.max(19,360,0,3000),得到最大值为3000,如果这个是一个数组或者一个数组对象,我们怎么求得它的最大值呢?就是利用apply()来解决,Math.max.apply(null, arr)相当于this对象就是Math.max,将arr经过apply()后处理成了列表,最后求得最大值,或者最小值。
本文原创博客地址:http://www.cnblogs.com/unofficial 官网地址: www.pushself.com

参考资料

mozilla开发者社区:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
mozilla开发者社区:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments

本文原创博客地址:http://www.cnblogs.com/unofficial 官网地址:
www.pushself.com

时间: 2024-10-16 15:36:33

javascript中 Function.prototype.apply()与Function.prototype.call() 对比详解的相关文章

JavaScript中的*top、*left、*width、*Height详解

来源:http://www.ido321.com/911.html html代码 1: <body> 2: <div class="father" id="father"> 3: <h3>这是父元素,屏幕分辨率是1366*768</h3> 4: <div class="son" id="son"> 5: <h3>这是子元素,祝大家国庆快乐 </h3&

javascript 中几种实用的跨域方法原理详解(转)

原文:http://blog.csdn.net/primary_wind/article/details/40062985 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被当作是不同的域. 下表给出了相对http://store.company.com/dir/page.html同源检测的结果: 要解决跨域的问题,我们可以使用以下几种方法: 一.

javascript中的立即执行函数(function(){…})()

javascript中的立即执行函数(function(){…})() 深入理解javascript中的立即执行函数,立即执行函数也叫立即调用函数,通常它的写法是用(function(){…})()包住业务代码,使用jquery时比较常见. ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因并非如此.要

面试官:能解释一下javascript中bind、apply和call这三个函数的用法吗

一.前言    不知道大家还记不记得前几篇的文章:<面试官:能解释一下javascript中的this吗> 那今天这篇文章虽然是介绍javascript中bind.apply和call函数,但是多少也和this有点关联. 假如在前面那场面试末尾,面试官不依不饶继续问你javascript中的this,那看完本篇文章后一定还会有收获. (本篇文章不会站在this的角度去回答问题,而是重于解释bind.apply和call这三个函数的用法和使用场景) 二.正戏开始 面试官:能解释一下javascr

javascript中call和apply方法

转:http://www.cnblogs.com/ArthurPatten/p/3335912.html 我们可以将call和apply看做是某个对象的方法,通过调用方法的形式来间接调用函数.call和apply的第一个实参是要调用函数的母对象,它是调用上下文,在函数体内通过this来获得对它的引用. 例如,如果要想以对象o的方法来调用函数f,可以按如下的方式使用call和apply方法: f.call(o); f.apply(o); 可以按如下的代码来理解: o.m = f; //将f存储为o

凡尘:关于Apply、call、bind的详解

call方法: 语法:call(thisObj,'',''........) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 说明:call方法可以用来代替另一个对象调用一个方法.call方法可将一个函数的对象上下文初始的上下文改变为由thisObj指定的新对象,如果没有提供thisObj参数,那么global对象被用做thisObj apply方法: 语法:apply(thisObj,['','',''....]) 定义:应用某一个对象的方法,用另一个对象替换当前对象 如果argArr

javascript 用函数语句和表达式定义函数的区别详解

通常我们会看到以下两种定义函数的方式: // 函数语句 function fn(str) { console.log(str); }; // 表达式定义 var fnx=function(str) { console.log(str+ ' from fnx'); }; 两种方式都创建了新的函数对象, 但函数声明语句的函数名是一个变量名, 变量指向函数对象, 和通过var声明变量一样,函数定义语句中的函数被显示地提前到了脚本或函数的顶部, 因此它们在整个脚本和函数内都是可见的,但是使用var 表达

ios中创建可以拖动的view原理和实现详解

有时候我们会需要在界面上拖动view;uiview是继承于uiresponder的,所以可以响应触摸相关的事件. 重点是以下一组方法: - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event - (void)touchesEnded:(NSSet *)touches withEvent:(UIE

ios中创建可以拖动的view原理和实现详解(含代码)

有时候我们会需要在界面上拖动view;uiview是继承于uiresponder的,所以可以响应触摸相关的事件. 重点是以下一组方法: - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event - (void)touchesEnded:(NSSet *)touches withEvent:(UIE

IOS中复制对象的用法及深拷贝和浅拷贝详解

亲爱的网友,我这里有套课程想和大家分享,如果对这个课程有兴趣的,可以加我的QQ2059055336和我联系. 课程内容简介 我们软件是基于移动设备的.所以我们必然的选择了安卓作为我们的开发工具.课程中,我们将简要的介绍Android的基本概念,然后进行我们的实战开发.在开发中,大家讲学习到基本的组件,适配UI,数据的存储,多线程下载,开机广播,闹钟提醒,短信发送等实际项目开发中碰到的有用的知识点.通过课程学习,让大家能够掌握Android软件开发的流程,注意点,及优化.帮助大家迅速的掌握Andr