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

hello,沐晴又来更新啦,今天呢,跟大家讲讲让人头疼的函数表达式和函数声明,反正我当初看那本高级程序的时候,是没怎么看太透,哈哈。我是个比较重基础的人,跟我一起探讨函数表达式和函数声明的世界吧。

首先呢,先看看他们的颜值:

  函数声明:function 函数名(){}

  函数表达式:function 函数名(可写可不写)(){};

(不写名叫做匿名函数表达式。写名叫做命名函数表达式。推荐用匿名的。)

这么一看长的好像没啥区别,反正颜值也都不高。那么我们如何区别是函数表达式还是函数声明呢?答案就是看上下文,何谓上下文,你懂的,就像语文作文里面的上下文。

函数声明:function aaa(){} (这种就是函数声明,上下文啥也木有。)

函数表达式
var a = function aaa(){} : 命名函数表达式
var a = function (){} :匿名函数表达式
(function aaa(){}) : 表达式
位运算符:
~funtion aaa(){} : 表达式
-funtion aaa(){} : 表达式
+funtion aaa(){} : 表达式
!funtion aaa(){} : 表达式

(有上面的这些表现形式的都是函数表达式)

OK,看了表现上的不一样,我们已经知道如何区别他们了,下面就来了解一下他们真正在使用上的区别

1 函数表达式可以直接后面加括号执行 而函数声明是不可以。

function aaa(){}(); // 不可以执行。必须得通过函数名调用 aaa();
var a = function aaa(){} (); // 加括号就可以直接执行

2 函数声明可以提前被解析出来。表达式不可以。

比如,只要你声明过函数,不管函数是在哪个位置声明的,它都会被提前解析出来,所以在任何地方调用都不会有问题。但是函数表达式不会被提前解析,所以你能在函数表达式之前就调用它。(关于解析机制,下篇我会认真的写出来分享给大家。)

aaa(); //可以调用

a(); //调用会出错

function aaa(){}; // 函数声明
var a = function aaa(){}; // 函数表达式

主要的就是这两方面的区别,相对于函数声明,表达式可以让我们不用费劲想那么多函数名,代码也更简单,等到我写闭包的时候,会体现它的优点。

好的,今天的探讨就到这里了,如有错误,欢迎指正。我是沐晴。下篇不见不散。

时间: 2024-12-10 11:57:47

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

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

我们已经知道,在任意代码片段外部添加包装函数,可以将内部的变量和函数定义"隐 藏"起来,外部作用域无法访问包装函数内部的任何内容. 例如: var a = 2; function foo() { // <-- 添加这一行 var a = 3; console.log( a ); // 3 } // <-- 以及这一行 foo(); // <-- 以及这一行 console.log( a ); // 2 虽然这种技术可以解决一些问题,但是它并不理想,因为会导致一些额外的

JS中的几种函数

函数可以说是js中最具特色的地方,在这里我将分享一下有关函数的相关知识: 包装函数:        (function foo(){...})作为函数表达式意味着foo只能在...所代表的位置中被访问,外部作用域则不行 (function foo(){...})()        第一个()将函数变成表达式,第二个()执行了这个函数,这种模式代表立即执行函数表达式   包装函数的声明以(function...而不是function开始,函数会被当作函数表达式而不是一个标准的函数声明来处理    

js中(function(){…})()立即执行函数写法理解

javascript和其他编程语言相比比较随意,所以javascript代码中充满各种奇葩的写法,有时雾里看花,当然,能理解各型各色的写法也是对javascript语言特性更进一步的深入理解. ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因并非如此.要理解立即执行函数,需要先理解一些函数的基本概念.

函数表达式和函数声明~(自己的记录)

在ECMAScript中,创建函数的最常用的两个方法是函数表达式和函数声明,两者期间的区别是有点晕,ECMA的规范明确了一点~函数声明必须带有标示符 (Identifier)就是大家说的(函数名),而函数表达式则可以省略函数名. 那么没有函数名那肯定就是函数表达式了,那么有函数名时,如何区分它是函数表达式还是函数声明呢~~如果是作为赋值表达式的一部分则为函数表达式,如果是包含在一个函数体内,或者位于程序的最顶部的话则作为函数声明~ function foo(){} // 声明,因为它是程序的一部

为什么if else 语句里不能用函数声明定义函数,而可以用函数表达式定义函数

在<JavaScript高级程序设计>第三版第7章函数表达式部分讲到,定义函数有两种方式:一种是函数声明,另一种就是函数表达式.函数声明的语法是这样的.function functionName(arg0, arg1, arg2) {//函数体} 关于函数声明,它的一个重要特征就是函数声明提升( function declaration hoisting),意思是在执行代码之前会先读取函数声明.这就意味着可以把函数声明放在调用它的语句后面.sayHi();function sayHi(){al

变量声明置顶规则、函数声明及函数表达式和函数的arguments属性初始化

一.变量声明和变量赋值: if (!("a" in window)) { var a = 1; } alert(a);//a为? 你可能认为alert出来的结果是1,然后实际结果是"undefined".要了解为什么,我们需要知道JavaScript里的3个概念: 1.所有的全局变量都是window的属性,语句 var a = 1;等价于window.a = 1; 可以用如下方式来检测全局变量是否声明: "变量名称" in window 2.声明

JS中的自执行函数

本来规划的是2013年,狠狠的将JS学习下,谁知计划赶不上变化,计划泡汤了.13年的我对JS来说可以说是属于跟风,对它的理解和认识也仅仅是皮毛而已,也是因为要完成<ArcGIS API for JavaScipt开发教程>而临阵磨枪. 在接触JS一段时间后,觉得还是比较灵活的,灵活的前提是要更深入的了解,就像两个陌生的人,相处的时间长了,了解的时间长了,难免会产生感情一样.对于JS也开始产生了感情,这种感情体现在工作中,体现在周围的环境中. 目前很多开发者纷纷加入JS的阵营,看来这已经不是跟风

JS中构造函数与普通函数的区别及JS构造函数、原型和实例的关系

JS中构造函数与普通函数的区别: https://www.cnblogs.com/cindy79/p/7245566.html JS构造函数.原型和实例的关系: https://blog.csdn.net/u012443286/article/details/78823955 JavaScript构造函数及原型对象: https://blog.csdn.net/a153375250/article/details/51083245 原文地址:https://www.cnblogs.com/jim

JS中apply()与call()的含义与区别

JavaScript中,apply()与call()的含义一样,均为改变调用函数中的this指向.其中apply()与call()的第一个参数表示所要指向的对象,若调用函数无参数可不写,则默认为window.第一个参数后的参数表示调用函数的参数,其中apply()第一个参数后面的参数为一个数组,call()第一个参数后面为0或多个参数. 例: 1 window.x = 100; 2 3 4 var obj = {}; 5 obj.x = 1; 6 obj.test = function(a) {