相同点

注:函数声明和函数表达式的相同点包括但不限于以下几点

  1. 函数是一个值,所以和其他值一样,函数也可以进行被输出、被赋值、作为参数传给其他函数等相关操作,不管函数是以什么方式被定义的,当然和其他值的输出还是有些区别的。

    我们先来输出这个值:

    function nameAlert(name){
    alert('博主的名字是:' + name + ' 。');
    }
    alert(nameAlert);
    注意输出的结果并不是1,而是这个函数的整个源代码,即输出结果为: function nameAlert(name){
    alert('博主的名字是:' + name + ' 。');
    }
  2. 作为参数传给其他函数。

    function nameAlert(name){
    alert('博主的名字是:' + name + ' 。');
    }
    var anotherNameAlert=nameAlert;
    anotherNameAlert('myvin');

    该例子中将函数nameAlert作为参数传给了anotherNameAlert,然后anotherNameAlert也指向了该函数。

    这里就涉及到了函数的传递,函数的传递是传引用,就是说函数存在内存中的某个位置,nameAlertanotherNameAlert是都是函数的一个引用,把函数名nameAlert赋值给anotherNameAlert的时候,它们引用的都是同一个函数。

    所以anotherNameAlert的输出结果为:

    博主的名字是:myvin 。

当然函数还有其他特点,在此不再介绍,感兴趣的可以自己总结下。

不同点

注:函数声明和函数表达式的不同点包括但不限于以下几点

相对函数声明和函数表达式之间的相同点,它们的不同点更应该值得我们关注。下面我结合自己的理解聊聊。

  1. 函数声明必须有标识符,也就是常说的函数名;函数表达式可以省略函数名。

    关于它们的定义的不同小伙伴们应该都知道,我们简单重复一遍。

    如下:

    函数声明(要带标识符)

    function functionName(arg1, arg2, ...){
    <!-- function body -->
    }

    函数表达式

    • 省略标识符

      var  variable=function(arg1, arg2, ...){
      <!-- function body -->
      }
    • 带有标识符

      var  variable=function functionName(arg1, arg2, ...){
      <!-- function body -->
      }
  2. 函数声明会提前

    函数声明是在预执行期执行的,就是说函数声明是在浏览器准备执行代码的时候执行的。因为函数声明在预执行期被执行,所以到了执行期,函数声明就不再执行(人家都执行过了自然就不再执行了)。

    例子的话还是前文的说真话函数:

    sayTruth();<!-- 函数声明 -->
    function sayTruth(){
    alert('myvin is handsome.');
    } sayTruth();<!-- 函数表达式 -->
    var sayTruth=function(){
    alert('myvin is handsome.');
    }

    即函数声明的话sayTruth()可以提前调用,就是不请自来的那种,而函数表达式是什么时候遇到什么时候执行。

    函数声明提前是它们很大的一个不同点,理解这一点对于我们函数的应用有很大帮助,能使我们避免一些错误。

  3. ECMAScript规范中表示,函数声明语句可以出现在全局代码中,或者内嵌在其他函数中,但是不能出现在循环、条件判、或者try/finally以及with语句中。

    对于这条,可能会有所疑问:“上文不是有一个函数声明出现在if循环中的么”。的确是这样,但是规定下发了,遵守不遵守就是另一回事了。JavaScript对于这条规范的实现并不是严格遵守的,FF中允许if中出现函数声明。

    但不管规范怎么样,造成这样的原因还是函数声明提前。

    还是引用上文的例子和说明:

    sayTruth();
    if(1){
    function sayTruth(){alert('myvin is handsome')};
    }
    else{
    function sayTruth(){alert('myvin is ugly')};
    }

    为什么呢?当然是声明提前了。因为函数声明提前,所以函数声明会在代码执行前进行解析,执行顺序是这样的,先解析function sayTruth(){alert('myvin is handsome')},在解析function sayTruth(){alert('myvin is ugly')},覆盖了前面的函数声明,当我们调用sayTruth()函数的时候,也就是到了代码执行期间,声明会被忽略,所以自然会输出myvin is ugly

  4. 可以创建一个函数表达式即刻执行。

    (function(){
    alert('博主的名字是:myvin 。');
    })()

    这样可以使得全局变量不受局部变量的影响,保持全局的干净。注意,括号里面的是表达式。

事实上,js的解析器对函数声明与函数表达式并不是一视同仁地对待的。对于函数声明,js解析器会优先读取,确保在所有代码执行之前声明已经被解析,而函数表达式,如同定义其它基本类型的变量一样,只在执行到某一句时也会对其进行解析,所以在实际中,它们还是会有差异的,具体表现在,当使用函数声明的形式来定义函数时,可将调用语句写在函数声明之前,而后者,这样做的话会报错。

参考链接:http://www.cnblogs.com/myvin/p/4649789.html

http://blog.csdn.net/one_and_only4711/article/details/6361131

JS中函数声明与函数表达式的异同的更多相关文章

  1. JS中函数声明与函数表达式的不同

    Js中的函数声明是指下面的形式: function functionName(){   } 这样的方式来声明一个函数,而函数表达式则是类似表达式那样来声明一个函数,如 var functionName ...

  2. JS中的函数声明和函数表达式的区别,即function(){}和var function(){},以及变量提升、作用域和作用域链

    一.前言 Uncaught TypeError: ... is not a function function max(){}表示函数声明,可以放在代码的任何位置,也可以在任何地方成功调用: var ...

  3. JS的一些总结(函数声明和函数表达式的区别,函数中的this指向的问题,函数不同的调用方式,函数也是对象,数组中的函数调用)

    一.函数声明和函数表达式的区别: 函数声明放在if——else语句中,在IE8中会出现问题 函数表达式则不会 <script> if(true){ function f1(){ conso ...

  4. js中的函数声明和函数表达式的区别

    目录 一.声明与表达式的格式 1.1 声明式的格式: 1.2 表达式的格式: 二.区别 2.1 函数表达式可以直接在后面加括号执行,而函数声明不可以. 2.2 函数表达式可以被提前解析出来 2.3 命 ...

  5. Js中函数声明和函数表达式的区别

    先看以下几段烧脑的代码: f();//=>? var f = function () { console.log("var"); } function f() { conso ...

  6. js函数声明和函数表达式的区别

    Javascript Function无处不在,而且功能强大!通过Javascript函数可以让JS具有面向对象的一些特征,实现封装.继承等,也可以让代码得到复用.但事物都有两面性,Javascrip ...

  7. 转载 js函数声明和函数表达式

    在js中函数有两种表达方式.1 函数声明 2 函数表达式 函数声明 function sayname(){ alert("li lei"); } 函数表达式 var sayname ...

  8. JavaScript(js)函数声明与函数表达式的区别

    在JavaScript中,函数是经常用到的,在实际开发的时候,我想很多人都没有太在意函数的声明与函数表达式的区别,但是呢,这种细节的东西对于学好js是非常重要的. 函数声明与函数表达式用代码写出来是这 ...

  9. 【JS】函数提升变量提升以及函数声明和函数表达式的区别

    今天看js的变量提升问题,里面提到了函数提升.然后发现自己之前一直把函数声明和函数表达式弄错,导致函数提升出错 一.变量提升 console.log(a) var a=100 //undefined ...

随机推荐

  1. 微信公众号支付安卓和WP支付成功,苹果不能支付!

    花了几天时间,终于搞好了,代码是从官网上下的.NET DEMO的代码改的,测试的时候发现安卓和WP手机都能进行支付,但是苹果的怎么支付都支付不了,主要是在下面这个界面 点支付按钮就是苹果支付不了,其他 ...

  2. Diamond 3.5简易教程(一)------工程的建立

    测试环境(win10 x64 软件Diamond 3.5 x64) 软件下载地址:http://files.latticesemi.com/Diamond/3.5/3.5.0.102_Diamond_ ...

  3. 【Android】16.5 Android内置的系统服务

    分类:C#.Android.VS2015: 创建日期:2016-03-01 一.简介 实际上,在Android.Content.Context类中,Android已经提供了多种类型的系统服务,这些服务 ...

  4. 一文读懂什么是Java中的自动拆装箱

    基本数据类型 基本类型,或者叫做内置类型,是Java中不同于类(Class)的特殊类型.它们是我们编程中使用最频繁的类型. Java是一种强类型语言,第一次申明变量必须说明数据类型,第一次变量赋值称为 ...

  5. 有趣的switch应用(填入种类,显示响应的价格)

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. VC++编程之道读书笔记

    第二篇 缪误21:位图数据是按照红绿蓝顺序存储的 大家都知道位图的颜色是由红.绿.蓝三个分量构成的,但是位图颜色数据存储的方式则不是按照这个顺序存储的,而是按照蓝.绿.红的顺序存储的.并且对于真彩色位 ...

  7. python学习笔记(18)--eclipse更换主题

    说明: 1. 在eclipse marketplace 搜索color ide pack安装 2. 参考文章和评论http://blog.csdn.net/wusuopubupt/article/de ...

  8. redis、mysql、和php原生array数组效率对比

    最近要做一个屏蔽词的功能,屏蔽词是保存在配置文件里,最开始是用php数组存储,然后查找. 后来随着屏蔽词的增多,速度明显的变慢了,于是考虑到用redis或mysql做. 于是写了一个测试,测试结果如下 ...

  9. vue项目引入社交分享插件

    vshare 基于百度分享开发的支持VUE2.X的分享插件,为您带来更多的流量!提供多种风格按钮,代码加载更快,引入社会化流量,提升网页抓取速度等优点.github地址:https://github. ...

  10. C语言 · 字符串逆序

    算法训练 字符串逆序   时间限制:1.0s   内存限制:512.0MB      输入一个字符串,长度在100以内,按相反次序输出其中的所有字符. 样例输入 tsinghua 样例输出 auhgn ...