Javascript中的方法和匿名方法实例详解


Posted in Javascript onJune 13, 2015

本文实例讲述了Javascript中的方法和匿名方法。分享给大家供大家参考。具体分析如下:

Javascript方法(函数)

声明函数

以function开头,后跟函数名,与C#、java不同,Javascript不需要声明返回值类型、参数类型。没有返回值就是undefined。

举个例子更清楚: 
无参数无返回值的方法:

function f1(){
alert('这是一个方法');
}
f1();//调用方法

无参数有返回值的方法:

function f2(){
return 100;
}
var result=f2();//声明一个变量,接收f1()中的返回值
alert(result);//100

有参数有返回值的方法:

function f3(n1,n2){
return n1+n2;
}
var result=f3(20,30);
alert(result);//50

注意1:

先看例子:

function f1(){
  alert('这是一个方法'); 
}
alert(f1());//弹出”这是一个方法”后,还会显示undefined

原因:js中,变量没有赋值,就是undefined;该栗中f1()没有返回值,那么就是一个未知的值(undefined),这里未知的变量放入alert(),当然弹出的就是undefined

注意2:

alert(f1);//不写括号,会将f1整个代码以字符串形式显示出来:
function f1(){ 
alert('这是一个方法'); 
}

JavaScript中没有方法重载

只调用最新定义的方法:

function f1(n1,n2){ 
alert(n1+n2); 
} 
function f1(n1,n2){ 
alert(n1-n2); 
} 
f1(10,2);//8

结论:无论在哪里调用,都只调用最新定义的方法。

注意:数字+undefined=undefined

function f1(n1,n2,n3){ 
alert(n1-n2+n3); 
} 
f1(10,2);
//NaN,因为没有给n3传值,n3就是undefined,
//数字加上undefined还是undefined

以上结论:Javascript中没有方法重载

定义方法时注意:

自定义函数名不要和内置方法重名:
不要和js内置、dom内置方法重名,比如selectAll、focus等函数名不要用。

不要与系统函数重名。(在单击事件中调用自己定义的focus方法,有问题。与系统的focus()方法重名了)

书写规则括号注意:

一般在js中编写大括号都是直接跟在后面

function f1(){ 
return 
{ 
age:100}; 
} 
var s=f1(); 
alert(s.age);
//undefined。s结果是undefined,undefined.age必然还是undefined

匿名方法(用的非常多)

为什么推荐用匿名方法?

1、有一个1.js中有个方法function aa(){alert{'我挺帅了'}}

2、有一个2.js中有个方法function aa(){alert{'我越来越帅了'}}

3、将1.js和2.js依次导入到index.html中,调用aa();结果显示:我越来越帅了。

结论:2.js中的aa()方法会覆盖1.js中的aa()

怎么办?不再指定方法名,使用匿名方法

先看一个将匿名方法赋给变量例子:

var ff=function(n1,n2){ 
return n1+n2; 
}; 
alert(ff(20,30));//50

一行写完匿名方法:

(function (n1,n2){alert(n1+n2);})(9,9);

小案例:1:

var x=1; 
var y=0; 
var z=0; 
var add=function (n){n=n+1;return n}; 
y=add(x);//结果是2,先调用上面add 
add=function(n){n=n+3;return n;}; 
z=add(x);//结果是4,调用上面临近的这个add 
alert(y+','+z);//2,4

小案例2:

function aa() 
{ 
  alert("aaa"); 
  return function(){alert("bbb");}; 
} 
alert(aa);//不写括号,会将aa方法的整个代码显示出来 
alert(aa());//aaa,function(){alert("bbb");}; aaa就不解释了,后面那一串是作为aa()的返回值显示 
alert(aa()());//aaa,bbb,undefined 
//下面分解上面这句进行解释 
var s=aa();//aaa 
alert(s());//s()就是function(){alert("bbb");};首先弹出bbb,其次该方法没有返回值,故弹出undefined

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

Javascript 相关文章推荐
IE中jquery.form中ajax提交没反应解决方法分享
Sep 11 Javascript
javascript实现tabs选项卡切换效果(扩展版)
Mar 19 Javascript
JS对话框_JS模态对话框showModalDialog用法总结
Jan 11 Javascript
JavaScript 实现完美兼容多浏览器的复制功能代码
Apr 28 Javascript
js实现的简练高效拖拽功能示例
Dec 21 Javascript
深入理解AngularJS中的ng-bind-html指令
Mar 27 Javascript
详解Vue中过度动画效果应用
May 25 Javascript
angular.js中解决跨域问题的三种方式
Jul 12 Javascript
javascript中new Array()和var arr=[]用法区别
Dec 01 Javascript
浅谈vue父子组件怎么传值
Jul 21 Javascript
判断iOS、Android以及PC端的示例代码
Nov 15 Javascript
Vue+Node服务器查询Mongo数据库及页面数据传递操作实例分析
Dec 20 Javascript
jquery实现简单的自动播放幻灯片效果
Jun 13 #Javascript
jquery实现简单手风琴菜单效果实例
Jun 13 #Javascript
jQuery实现的五子棋游戏实例
Jun 13 #Javascript
JavaScript合并两个数组并去除重复项的方法
Jun 13 #Javascript
JQuery自动触发事件的方法
Jun 13 #Javascript
JQuery中DOM实现事件移除的方法
Jun 13 #Javascript
JQuery中DOM事件冒泡实例分析
Jun 13 #Javascript
You might like
PHP小程序自动提交到自助友情连接
2009/11/24 PHP
PHP 文件编程综合案例-文件上传的实现
2013/07/03 PHP
跟我学Laravel之安装Laravel
2014/10/15 PHP
js getBoundingClientRect() 来获取页面元素的位置
2010/11/25 Javascript
JavaScript高级程序设计 XML、Ajax 学习笔记
2011/09/10 Javascript
jquery JSON的解析方式示例介绍
2014/07/27 Javascript
简述Matlab中size()函数的用法
2016/03/20 Javascript
BootStrap网页中代码显示用法详解
2016/10/21 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
2017/02/13 Javascript
Vuejs仿网易云音乐实现听歌及搜索功能
2017/03/30 Javascript
JS时间控制实现动态效果的实例讲解
2017/07/31 Javascript
vue使用keep-alive实现数据缓存不刷新
2017/10/21 Javascript
解决option标签selected="selected"属性失效的问题
2017/11/06 Javascript
实现div内部滚动条滚动到底部和顶部的代码
2017/11/15 Javascript
js canvas实现橡皮擦效果
2018/12/20 Javascript
Node.js JSON模块用法实例分析
2019/01/04 Javascript
js校验开始时间和结束时间
2020/05/26 Javascript
原生js实现照片墙效果
2020/10/13 Javascript
用Python编写web API的教程
2015/04/30 Python
python dataframe astype 字段类型转换方法
2018/04/11 Python
Python基于opencv的图像压缩算法实例分析
2018/05/03 Python
Python实现简单石头剪刀布游戏
2021/01/20 Python
Python通过for循环理解迭代器和生成器实例详解
2019/02/16 Python
python3常用的数据清洗方法(小结)
2019/10/31 Python
Pytorch生成随机数Tensor的方法汇总
2020/09/09 Python
使用jTopo给Html5 Canva中绘制的元素添加鼠标事件
2014/05/15 HTML / CSS
Lacoste美国官网:经典POLO衫品牌
2016/10/12 全球购物
幼儿园亲子活动方案
2014/01/29 职场文书
运动会入场式解说词
2014/02/18 职场文书
森马旗舰店双十一营销方案
2014/09/29 职场文书
汇报材料怎么写
2014/12/30 职场文书
办公室文员岗位职责
2015/02/04 职场文书
幼儿园园务工作总结2015
2015/05/18 职场文书
2019年聘任书的写作格式及范文!
2019/07/03 职场文书
Anaconda安装pytorch和paddle的方法步骤
2022/04/03 Python
spring IOC容器的Bean管理XML自动装配过程
2022/05/30 Java/Android