Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式


Posted in Javascript onJune 24, 2014

函数声明

function foo() {}

函数 foo 将会在整个程序执行前被 hoist (提升),因此它在定义 foo 函数的整个 scope (作用域)中都是可用的。即使在函数定义之前调用它也没问题。

foo(); // Works because foo was created before this code runs
function foo() {}

因为我打算专门写篇介绍作用域的文章,所以这里就不详述了。

函数表达式

对于函数声明,函数的名称是必须的,而对于函数表达式而言则是可选的,因此,就出现了匿名函数表达式和命名函数表达式。如下:

函数声明: function functionName (){  }
函数声明: function functionName[可选](){  }
那么我就知道,如果没有函数名的话,一定就是函数表达式,但是对于有函数名的情况该如何判断呢?
Javascript 规定如果整个函数体是作为表达式的一部分时,那么它就是函数表达式,否则即是函数声明。以下为表达式:

var fuc = foo(){}

我们再举几个极端的表达式例子:

!function foo(){}
true && function foo(){}

以上的语句这里只是为了区分函数表达式,一般不会这样写。那么用一个对比的例子来看看效果:

foo1();//foo1 is not defined 
foo2();//works because foo2 was created before this code runs
!function foo1() {
  alert('foo1 works');
};
function foo2() {
  alert('foo2 works');
};

匿名函数表达式

var foo = function() {};

上面的例子将一个匿名函数赋值给了变量 foo。

foo; // 'undefined'
foo(); // this raises a TypeError
var foo = function() {};

由于 var 是一个声明所以这里对变量 foo 进行 hoist (提升),因此当程序执行时,变量 foo 是可调用的。
但是由于赋值语句只有在运行时才生效,所以变量 foo 的值为 undefined。

命名函数表达式

另一个要讲到的就是命名函数的赋值。

var foo = function bar() {
  bar(); // Works
};
bar(); // ReferenceError

在这里,命名函数 bar 赋值给了变量 foo,所以在函数声明外是不可见的,但在 bar 函数内部仍然可以调用。这是因为 Javascript 对命名函数处理的机制,函数的名称永远在函数内部的作用域中有效。

Javascript 相关文章推荐
javascript不同页面传值的改进版
Sep 30 Javascript
通用javascript脚本函数库 方便开发
Oct 13 Javascript
情人节专属 纯js脚本1k大小的3D玫瑰效果
Feb 11 Javascript
Extjs中ComboBox加载并赋初值的实现方法
Mar 22 Javascript
ie支持function.bind()方法实现代码
Dec 27 Javascript
根据表格中的某一列进行排序的javascript代码
Nov 29 Javascript
JavaScript判断textarea值是否为空并给出相应提示
Sep 04 Javascript
javascript实现dom动态创建省市纵向列表菜单的方法
May 14 Javascript
使用AmplifyJS组件配合JavaScript进行编程的指南
Jul 28 Javascript
Bootstrap编写一个兼容主流浏览器的受众门户式风格页面
Jul 01 Javascript
js 动态生成html 触发事件传参字符转义的实例
Feb 14 Javascript
vue中全局路由守卫中替代this操作(this.$store/this.$vux)
Jul 24 Javascript
Javascript学习笔记之 对象篇(四) : for in 循环
Jun 24 #Javascript
Javascript学习笔记之 对象篇(三) : hasOwnProperty
Jun 24 #Javascript
js实现div闪烁原理及实现代码
Jun 24 #Javascript
Javascript 学习笔记之 对象篇(二) : 原型对象
Jun 24 #Javascript
Javascript学习笔记之 对象篇(一) : 对象的使用和属性
Jun 24 #Javascript
jQuery学习笔记之 Ajax操作篇(三) - 过程处理
Jun 23 #Javascript
jquery 为a标签绑定click事件示例代码
Jun 23 #Javascript
You might like
PHP 正则表达式之正则处理函数小结(preg_match,preg_match_all,preg_replace,preg_split)
2012/10/05 PHP
Yii2实现上下联动下拉框功能的方法
2016/08/10 PHP
Yii2实现跨mysql数据库关联查询排序功能代码
2017/02/10 PHP
PHP使用ajax的post方式下载excel文件简单示例
2019/08/06 PHP
PHP中非常有用却鲜有人知的函数集锦
2019/08/17 PHP
使用PHP+Redis实现延迟任务,实现自动取消订单功能
2019/11/21 PHP
PHP时间相关常用函数用法示例
2020/06/03 PHP
总结AJAX相关JS代码片段和浏览器模型
2007/08/15 Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
2013/01/24 Javascript
目前流行的JavaScript库的介绍及对比
2013/09/29 Javascript
JQuery 给元素绑定click事件多次执行的解决方法
2014/09/09 Javascript
javascript设置连续两次点击按钮时间间隔的方法
2014/10/28 Javascript
jQuery scrollFix滚动定位插件
2015/04/01 Javascript
Javascript获取数组中的最大值和最小值的方法汇总
2016/01/01 Javascript
JS中setTimeout的巧妙用法前端函数节流
2016/03/24 Javascript
Javascript 6里的4个新语法
2016/08/25 Javascript
bootstrap daterangepicker汉化以及扩展功能
2017/06/15 Javascript
详解react使用react-bootstrap当轮子造车
2017/08/15 Javascript
详解react-router4 异步加载路由两种方法
2017/09/12 Javascript
vue中使用vue-router切换页面时滚动条自动滚动到顶部的方法
2017/11/28 Javascript
vue 左滑删除功能的示例代码
2019/01/28 Javascript
小程序中英文混合排序问题解决
2019/08/02 Javascript
mpvue实现左侧导航与右侧内容的联动
2019/10/21 Javascript
Node.JS如何实现JWT原理
2020/09/18 Javascript
Python中用pycurl监控http响应时间脚本分享
2015/02/02 Python
使用Python中PDB模块中的命令来调试Python代码的教程
2015/03/30 Python
Python操作RabbitMQ服务器实现消息队列的路由功能
2016/06/29 Python
python与sqlite3实现解密chrome cookie实例代码
2018/01/20 Python
Python使用 Beanstalkd 做异步任务处理的方法
2018/04/24 Python
Python+OpenCV实现旋转文本校正方式
2020/01/09 Python
python3.6使用SMTP协议发送邮件
2020/05/20 Python
简单了解Python多态与属性运行原理
2020/06/15 Python
python进度条显示-tqmd模块的实现示例
2020/08/23 Python
写给老婆的检讨书
2014/02/21 职场文书
小学教师学习党的群众路线教育实践活动心得体会
2014/10/31 职场文书
本科毕业论文导师评语
2014/12/31 职场文书