6.1 Javascript:事件与回调函数
2016-03-13 22:46
731 查看
事件
当页面要发生一些事情或做一些事情时,我们称其为事件。事件是网页自带的属性,如click、mousemove、load等。响应某个事件的函数则称为事件处理程序,或者叫做事件侦听器。
回调函数
调函数,,指一个函数A被作为参数传递给另一个函数B,回调函数A会在函数B内被调用(或执行)。回调函数的本质是一种模式,因此回调函数也被称为回调模式。在这里,函数A被称为回调函数深度理解
函数也只不过是个值,要么返回一个值,要么为空值所以把它当成一个数据来处理即可
例:
另一种声明函数的方式var showName=function(name){//函数名称即为变量名称 alert("Your name is "+name+", your number is "+outValue()); //在这里,函数主体outValue即是变量值 //采用这种表达方式时,又称为函数字面量 } //当函数主体单独出现而没有名称时,被称为函数字面量
var name=showName;
通过这句代码,可以看出,函数可以像变更般操纵
说白了,函数只是一个值引用到函数主体的变量
函数的调用与引用
调用函数:var value=outValue();//outValue()为调用一个函数(也是函数字面量)
引用函数
var value=showName;//其实,showName是指向一个函数主体的引用
事件,回调,与HTML属性
回调函数最常用于处理事件利用Html属性联结回调函数与事件
<body onload="showName();"> <img src="..." onclick="showImage()"/> </body>
onload是Html标签的属性,它的作用是把showName()函数与onload事件联结
onclick是Html标签的属性,它的作用是把showImage()函数与onclick事件联结
利用函数引用,分离Html与Javascript代码
使用函数引用设定回调函数window.onclick=showName;
onclick是window对象的属性,showName为函数引用
当onlick事件被触发后,将执行showName引用所指向的函数
这些代码完全可以在Javascript中书写代码,使得Html与Jvavascript代码分离
通过函数字面量来传递参数
使用函数字面量作为函数引用,而后从函数字面量内调用相应的回调函数function helloName(name) { //输出“Hello WeAreZero”的带参函数 alert("Hello "+name); } window.onclick=function(evt)//函数字面量function()作为函数引用指派给onclick事件 { //在这里,函数字面量function(evt)完成了对helloName()的调用 helloName("WeAreZero"); }
在这里,函数字面量是一个没有名字的函数,所以又叫匿名函数
evt参数将事件对象作为参数传递给事件入事件处理器,但在这里没有用到evt参数
总结
将事件与函数联结,并实现Html代码与Javascript代码分离,不仅利于代码直观性与维护,而且函数会使你Javascript的本领更上一层楼!相关文章推荐
- js scrollTop, 滚动条操作
- JavaScript中的对象类型详解
- JSP 的基本原理
- javascript
- vs2010中编译配置jsoncpp
- 小白级小菜鸟的js基础总结(一)——基础语法
- JavaScript去重的方法
- 学习Javascript闭包(Closure)所感
- JavaScript系列(六:DOM编程)
- 快乐的JS正则表达式(一)
- jsp函数的使用
- jsnunumber
- JS复习:第六章
- JS复习第五章
- 项目收获——JSON应用解析
- jsp的第一部分 指令(Directive)元素
- JSP自定义标签
- ExtJS中layout的12种布局风格
- AJAX实现跨域的三种种方法(代理,JSONP,XHR2)
- NoClassDefFoundError: org/json/JSONException解决方法