javascript中函数作为参数调用的方法


Posted in Javascript onFebruary 09, 2015

本文实例讲述了javascript中函数作为参数调用的方法。分享给大家供大家参考。具体分析如下:

先来看示例:

function Map(){
var obj = {};

this.put = function(key, value){
obj[key] = value;
}

this.eachMap = function(fn){
for(var attr in obj){
fn(attr, obj[attr]);
}
}

}
var m = new Map();
m.put('01', 'abc');
m.put('02', 1024);
m.put('03', true);
m.put('04', 0);
m.put('05', false);

m.eachMap(function(key, value){
alert(key + " : " + value);
});

这段代码执行的顺序是:从上往下顺序解释执行,这是JS的规定。
这里主要说明一下m.eachMap()中函数做为参数是怎么传递并执行的:

step1:执行到m.eachMap这个方法的时候,JS会去找对应的this.eachMap这个方法;
step2:找到this.eachMap这个方法,会根据函数体内的语句顺序执行;
step3:当执行到fn(attr, obj[attr]);的时候,他会返回到for语句执行;注意在返回for语句执行之前,attr是没有值的;从for语句返回之后,attr的值就有了,为‘01',而obj[attr]的值也有了,为‘abc';
step4:接着,fn(attr, obj[attr]);会返回到m.eachMap这个方法的参数函数中,即

function(key, value){
alert(key + " : " + value);
}

attr替换key,obj[attr]替换value,并执行alert语句,输出。

step5:继续执行for循环,重复执行step4,并输出,直到结束。

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

Javascript 相关文章推荐
用脚本调用样式的几种方法
Dec 09 Javascript
再谈javascript面向对象编程
Mar 18 Javascript
javascript返回顶部效果(自写代码)
Jan 06 Javascript
JavaScript作用域链使用介绍
Aug 29 Javascript
JavaScript实现简单的二级导航菜单实例
Apr 15 Javascript
JavaScript仿flash遮罩动画效果
Jun 15 Javascript
Jquery Easyui选项卡组件Tab使用详解(10)
Dec 18 Javascript
老生常谈angularjs中的$state.go
Apr 24 Javascript
Vue 路由 过渡动效 数据获取方法
Jul 31 Javascript
微信小程序实现笑脸评分功能
Nov 03 Javascript
详解vuex的简单todolist例子
Jul 14 Javascript
element-ui table组件如何使用render属性的实现
Nov 04 Javascript
javascript自动生成包含数字与字符的随机字符串
Feb 09 #Javascript
angularJS 中$scope方法使用指南
Feb 09 #Javascript
Javascript动态创建div的方法
Feb 09 #Javascript
angularJS 中$attrs方法使用指南
Feb 09 #Javascript
JavaScript实现获取dom中class的方法
Feb 09 #Javascript
angularJS 中input示例分享
Feb 09 #Javascript
angularJS提交表单(form)
Feb 09 #Javascript
You might like
phpMyAdmin出现无法载入 mcrypt 扩展,请检查PHP配置的解决方法
2012/03/26 PHP
phpMyAdmin自动登录和取消自动登录的配置方法
2014/05/12 PHP
PHP实现显示照片exif信息的方法
2014/07/11 PHP
php类中的$this,static,final,const,self这几个关键字使用方法
2015/12/14 PHP
PHP数组基本用法与知识点总结
2020/06/02 PHP
javascript通过class来获取元素实现代码
2013/02/20 Javascript
JavaScript限定复选框的选择个数示例代码
2013/08/25 Javascript
js控制网页背景音乐播放与停止的方法
2015/02/06 Javascript
百度UEditor编辑器如何关闭抓取远程图片功能
2015/03/03 Javascript
js控制文本框只输入数字和小数点的方法
2015/03/10 Javascript
js操作数组函数实例小结
2015/12/10 Javascript
详解Angularjs filter过滤器
2016/02/06 Javascript
JS控制div跳转到指定的位置的几种解决方案总结
2016/11/05 Javascript
js实现倒计时关键代码
2017/05/05 Javascript
Vuejs 单文件组件实例详解
2018/02/09 Javascript
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
2018/09/12 Javascript
详解Vue中的watch和computed
2020/11/09 Javascript
[59:08]DOTA2上海特级锦标赛C组小组赛#2 LGD VS Newbee第一局
2016/02/27 DOTA
[52:12]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
[04:15]DOTA2-DPC中国联赛 正赛 Ehome vs Aster 选手采访
2021/03/11 DOTA
Python文件操作类操作实例详解
2014/07/11 Python
举例详解Python中yield生成器的用法
2015/08/05 Python
django站点管理详解
2017/12/12 Python
Tensorflow之构建自己的图片数据集TFrecords的方法
2018/02/07 Python
Python开发的十个小贴士和技巧及长常犯错误
2018/09/27 Python
Python如何使用PIL Image制作GIF图片
2020/05/16 Python
Python使用内置函数setattr设置对象的属性值
2020/10/16 Python
CSS3实现歌词进度文字颜色填充变化动态效果的思路详解
2020/06/02 HTML / CSS
什么是Connection-oriented Protocol/Connectionless Protocol面向连接的协议/无连接协议
2012/09/06 面试题
桥梁工程专业求职信
2014/04/21 职场文书
会计专业毕业生求职信
2014/07/04 职场文书
高校教师个人总结
2015/02/10 职场文书
公司开业主持词
2015/07/02 职场文书
感恩主题班会教案
2015/08/12 职场文书
十大必看国产动漫排名,魁拔上线,第二曾在日本播出
2022/03/18 国漫
JS setTimeout与setInterval的区别
2022/04/20 Javascript