Javascript函数声明与函数表达式的区别

在定义函数时,我们一般使用下面这两种方法:

Js中的函数声明是指下面的形式:

     
function functionName(){ 
 

 

这样的方式来声明一个函数,而函数表达式则是类似表达式那样来声明一个函数,如:

var functionName = function(){ 

 

可能很多朋友在看到这两一种写法时会产生疑惑,这两种写法差不多,在应用中貌似也都是可行的,那他们有什么差别呢?

使用函数声明定义:

function  sum (a, b) {
    return a + b;
}

使用函数表达式定义:

var sum = function (a, b) {
    return a + b;
}

调用方法都是一样的:

如求“1+1”等于几:

alert(sum(1, 1));

但这两种方法还是有区别的。解析器在向执行环境中加载数据时,对函数声明和函数表达式并非一视同仁。解析器会率先读取函数声明,并使其在执行任何代码之前可用;而函数表达式,则必须等到解析器执行到它所在的代码行,才会真正被解释执行。

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

示例:

alert(sum(1, 1));
function  sum (a, b) {
    return a + b;
}

以上代码可以正常执行。因为在代码执行之前,解析器就已经通过一个名为函数声明提升的过程,读取并将函数声明添加到执行环境中。在对代码求值时,Javascript引擎在第一遍会声明函数并将它们放到源代码树的顶部。所以,即使声明函数的代码放到了调用它的代码的后面,Javascript引擎也能把函数声明提升到顶部。如果像下面例子所示,把上面的函数声明改为函数表达式,就会在执行期间导致错误。

alert(sum(1, 1));
var sum = function (a, b) {
    return a + b;
}

以上代码之所以会在执行期间产生错误,原因在于函数位于一个初始化语句中,而不是一个函数声明。换句话说,在执行到函数所在的语句之前,变量sum不会保存有对函数的引用,并且第一行代码已经产生错误,也就不会执行到下一行。

总体来说,除了什么时候可以通过变量访问函数这一点区别之外,函数声明与函数表达式的语法其实是等价的

时间: 2024-09-25 06:47:50

Javascript函数声明与函数表达式的区别的相关文章

JavaScript中的函数声明和函数表达式区别浅析

 这篇文章主要介绍了JavaScript中的函数声明和函数表达式区别浅析,本文总结的浅显易懂,非常好的一篇技术文章,需要的朋友可以参考下     记得在面试腾讯实习生的时候,面试官问了我这样一道问题. 代码如下: //下述两种声明方式有什么不同 function foo(){}; var bar = function foo(){};   当初只知道两种声明方式一个是函数声明一个是函数表达式,具体有什么不同没能说得很好.最近正好看到这方面的书籍,就想好好总结一番. 在ECMAScript中,有两

浅析javascript中函数声明和函数表达式的区别

这篇文章主要介绍了浅析javascript中函数声明和函数表达式的区别,需要的朋友可以参考下     javascript中声明函数的方法有两种:函数声明式和函数表达式. 区别如下: 1).以函数声明的方法定义的函数,函数名是必须的,而函数表达式的函数名是可选的. 2).以函数声明的方法定义的函数,函数可以在函数声明之前调用,而函数表达式的函数只能在声明之后调用. 3).以函数声明的方法定义的函数并不是真正的声明,它们仅仅可以出现在全局中,或者嵌套在其他的函数中,但是它们不能出现在循环,条件或者

JavaScript中函数声明与函数表达式的区别详解_javascript技巧

前言 在ECMAScript中,有两个最常用的创建函数对象的方法,即使用函数表达式或者使用函数声明.对此,ECMAScript规范明确了一点,即是,即函数声明 必须始终带有一个标识符(Identifier),也就是我们所说的函数名,而函数表达式则可以省略.下面看看这两者的详细区别介绍. 什么是 Function Declaration(函数声明)? Function Declaration 可以定义命名的函数变量,而无需给变量赋值.Function Declaration 是一种独立的结构,不能

Javascript中函数声明与函数表达式的区别

Js中的函数声明是指下面的形式: function functionName(){ } 这样的方式来声明一个函数,而函数表达式则是类似表达式那样来声明一个函数,如: var functionName = function(){ } 可能很多朋友在看到这两一种写法时会产生疑惑,这两种写法差不多,在应用中貌似也都是可行的,那他们有什么差别呢? 事实上,js的解析器对函数声明与函数表达式并不是一视同仁地对待的.对于函数声明,js解析器会优先读取,确保在所有代码执行之前声明已经被解析,而函数表达式,如同

JavaScript中的函数声明和函数表达式区别浅析_javascript技巧

记得在面试腾讯实习生的时候,面试官问了我这样一道问题. 复制代码 代码如下: //下述两种声明方式有什么不同   function foo(){};   var bar = function foo(){}; 当初只知道两种声明方式一个是函数声明一个是函数表达式,具体有什么不同没能说得很好.最近正好看到这方面的书籍,就想好好总结一番. 在ECMAScript中,有两个最常用的创建函数对象的方法,即使用函数表达式或者使用函数声明.对此,ECMAScript规范明确了一点,即是,即函数声明 必须始终

javascript 函数声明与函数表达式的区别介绍_javascript技巧

还是一样,先上代码: 复制代码 代码如下: <script> var f = function g() { return 1; }; if (false) { f = function g(){ return 2; }; } alert(g()); // 2 </script> 把这段代码扔到IE 6 里面和chorme里面是完全不同的两种效果. 这里输出2 是在ie6里面的效果,如果在chorme会出现g没有定义. 这也算是JScript的bug吧. 在这里很明显,这里的只是定义

详解JavaScript中的函数声明和函数表达式_java

JavaScript 中需要创建函数的话,有两种方法:函数声明.函数表达式,各自写法如下: // 方法一:函数声明 function foo() {} // 方法二:函数表达式 var foo = function () {}; 另外还有一种自执行函数表达式,主要用于创建一个新的作用域,在此作用域内声明的变量不会和其它作用域内的变量冲突或混淆,大多是以匿名函数方式存在,且立即自动执行: (function () { // var x = ... })(); 此种自执行函数表达式归类于以上两种方法

Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式_基础知识

函数声明 function foo() {} 函数 foo 将会在整个程序执行前被 hoist (提升),因此它在定义 foo 函数的整个 scope (作用域)中都是可用的.即使在函数定义之前调用它也没问题. foo(); // Works because foo was created before this code runs function foo() {} 因为我打算专门写篇介绍作用域的文章,所以这里就不详述了. 函数表达式 对于函数声明,函数的名称是必须的,而对于函数表达式而言则是

Javascript中的函数声明与函数表达式(奇技淫巧)_javascript技巧

举一个例子: [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 试一下就知道这段代码的意思就是声明一个函数,然后立刻执行,因为Javascript中的变量作用域是基于函数的,所以这样可以避免变量污染,但这里的位运算符"~"乍一看让人摸不到头脑,如果去掉它再运行则会报错:SyntaxError. 在阐述为什么之前,让我们先来明确Javascript中的两个概念:函数声明和函数表达式: 先来看看什么样的是函数声明: [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 再来