javascript中call,apply,callee,caller用法实例分析


Posted in Javascript onJuly 24, 2019

本文实例讲述了javascript中call,apply,callee,caller用法。分享给大家供大家参考,具体如下:

实践一:call,apply 用来让一个对象去调用本不属于自己的方法,两者都可以传递参数,call的参数是列表形式,apply的参数是数组形式

var person = {
 "name":"Tom",
 "say":function(){
 console.log("person say");
 },
 "count":function(x,y,z){
 console.log('x= ' + x + ', y= ' + y + ', z= ' + z);
 },
 "sayName":function(){
 console.log(this.name);
 }
}
// 下面的示例是数组 arr 去调用person的say方法 , 这里call用来让数组调用本不属于它自己的方法
var arr = [1,2];
person.say.call(arr);
// call 还可以传递参数
person.count.call(arr,1,2,3); // x= 1, y= 2, z= 3
// apply 还可以这样
person.count.apply(arr,[1,2,3]); // x= 1, y= 2, z= 3

实践二:call,apply 用来修改this,   同样引用上例的person对象

var program = {"name":"AlphaGo"}
person.sayName.call(program); // AlphaGo
person.sayName.apply(program); // AlphaGo

实践三:call,apply把伪数组转换为数组

// call,apply 把伪数组转换为数组
var wArr = {0:"hello",1:"world","length":2};
var arr1 = Array.prototype.slice.call(wArr);
var arr2 = Array.prototype.slice.apply(wArr);
console.log(arr1); // [hello,world]
console.log(arr2); // [hello,world]

这里找到一篇详细的  关于伪数组的文章

实践四:单纯的arguments对象

// 有关arguments
function count(a,b,c){
 console.log(arguments.length);
 if(count.length === arguments.length) {
 console.log('实际参数与形参个数相同');
 }else{
 console.log('实际参数与形参个数不同');
 }
}
count(1,2,3); // 实际参数与形参个数相同
count(1,2); // 实际参数与形参个数不同
/*
这里count.length 表示形参个数
arguments.length 表示实参个数
*/

实践五:caller 用于查看,函数本身被哪个函数调用

function fn1(){
 if(fn1.caller){
 console.log(fn1.caller.name + " 是函数fn1的调用者");
 }else{
 console.log("直接执行");
 }
}
function fn2(){
 fn1();
};
fn2(); // fn2是是函数fn1的调用者

实践六:callee 返回正被执行的 Function 对象,常用于匿名函数的递归与arguments一起配合使用。

var sum = function(n){
 if(n>0) {
 return n + arguments.callee(n-1);
 }
 return 0;
};
var total = sum(10);
console.log(total); // 55
// arguments.callee 代指函数自身。
function test(){
 console.log(arguments.callee);
}
test(); // 输出函数自身的字符串表达式

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript 构建一个xmlhttp对象池合理创建和使用xmlhttp对象
Jan 15 Javascript
『JavaScript』限制Input只能输入数字实现思路及代码
Apr 22 Javascript
JS实现切换标签页效果实例代码
Nov 01 Javascript
javascript使用for循环批量注册的事件不能正确获取索引值的解决方法
Dec 20 Javascript
Bootstrap组件(一)之菜单
May 11 Javascript
Angularjs结合Bootstrap制作的一个TODO List
Aug 18 Javascript
BootStrap栅格系统、表单样式与按钮样式源码解析
Jan 20 Javascript
折叠菜单及选择器的运用
Feb 03 Javascript
jquery实现全选、全不选以及单选功能
Mar 23 jQuery
jQuery实现下拉菜单的实例代码
Jun 19 jQuery
javascript 中事件冒泡和事件捕获机制的详解
Sep 01 Javascript
vue watch深度监听对象实现数据联动效果
Aug 16 Javascript
javascript关于“时间”的一次探索
Jul 24 #Javascript
javascript面向对象三大特征之封装实例详解
Jul 24 #Javascript
解决vue-cli webpack打包开启Gzip 报错问题
Jul 24 #Javascript
Vue  webpack 项目自动打包压缩成zip文件的方法
Jul 24 #Javascript
JavaScript面向对象中接口实现方法详解
Jul 24 #Javascript
IE11下处理Promise及Vue的单项数据流问题
Jul 24 #Javascript
微信小程序如何引用外部js,外部样式,公共页面模板
Jul 23 #Javascript
You might like
DC这些乐高系列动画电影你看过几部?
2020/04/09 欧美动漫
PHP操作MongoDB时的整数问题及对策说明
2011/05/02 PHP
destoon之一键登录设置
2014/06/21 PHP
Yii把CGridView文本框换成下拉框的方法
2014/12/03 PHP
PHP两种快速排序算法实例
2015/02/15 PHP
php+ajax实现无刷新的新闻留言系统
2020/12/21 PHP
快速保存网页中所有图片的方法
2006/06/23 Javascript
神奇的代码 通杀各种网站-可随意修改复制页面内容
2008/07/17 Javascript
IE6图片加载的一个BUG解决方法
2010/07/13 Javascript
快速查找数组中的某个元素并返回下标示例
2013/09/03 Javascript
jquery通过closest选择器修改上级元素的方法
2015/03/17 Javascript
JavaScript实现横向滑出的多级菜单效果
2015/10/09 Javascript
如何解决手机浏览器页面点击不跳转浏览器双击放大网页
2016/07/01 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
2019/05/24 Javascript
[00:37]2016完美“圣”典风云人物:AMS宣传片
2016/12/06 DOTA
用Python编写分析Python程序性能的工具的教程
2015/04/01 Python
Python数据结构与算法之链表定义与用法实例详解【单链表、循环链表】
2017/09/28 Python
Python3中编码与解码之Unicode与bytes的讲解
2019/02/28 Python
Python:type、object、class与内置类型实例
2019/12/25 Python
Python 实现自动获取种子磁力链接方式
2020/01/16 Python
python3.6连接mysql数据库及增删改查操作详解
2020/02/10 Python
pycharm新建Vue项目的方法步骤(图文)
2020/03/04 Python
Python同时迭代多个序列的方法
2020/07/28 Python
Python pip使用超时问题解决方案
2020/08/03 Python
CSS3动画和HTML5新特性详解
2020/08/31 HTML / CSS
浅析border-radius如何兼容IE
2016/04/19 HTML / CSS
预订旅游活动、景点和旅游:GetYourGuide
2019/09/29 全球购物
Kiehl’s科颜氏西班牙官方网站:源自美国的植物护肤品牌
2020/02/22 全球购物
2014年煤矿安全工作总结
2014/12/04 职场文书
检察院起诉意见书
2015/05/20 职场文书
刑事申诉状范文
2015/05/20 职场文书
党纪处分决定书
2015/06/24 职场文书
详解Nginx启动失败的几种错误处理
2021/04/01 Servers
Python基础之教你怎么在M1系统上使用pandas
2021/05/08 Python
Python代码风格与编程习惯重要吗?
2021/06/03 Python
js前端图片加载异常兜底方案
2022/06/21 Javascript