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 相关文章推荐
学习ExtJS 访问容器对象
Oct 07 Javascript
基于JQuery.timer插件实现一个计时器
Apr 25 Javascript
如何实现修改密码时密码框显示保存到cookie的密码
Dec 10 Javascript
js的alert样式如何更改如背景颜色
Jan 22 Javascript
基于javascript编写简单日历
May 02 Javascript
JavaScript 冒泡排序和选择排序的实现代码
Sep 03 Javascript
javascript数组对象常用api函数小结(连接,插入,删除,反转,排序等)
Sep 20 Javascript
js模拟支付宝密码输入框
Apr 11 Javascript
jquery单击文字或图片内容放大并居中显示
Jun 23 jQuery
解决webpack无法通过IP地址访问localhost的问题
Feb 22 Javascript
vue获取时间戳转换为日期格式代码实例
Apr 17 Javascript
nestjs中异常过滤器Exceptionfilter的具体使用
Feb 07 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
动易数据转成dedecms的php程序
2007/04/07 PHP
PHP中数组合并的两种方法及区别介绍
2012/09/14 PHP
php网页标题中文乱码的有效解决方法
2014/03/05 PHP
四个PHP非常实用的功能
2015/09/29 PHP
PHP面向对象五大原则之里氏替换原则(LSP)详解
2018/04/08 PHP
在IE,Firefox,Safari,Chrome,Opera浏览器上调试javascript
2008/12/02 Javascript
childNodes.length与children.length的区别
2009/05/14 Javascript
javascript 客户端验证上传图片的大小(兼容IE和火狐)
2009/08/15 Javascript
js 事件截取enter按键页面提交事件示例代码
2014/03/04 Javascript
js加入收藏夹代码(兼容ie/ff/op)
2014/05/16 Javascript
AngularJS实现表单验证
2015/01/28 Javascript
JavaScript引用类型和基本类型详解
2016/01/06 Javascript
微信小程序开发(二)图片上传+服务端接收详解
2017/01/11 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
2017/09/12 Javascript
JS集合set类的实现与使用方法示例
2019/02/01 Javascript
详解小程序BackgroundAudioManager踩坑之旅
2019/12/08 Javascript
Node.js学习之内置模块fs用法示例
2020/01/22 Javascript
vue cli3.0打包上线静态资源找不到路径的解决操作
2020/08/03 Javascript
Python Matplotlib库入门指南
2015/05/18 Python
Python Requests安装与简单运用
2016/04/07 Python
Python3多进程 multiprocessing 模块实例详解
2018/06/11 Python
在Python中居然可以定义两个同名通参数的函数
2019/01/31 Python
Python弹出输入框并获取输入值的实例
2019/06/18 Python
Python英文文章词频统计(14份剑桥真题词频统计)
2019/10/13 Python
Django 实现Admin自动填充当前用户的示例代码
2019/11/18 Python
python logging.basicConfig不生效的原因及解决
2020/02/20 Python
亚马逊西班牙购物网站:amazon西班牙
2017/03/06 全球购物
六道php面试题附答案
2014/06/05 面试题
SQL里面如何插入自动增长序列号字段
2012/03/29 面试题
党性心得体会
2014/09/03 职场文书
2015年监理工作总结范文
2015/04/07 职场文书
幼儿园园长安全责任书
2015/05/08 职场文书
国王的演讲观后感
2015/06/03 职场文书
十二生肖观后感
2015/06/12 职场文书
九年级化学教学反思
2016/02/22 职场文书
Java服务调用RestTemplate与HttpClient的使用详解
2022/06/21 Java/Android