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 相关文章推荐
javascript之可拖动的iframe效果代码
Aug 01 Javascript
Ext.MessageBox工具类简介
Dec 10 Javascript
myFocus slide3D v1.1.0 使用方法与下载
Jan 12 Javascript
JS阻止冒泡事件以及默认事件发生的简单方法
Jan 17 Javascript
jQuery实现最简单的切换图效果【可兼容IE6、火狐、谷歌、opera等】
Sep 04 Javascript
js中数组插入、删除元素操作的方法
Feb 15 Javascript
Vue 仿百度搜索功能实现代码
Feb 16 Javascript
js+html5实现侧滑页面效果
Jul 15 Javascript
jQuery基于闭包实现的显示与隐藏div功能示例
Jun 09 jQuery
Vue + Elementui实现多标签页共存的方法
Jun 12 Javascript
bootstrap实现嵌套模态框的实例代码
Jan 10 Javascript
微信小程序开发搜索功能实现(前端+后端+数据库)
Mar 04 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
xajax写的留言本
2006/11/25 PHP
php获取四位字母和数字的随机数的实现方法
2015/01/09 PHP
浅谈PDO的rowCount函数
2015/06/18 PHP
如何使用微信公众平台开发模式实现多客服
2016/01/06 PHP
php实现自定义中奖项数和概率的抽奖函数示例
2017/05/26 PHP
THINKPHP5分页数据对象处理过程解析
2020/10/28 PHP
JavaScript 未结束的字符串常量常见解决方法
2010/01/24 Javascript
node在两个div之间移动,用ztree实现
2013/03/06 Javascript
javascript标签在页面中的位置探讨
2013/04/11 Javascript
JavaScript中的关键字"VAR"使用详解 分享
2013/07/31 Javascript
jquery的ajax简单结构示例代码
2014/02/17 Javascript
JS 打印界面的CSS居中代码适用所有浏览器
2014/03/19 Javascript
将JavaScript的jQuery库中表单转化为JSON对象的方法
2015/11/17 Javascript
Bootstrap滚动监听(Scrollspy)插件详解
2016/04/26 Javascript
利用jQuery解析获取JSON数据
2017/04/08 jQuery
js实现多张图片延迟加载效果
2017/07/17 Javascript
基于JavaScript实现评论框展开和隐藏功能
2017/08/25 Javascript
Vue通过Blob对象实现导出Excel功能示例代码
2020/07/31 Javascript
JS实现页面鼠标点击出现图片特效
2020/08/19 Javascript
vue3.0中setup使用(两种用法)
2020/12/02 Vue.js
[05:15]DOTA2英雄梦之声_第16期_灰烬之灵
2014/06/21 DOTA
python的else子句使用指南
2016/02/27 Python
Python numpy实现二维数组和一维数组拼接的方法
2018/06/05 Python
读取json格式为DataFrame(可转为.csv)的实例讲解
2018/06/05 Python
详解Python if-elif-else知识点
2018/06/11 Python
对python3 中方法各种参数和返回值详解
2018/12/15 Python
通过python实现弹窗广告拦截过程详解
2019/07/10 Python
使用Python第三方库pygame写个贪吃蛇小游戏
2020/03/06 Python
Dogeared官网:在美国手工制作的珠宝
2019/08/24 全球购物
会计自我鉴定
2014/02/04 职场文书
总经理秘书岗位职责
2014/03/17 职场文书
读群众路线的心得体会
2014/09/03 职场文书
出售房屋委托书范本
2014/09/24 职场文书
社会实践心得体会范文
2016/01/14 职场文书
javascript之Object.assign()的痛点分析
2022/03/03 Javascript
vue实现登陆页面开发实践
2022/05/30 Vue.js