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 相关文章推荐
JavaScript 用Node.js写Shell脚本[译]
Sep 20 Javascript
有关于eclipse配置spket需要注意的一些地方
Apr 07 Javascript
关于jQuery中.attr()和.prop()的问题探讨
Sep 06 Javascript
JavaScript判断访问的来源是手机还是电脑,用的哪种浏览器
Dec 12 Javascript
javascript创建数组之联合数组的使用方法示例
Dec 26 Javascript
javascript数组去重方法终极总结
Jun 05 Javascript
JS 排序输出实现table行号自增前端动态生成的tr
Aug 13 Javascript
Javascript实现获取及设置光标位置的方法
Jul 21 Javascript
JS写谷歌浏览器chrome的外挂实例
Jan 11 Javascript
React如何解决fetch跨域请求时session失效问题
Nov 02 Javascript
微信小程序webSocket的使用方法
Feb 20 Javascript
JavaScript创建表格的方法
Apr 13 Javascript
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
php设计模式 Facade(外观模式)
2011/06/26 PHP
php数组函数序列之end() - 移动数组内部指针到最后一个元素,并返回该元素的值
2011/10/31 PHP
基于PHP读取csv文件内容的详解
2013/06/18 PHP
Thinkphp实现MySQL读写分离操作示例
2014/06/25 PHP
php保存任意网络图片到服务器的方法
2015/04/14 PHP
深入理解Yii2.0乐观锁与悲观锁的原理与使用
2017/07/26 PHP
js checkbox(复选框) 使用集锦
2009/04/28 Javascript
获取URL地址中的文件名和参数的javascript代码
2009/09/02 Javascript
javascript 面向对象编程 聊聊对象的事
2009/09/17 Javascript
jquery实现的鼠标下拉滚动置顶效果
2014/07/24 Javascript
javascript制作坦克大战全纪录(2)
2014/11/27 Javascript
通过设置CSS中的position属性来固定层的位置
2015/12/14 Javascript
DeviceOne 让你一见钟情的App快速开发平台
2016/02/17 Javascript
Jquery揭秘系列:ajax原生js实现详解(推荐)
2016/06/08 Javascript
js 获取当前web应用的上下文路径实现方法
2016/08/19 Javascript
Asp.Net之JS生成分页条的方法
2016/11/23 Javascript
微信小程序图片选择区域裁剪实现方法
2017/12/02 Javascript
vue中的计算属性的使用和vue实例的方法示例
2017/12/04 Javascript
vue webpack打包优化操作技巧
2018/02/22 Javascript
用element的upload组件实现多图片上传和压缩的示例代码
2019/02/12 Javascript
原生JS实现逼真的图片3D旋转效果详解
2019/02/16 Javascript
layui table 列宽百分比显示的实现方法
2019/09/28 Javascript
vue使用swiper实现左右滑动切换图片
2020/10/16 Javascript
在react项目中使用antd的form组件,动态设置input框的值
2020/10/24 Javascript
Python yield 小结和实例
2014/04/25 Python
python中的sort方法使用详解
2014/07/25 Python
Python3.6安装及引入Requests库的实现方法
2018/01/24 Python
对python中 math模块下 atan 和 atan2的区别详解
2020/01/17 Python
python打包多类型文件的操作方法
2020/09/21 Python
通过css3的filter滤镜改变png图片的颜色的示例代码
2020/05/06 HTML / CSS
企业管理毕业生求职信范文
2014/03/07 职场文书
男女朋友协议书
2014/04/23 职场文书
安全生产月活动总结
2014/05/04 职场文书
处级干部考察材料
2014/12/24 职场文书
2016年公共机构节能宣传周活动总结
2016/04/05 职场文书
vue @ ~ 相对路径 路径别名设置方式
2022/06/05 Vue.js