JS两种定义方式的区别、内部原理


Posted in Javascript onNovember 21, 2013

相信两种方式大家都用过,但未必所有人都知道其 区别,内部原理。

// 方式1 
function func1(x,y){ 
// your code 
} 
// 方式2 
var func2 = function(x,y){ 
// your code 
}

方式1 是典型的函数声明(Function declarations)。
方式2 是函数表达式(Function expressions),将一个匿名函数赋值给一个变量。或者说方式2中创建了一个具有形参为x,y的匿名函数,然后把该匿名函数赋值给变量func2。

其主要区别在于:
1, 函数声明需显示的指定函数名,这里是func1;函数表达式则使用匿名函数
2, 方式1在代码执行之前(解释期)被加载到作用域中,方式2则需在代码执行时(运行期)加载

一个简单示例就明白了它们在使用上的区别

alert(func1); // --> func1源码 
alert(func2); // --> undefined 
// 方式1 
function func1(x,y){ 
// your code 
} 
// 方式2 
var func2 = function(x,y){ 
// your code 
}

可以看到,第一次弹出的是func1的源码,第二次却是undefined。即采用方式1(函数声明)定义函数,可以在该函数代码之上使用它,采用方式2(函数表达式)定义函数则不能在其定义前使用,只能在其定义后使用。

其内部涉及到 执行上下文(Execution context)及 激活对象(Activation object)。想更深了解的请阅读EcmaScript 5文档。

最近发现越来越多的人喜欢使用方式2定义函数,尤其在嵌套函数中。如单纯的定义一个函数个人还是习惯方式1。

Javascript 相关文章推荐
getElementsByTagName vs selectNodes效率 及兼容的selectNodes实现
Feb 26 Javascript
基于jQuery的树控件实现代码(asp.net+json)
Jul 11 Javascript
javascript 基础篇2 数据类型,语句,函数
Mar 14 Javascript
JavaScript实现常用二级省市级联下拉列表的方法
Mar 25 Javascript
javascript日期操作详解(脚本之家整理)
Sep 05 Javascript
JavaScript实现通过select标签跳转网页的方法
Sep 29 Javascript
Angular 中 select指令用法详解
Sep 29 Javascript
微信小程序之小豆瓣图书实例
Nov 30 Javascript
bootstrap网格系统使用方法解析
Jan 13 Javascript
AngularJS 事件发布机制
Aug 28 Javascript
Vue 实例事件简单示例
Sep 19 Javascript
Vue中使用better-scroll实现轮播图组件
Mar 07 Javascript
jQuery操作input值的各种方法总结
Nov 21 #Javascript
jqgrid 表格数据导出实例
Nov 21 #Javascript
js 实现菜单左右滚动显示示例介绍
Nov 21 #Javascript
Extjs4实现两个GridPanel之间数据拖拽功能具体方法
Nov 21 #Javascript
JQuery的ready函数与JS的onload的区别详解
Nov 21 #Javascript
js 实现菜单上下显示附效果图
Nov 21 #Javascript
javascript 数组排序函数sort和reverse使用介绍
Nov 21 #Javascript
You might like
php开发工具之vs2005图解
2008/01/12 PHP
Ajax+PHP边学边练 之五 图片处理
2009/12/03 PHP
php超快高效率统计大文件行数
2015/07/05 PHP
发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载
2007/07/21 Javascript
firefox事件处理之自动查找event的函数(用于onclick=foo())
2010/08/05 Javascript
通过JS获取用户本地图片路径并显示的代码
2012/02/16 Javascript
JS去除右边逗号的简单方法
2013/07/03 Javascript
ExtJS4如何自动生成控制grid的列显示、隐藏的checkbox
2014/05/02 Javascript
使用js dom和jquery分别实现简单增删改
2014/09/11 Javascript
AngularJS 执行流程详细介绍
2016/08/18 Javascript
巧用jQuery选择器提高写表单效率的方法
2016/08/19 Javascript
jQuery组件easyui对话框实现代码
2016/08/25 Javascript
浅谈Angular的$q, defer, promise
2016/12/20 Javascript
jquery实现左右滑动式轮播图
2017/03/02 Javascript
AngularJS实现tab选项卡的方法详解
2017/07/05 Javascript
jQuery 实现左右两侧菜单添加、移除功能
2018/01/02 jQuery
JS module的导出和导入的实现代码
2019/02/25 Javascript
小程序云开发之用户注册登录
2019/05/18 Javascript
js获取图片的base64编码并压缩
2020/12/05 Javascript
[47:06]DOTA2上海特级锦标赛主赛事日 - 4 败者组第五轮 MVP.Phx VS EG第一局
2016/03/05 DOTA
深入理解Javascript中的this关键字
2015/03/27 Python
python fabric使用笔记
2015/05/09 Python
Python字典操作详细介绍及字典内建方法分享
2018/01/04 Python
利用django-suit模板添加自定义的菜单、页面及设置访问权限
2018/07/13 Python
HTML的form表单和django的form表单
2019/07/25 Python
python 列表推导式使用详解
2019/08/29 Python
HTML5对比HTML4的主要改变和改进总结
2016/05/27 HTML / CSS
武汉世纪畅想数字传播有限公司.NET笔试题
2014/07/22 面试题
环境工程大学生个人的自我评价
2013/10/08 职场文书
测量工程专业求职信
2014/02/24 职场文书
开学典礼决心书
2014/03/11 职场文书
爱国口号
2014/06/19 职场文书
居委会个人对照检查材料思想汇报
2014/09/29 职场文书
党的群众路线整改落实情况汇报
2014/10/28 职场文书
2015年预备党员自我评价
2015/03/04 职场文书
基于Android10渲染Surface的创建过程
2022/08/14 Java/Android