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 相关文章推荐
Jquery 组合form元素为json格式,asp.net反序列化
Jul 09 Javascript
js showModalDialog参数的使用详解
Jan 07 Javascript
文本框水印提示效果的简单实现代码
Feb 22 Javascript
JavaScript两种跨域技术全面介绍
Apr 16 Javascript
JavaScript性能优化总结之加载与执行
Aug 11 Javascript
js表单元素checked、radio被选中的几种方法(详解)
Aug 22 Javascript
各式各样的导航条效果css3结合jquery代码实现
Sep 17 Javascript
基于jQuery实现选项卡效果
Jan 04 Javascript
jQuery pjax 应用简单示例
Sep 20 jQuery
webpack.DefinePlugin与cross-env区别详解
Feb 23 Javascript
JavaScript中的this/call/apply/bind的使用及区别
Mar 06 Javascript
JavaScript展开运算符和剩余运算符的区别详解
Feb 18 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中将网址转换为超链接的函数
2011/09/02 PHP
CodeIgniter框架基本增删改查操作示例
2017/03/23 PHP
拖动一个HTML元素
2006/12/22 Javascript
jQuery UI-Draggable 参数集合
2010/01/10 Javascript
js获取电脑分辨率的思路及操作
2013/11/22 Javascript
jQuery过滤选择器:not()方法使用介绍
2014/04/20 Javascript
JS判断、校验MAC地址的2个实例
2014/05/05 Javascript
js星星评分效果
2014/07/24 Javascript
详解JavaScript编程中的数组结构
2015/10/24 Javascript
纯javascript移动优先的幻灯片效果
2015/11/02 Javascript
JavaScript基于replace+正则实现ES6的字符串模版功能
2017/04/25 Javascript
Vue侧滑菜单组件——DrawerLayout
2017/12/18 Javascript
vue实现通讯录功能
2018/07/14 Javascript
详解Axios统一错误处理与后置
2018/09/26 Javascript
微信小程序学习笔记之函数定义、页面渲染图文详解
2019/03/28 Javascript
vue cli安装使用less的教程详解
2019/07/12 Javascript
vue使用codemirror的两种用法
2019/08/27 Javascript
使用easyui从servlet传递json数据到前端页面的两种方法
2019/09/05 Javascript
Vue实现手机扫描二维码预览页面效果
2020/05/28 Javascript
浅谈React中组件逻辑复用的那些事儿
2020/05/21 Javascript
python读取csv文件示例(python操作csv)
2014/03/11 Python
wxPython中文教程入门实例
2014/06/09 Python
Django中reverse反转并且传递参数的方法
2019/08/06 Python
Python实现从N个数中找到最大的K个数
2020/04/02 Python
Django分组聚合查询实例分享
2020/04/29 Python
Django自带用户认证系统使用方法解析
2020/11/12 Python
HearthSong官网:儿童户外玩具、儿童益智玩具
2017/10/16 全球购物
GANT葡萄牙官方商店:拥有美国运动服传统的生活方式品牌
2018/10/18 全球购物
Lacoste澳大利亚官网:服装、鞋类及配饰
2018/11/14 全球购物
农业局学习党的群众路线教育实践活动心得体会
2014/03/07 职场文书
房屋租赁合同解除协议书
2014/10/11 职场文书
加强作风建设心得体会
2014/10/22 职场文书
怎样写工作总结啊!
2019/06/18 职场文书
pandas 操作 Excel操作总结
2021/03/31 Python
MySQL查询日期时间
2022/05/15 MySQL
Java实现HTML转为Word的示例代码
2022/06/28 Java/Android