javascript 用函数语句和表达式定义函数的区别详解


Posted in Javascript onJanuary 06, 2014

使用javascript多年,写过无数函数,今天却才真正弄明白两种函数定义的区别,真是悲剧,写下这个随笔, 以时刻提醒自己要打好基础 , 一大把年纪了, 不能继续懵懵懂懂了。

通常我们会看到以下两种定义函数的方式:

// 函数语句
function fn(str)
{
  console.log(str);
};
// 表达式定义
var fnx=function(str)
{
  console.log(str+ ' from fnx');
};

以前都是凭借自己手指的感觉随心所欲使用两者 -_- || ,今天看了js基础, 总算是解决了心中对他们的困惑:

两种方式都创建了新的函数对象, 但函数声明语句的函数名是一个变量名, 变量指向函数对象, 和通过var声明变量一样,函数定义语句中的函数被显示地提前到了脚本或函数的顶部, 因此它们在整个脚本和函数内都是可见的,但是使用var 表达式定义函数, 只有变量声明提前了,变量初始化代码仍然在原来的位置, 用函数语句创建的函数, 函数名称和函数体均被提前,所以我们可以在声明它之前就使用它。

代码例子如下:

   console.log(typeof(fn)); // function
    fn('abc'); // abc

    console.log(typeof(fnx)); // undefined
    if(fnx)
        fnx('abc');  // will not execute
    else
        console.log('fnx is undefined'); // fnx is undefined
    // 函数语句
    function fn(str)
    {
        console.log(str);
    };
    // 表达式定义
    var fnx=function(str)
    {
        console.log(str+ ' from fnx');
    };

代码很简单, 希望和我之前一样没有弄明白两者区别的同学能有所收获 。
Javascript 相关文章推荐
本地图片预览(支持IE6/IE7/IE8/Firefox3)经验总结
Mar 25 Javascript
上传文件返回的json数据会被提示下载问题解决方案
Dec 03 Javascript
JS动态添加Table的TR,TD实现方法
Jan 28 Javascript
js的flv视频播放器插件使用方法
Jun 23 Javascript
js实现匹配时换色的输入提示特效代码
Aug 17 Javascript
javascript下使用Promise封装FileReader
Feb 19 Javascript
AngularJS入门教程之双向绑定详解
Aug 18 Javascript
js制作简单的音乐播放器的示例代码
Aug 28 Javascript
微信小程序开发之改变data中数组或对象的某一属性值
Jul 05 Javascript
jQuery实现数字华容道小游戏(实例代码)
Jan 16 jQuery
vue axios请求成功却进入catch的原因分析
Sep 08 Javascript
原生js实现自定义难度的扫雷游戏
Jan 22 Javascript
js形成页面的一种遮罩效果实例代码
Jan 04 #Javascript
JavaScript将数据转换成整数的方法
Jan 04 #Javascript
jquery.post用法关于type设置问题补充
Jan 03 #Javascript
JQuery处理json与ajax返回JSON实例代码
Jan 03 #Javascript
jquery.post用法示例代码
Jan 03 #Javascript
简单的代码实现jquery定时器
Jan 03 #Javascript
jquery将一个表单序列化为一个对象的方法
Jan 03 #Javascript
You might like
在同一窗体中使用PHP来处理多个提交任务
2006/10/09 PHP
介绍一些PHP判断变量的函数
2012/04/24 PHP
PHP遍历文件夹与文件类及处理类用法实例
2014/09/23 PHP
php将图片保存入mysql数据库失败的解决方法
2014/12/27 PHP
php多进程并发编程防止出现僵尸进程的方法分析
2020/02/28 PHP
Firebug入门指南(Firefox浏览器)
2010/08/21 Javascript
Extjs中ComboBox加载并赋初值的实现方法
2012/03/22 Javascript
使用jquery 简单实现下拉菜单
2015/01/14 Javascript
js改变css样式的三种方法推荐
2016/06/28 Javascript
老生常谈Javascript中的原型和this指针
2016/10/09 Javascript
JS触摸事件、手势事件详解
2017/05/04 Javascript
JS实现基于Sketch.js模拟成群游动的蝌蚪运动动画效果【附demo源码下载】
2017/08/18 Javascript
HTML5开发Kinect体感游戏的实例应用
2017/09/18 Javascript
VUE重点问题总结
2018/03/19 Javascript
jQuery实现导航样式布局操作示例【可自定义样式布局】
2018/07/24 jQuery
javascript中UMD规范的代码推演
2018/08/29 Javascript
JS中验证整数和小数的正则表达式
2018/10/08 Javascript
npm的lock机制解析
2019/06/20 Javascript
es6中比较有用的7个技巧小结
2019/07/12 Javascript
Jquery让form表单异步提交代码实现
2019/11/14 jQuery
ElementUI 修改默认样式的几种办法(小结)
2020/07/29 Javascript
[02:36]DOTA2混沌骑士 英雄基础教程
2013/11/26 DOTA
简单了解Python下用于监视文件系统的pyinotify包
2015/11/13 Python
Python文件操作,open读写文件,追加文本内容实例
2016/12/14 Python
python3.5 + PyQt5 +Eric6 实现的一个计算器代码
2017/03/11 Python
Python实现的文本编辑器功能示例
2017/06/30 Python
Python中print函数简单使用总结
2019/08/05 Python
python实现udp传输图片功能
2020/03/20 Python
Python实现列表中非负数保留,负数转化为指定的数值方式
2020/06/04 Python
Python函数的迭代器与生成器的示例代码
2020/06/18 Python
Python 抓取数据存储到Redis中的操作
2020/07/16 Python
selenium+超级鹰实现模拟登录12306
2021/01/24 Python
List、Map、Set三个接口,存取元素时,各有什么特点?
2015/09/27 面试题
村官学习十八大感想
2014/01/15 职场文书
医院工作检讨书范文
2014/02/10 职场文书
水利局群众路线专题民主生活会发言材料
2014/09/21 职场文书