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 相关文章推荐
一个分享按钮的插件使用介绍(可扩展,内附开发制作流程)
Sep 19 Javascript
jquery上传插件fineuploader上传文件使用方法(jquery图片上传插件)
Dec 05 Javascript
纯js实现无限空间大小的本地存储
Jun 18 Javascript
JS实现点击按钮控制Div变宽、增高及调整背景色的方法
Aug 05 Javascript
JavaScript简单获取系统当前时间完整示例
Aug 02 Javascript
Javascript中常用类型的格式化方法小结
Dec 26 Javascript
Node.js连接MongoDB数据库产生的问题
Feb 08 Javascript
JavaScript如何对图片进行黑白化
Apr 10 Javascript
浅谈node.js 命令行工具(cli)
May 10 Javascript
微信小程序 授权登录详解(附完整源码)
Aug 23 Javascript
vue实现购物车功能(商品分类)
Apr 20 Javascript
JS实现简单打字测试
Jun 24 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小型企业库存管理系统的设计与实现代码
2011/05/16 PHP
php网站被挂木马后的修复方法总结
2014/11/06 PHP
教你在header中隐藏php的版本信息
2016/08/10 PHP
thinkPHP数据库增删改查操作方法实例详解
2016/12/06 PHP
php如何实现数据库的备份和恢复
2020/11/30 PHP
Firefox window.close()的使用注意事项
2009/04/11 Javascript
javascript面向对象的方式实现的弹出层效果代码
2010/01/28 Javascript
jquery将一个表单序列化为一个对象的方法
2014/01/03 Javascript
JavaScript实现的图像模糊算法代码分享
2014/04/22 Javascript
js常用数组操作方法简明总结
2014/06/20 Javascript
JavaScript判断textarea值是否为空并给出相应提示
2014/09/04 Javascript
javascript事件委托的用法及其好处简析
2016/04/04 Javascript
javascript中数组(Array)对象和字符串(String)对象的常用方法总结
2016/12/15 Javascript
angular bootstrap timepicker TypeError提示怎么办
2017/06/13 Javascript
基于vue-ssr服务端渲染入门详解
2018/01/08 Javascript
Vue slot用法(小结)
2018/10/22 Javascript
浏览器事件循环与vue nextTicket的实现
2019/04/16 Javascript
LayUI switch 开关监听 获取属性值、更改状态的方法
2019/09/21 Javascript
Vue SSR 即时编译技术的实现
2020/05/06 Javascript
AutoJs实现刷宝短视频的思路详解
2020/05/22 Javascript
微信小程序文章列表功能完整实例
2020/06/03 Javascript
Vue指令实现OutClick的示例
2020/11/16 Javascript
浅谈python内置变量-reversed(seq)
2017/06/21 Python
Python基于pycrypto实现的AES加密和解密算法示例
2018/04/10 Python
TensorFlow利用saver保存和提取参数的实例
2018/07/26 Python
Python for循环及基础用法详解
2019/11/08 Python
浅谈优化Django ORM中的性能问题
2020/07/09 Python
CSS3教程(8):CSS3透明度指南
2009/04/02 HTML / CSS
中国包裹转运寄送国际服务:Famiboat
2019/07/24 全球购物
安全教育实施方案
2014/03/02 职场文书
学雷锋月活动总结
2014/04/25 职场文书
乡镇爱国卫生月活动总结
2014/06/25 职场文书
2014年保育员个人工作总结
2014/12/02 职场文书
钢琴师观后感
2015/06/12 职场文书
遗失证明范文
2015/06/19 职场文书
军训结束新闻稿
2015/07/17 职场文书