javascript匿名函数实例分析


Posted in Javascript onNovember 18, 2014

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

摘要:

本文讲解的是javascript最基础也是最重要的东西--函数,之所以写这篇文章,是因为面试的时候问到了,也算是温故而知新了。

先上个例子,如果你看懂了,说明你已经理解了本文要讲的。

var f = (function() {
    function f() {return 10;}
    return f();
    function f() {return 20;}
    var f = 30;
})();
console.log(f);

javascript高级程序设计中这样描述函数--可以封装任意多条语句,而且可以在任何地方、任何时候调用执行。之前介绍过了strict mode,严格模式对函数有一些限制:

① 不能把函数命名为eval或arguments
② 不能把参数命名为eval或arguments
③ 不能出现两个命名参数同名的情况

发生以上情况就会导致语法错误,代码无法执行。

函数定义

函数定义分为三种

1、构造函数

var fun = new Funciton();

2、普通定义

function fun() {}

3、函数式定义

var fun = function() {};

这三种方式都可以定义函数fun。

参数

函数不介意传递进来多少个参数,也不在乎传进来的参数是什么数据类型。即便你定义的函数只接收两个参数,在调用这个函数时也未必一定要传递两个参数。可以传递一个、三个甚至不传递参数。原因是参数在内部是用一个数组来表示的。在函数体内可以通过arguments对象来访问参数数组,举个例子

function sayHi() {
    alert("Hello " + arguments[0] + "," + arguments[1]);
}

通过访问arguments对象的length属性来获知有多少个参数。函数的length会返回函数的参数个数。

注意:所有参数传递的都是值,不可能通过引用传递参数。

函数不能重载,只能重写

如果定义了两个名字相同的函数,则该名字只属于最后定义的函数,举个例子:

function add(num) {
    return num + 100;
}
function add(num) {
    return num + 200;
}
var result = add(100) //300

注意:函数在执行完return语句之后停止并立即退出。

函数种类

函数分为两种一种是有名函数,另一种是匿名函数。例如下面的有名函数

function fun() {
}

如果调用的话,只需要fun()就可以。

匿名函数,顾名思义就是没有函数名。例如

function() {}

函数调用是通过函数名来调用,匿名函数怎么调用呢?一种就是将匿名函数赋给一个变量,让这个变量充当函数名。另一种就是用()来调用,例如下面三种方法

1、(function() {return;}());

2、(function() {return;})();

3、function() {return;}();

例子:

(function(x, y) {
    ​alert(x + y);
})(2,3);
//alert(5)

2和3将会作为参数传递给x和y

下面就来讲讲最上面的例子,这个例子里面涉及到闭包,后面会说

首先定义一个变量f,然后赋值一个匿名函数,这里呢需要注意一点函数里所有变量的定义都会被前置,所以匿名函数里的执行顺序是

var f = (function() {
    ​var f = 30;
    function f() {return 10;}
    function f() {return 20;}
    return f();
})();

外面的变量f和里面的变量f不在同一个作用域内(闭包),所以互不影响。​因为函数不能重载,所以外面变量f=(function f() {return 20;})();,所以最终输出的是20。

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

Javascript 相关文章推荐
TBCompressor js代码压缩
Jan 05 Javascript
jquery实现商品拖动选择效果代码(自写)
May 28 Javascript
js特效,页面下雪的小例子
Jun 17 Javascript
基于angular2 的 http服务封装的实例代码
Jun 29 Javascript
node通过express搭建自己的服务器
Sep 30 Javascript
详解Vue中localstorage和sessionstorage的使用
Dec 22 Javascript
vue系列之requireJs中引入vue-router的方法
Jul 18 Javascript
JS使用Date对象实时显示当前系统时间简单示例
Aug 23 Javascript
小程序红包雨的实现示例
Feb 19 Javascript
构建Vue大型应用的10个最佳实践(小结)
Nov 07 Javascript
VUE实时监听元素距离顶部高度的操作
Jul 29 Javascript
vue 获取到数据但却渲染不到页面上的解决方法
Nov 19 Vue.js
Linux下使用jq友好的打印JSON技巧分享
Nov 18 #Javascript
删除Javascript Object中间的key
Nov 18 #Javascript
如何在MVC应用程序中使用Jquery
Nov 17 #Javascript
Jquery实现仿腾讯微博发表广播
Nov 17 #Javascript
JavaScript数组常用操作技巧汇总
Nov 17 #Javascript
jquery 实现返回顶部功能
Nov 17 #Javascript
超棒的响应式布局jQuery插件Freetile.js
Nov 17 #Javascript
You might like
模仿OSO的论坛(二)
2006/10/09 PHP
PHP UTF8中文字符截断函数代码
2012/09/11 PHP
Smarty中的注释和截断功能介绍
2015/04/09 PHP
JS应用之禁止抓屏、复制、打印
2008/02/21 Javascript
Node.js项目中调用JavaScript的EJS模板库的方法
2016/03/11 Javascript
Vuejs第十二篇之动态组件全面解析
2016/09/09 Javascript
javascript 动态脚本添加的简单方法
2016/10/11 Javascript
js模块加载方式浅析
2017/08/12 Javascript
Node.js+jade+mongodb+mongoose实现爬虫分离入库与生成静态文件的方法
2017/09/20 Javascript
vue.js $refs和$emit 父子组件交互的方法
2017/12/20 Javascript
深入理解react-router 路由的实现原理
2018/09/26 Javascript
解决vue-cli webpack打包开启Gzip 报错问题
2019/07/24 Javascript
[02:32]“虐狗”镜头慎点 2016国际邀请赛中国区预选赛现场玩家采访
2016/06/28 DOTA
python WindowsError的错误代码详解
2017/07/23 Python
Pandas统计重复的列里面的值方法
2019/01/30 Python
浅谈Python中的可迭代对象、迭代器、For循环工作机制、生成器
2019/03/11 Python
Python配置文件处理的方法教程
2019/08/29 Python
详解使用Python下载文件的几种方法
2019/10/13 Python
sklearn和keras的数据切分与交叉验证的实例详解
2020/06/19 Python
Python爬虫爬取有道实现翻译功能
2020/11/27 Python
selenium+headless chrome爬虫的实现示例
2021/01/08 Python
html5指南-5.使用web storage存储键值对的数据
2013/01/07 HTML / CSS
Html5+JS实现手机摇一摇功能
2015/04/24 HTML / CSS
.NET面试问题集
2015/12/08 面试题
办公室文秘岗位职责
2013/11/15 职场文书
销售副总经理岗位职责
2013/12/11 职场文书
国际商务专业职业生涯规划书范文
2014/01/17 职场文书
运动会通讯稿300字
2014/02/02 职场文书
公务员转正鉴定材料
2014/02/11 职场文书
大学竞选班长演讲稿
2014/04/24 职场文书
低碳日宣传活动总结
2014/07/09 职场文书
2015年社区环境卫生工作总结
2015/04/21 职场文书
2015年农村党员公开承诺事项
2015/04/28 职场文书
小学少先队活动总结
2015/05/08 职场文书
2016教师党员学习心得体会
2016/01/21 职场文书
Python 内置函数速查表一览
2021/06/02 Python