学弟的一张图,让我重学了一遍函数声明和函数表达式!

简介: 首先我们要知道,当函数声明与变量命名冲突的时候,要保持着**函数声明优先的原则**

前言

今天下午,在我们微信群里,学弟突然发出来这样一个图:
image.png

我点开一看,这不是函数声明跟函数表达式的知识点吗?前一阵子还看过相关文章。

看了几眼,我说到:第一个输出应该是最后的函数声明

然后呢? 没有然后了,真的,犹豫代表着此时的我不会。

看来卷的还不够!

先贴上答案,如果你跟我一样犹豫不决,不知道结果,那么跟我一起再次学习一遍吧。

image.png

开始复习

首先,确定问题:函数表达式和函数声明的区别,以及困扰住我们的优先问题

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

函数声明

首先我们要知道,当函数声明与变量命名冲突的时候,要保持着函数声明优先的原则

fn();
function fn () {
    console.log(‘fn’);
}
var fn = 2;

例如这样,不会报错,会输出fn。

如果你不知道为什么调用函数可以在函数声明之前,看这里

是因为javascript代码是一段一段预载的,在一段代码预载完成后,会把函数声明提前到代码段的前面执行,以便在代码段的任何地方调用,所以前面的代码无错

那么,多个同名的函数声明,会如何呢?我们接着来看一下

fn();
function fn () {
    console.log(‘1’);
}
function fn () {
    console.log(‘2’);
}

输出结果为2。这是因为有多个函数声明的时候,是由最后的函数声明来替代前面的

这也是我上文中读了几眼代码直接说第一个输出为最后的函数声明的原因!

函数表达式

fn();
var fn = function () {
    console.log('fn');
}

有用过的同学可能看到这里,说我知道,完后写出了上面这段代码,但其实这段代码是不对的,会爆出fn is not a function这个错误。

这是什么原因呢?这其实就是函数声明和函数表达式的区别之一

因为函数表达式相当于把一个函数当做值,赋予一个变量,而这个变量在未声明的时候,是不能使用的

正确的函数表达式:

var fn = function () {
    console.log('fn');
}
fn();

复习回来,再战!

先把代码贴出来方便阅读:

// 下面的代码输出什么
function method(foo){
    console.log(foo)
    var foo = 'A'
    var foo = function () {
        console.log('B')
    }
    foo()
    function foo() {
        console.log('C')
    }
    foo()
}
var foo = 1
method(foo)

经过了上面的复习,我们知道,JavaScript会将函数声明提前,所以我们来整理一下这段代码:

function method(foo){
    function foo() {
        console.log('C')
    }
    console.log(foo)
    var foo = 'A'
    var foo = function () {
        console.log('B')
    }
    foo()
    foo()
}
var foo = 1
method(foo)

现在,再利用我们刚刚学的知识,来分析打印的都是什么数据:

首先,第一个打印的是我们输出C的foo函数,第二个和第三个调用foo函数的时候,函数表达式的变量已经声明了!所以函数发生了覆盖,现在的foo函数已经是输出B的foo函数了。

现在让我们来整理一下结果:

function foo() {
    console.log('C')
}
B
B

你学会了吗?没学会快去看看相关知识点!

最后

但是犹豫就是不会,不能拿曾经学过当做借口,把遇到的每一个自己不会的问题弄懂,才能逐渐让自己变得更强!

相关文章
|
7月前
高等数学II-知识点(1)——原函数的概念、不定积分、求原函数的两种常用方法 (凑微分法、第二换元法)、分部积分法、有理函数原函数求法、典型三角函数原函数求法
高等数学II-知识点(1)——原函数的概念、不定积分、求原函数的两种常用方法 (凑微分法、第二换元法)、分部积分法、有理函数原函数求法、典型三角函数原函数求法
230 1
|
8月前
|
算法 C语言 C++
万字详解:C语言三子棋进阶 + N子棋递归动态判断输赢(一)
三子棋游戏设计的核心是对二维数组的把握和运用。
103 1
|
8月前
|
C语言
万字详解:C语言三子棋进阶 + N子棋递归动态判断输赢(二)
我们可以通过创建并定义符号常量NUMBER,来作为判断是否胜利的标准。如三子棋中,令NUMBER为3,则这八个方向中有任意一个方向达成3子连珠,则连珠的这个棋子所代表的玩家获胜。
86 1
超详细三子棋讲解,体会分模块写法(上)
超详细三子棋讲解,体会分模块写法(上)
超详细三子棋讲解,体会分模块写法(下)
超详细三子棋讲解,体会分模块写法(下)
|
存储 编译器 C语言
2023-3-9-一篇简短的文章把C++左右值关系讲的透透彻彻
2023-3-9-一篇简短的文章把C++左右值关系讲的透透彻彻
133 0
|
C语言
【c语言进阶】三分钟教会你终极套娃:指向函数指针数组的指针,让你真正理解如何解读一个变量的类型
【c语言进阶】三分钟教会你终极套娃:指向函数指针数组的指针,让你真正理解如何解读一个变量的类型
105 0
|
存储 安全 程序员
回忆曾经学过的函数
函数的参数 形参指的是:在函数原型或定义及 catch 语句的参数列表中被声明的对象或指针、宏定义中的参数、模板定义中的类型参数等。 实参指的是:函数调用语句中以逗号分隔的参数列表中的表达式、宏调用语句中以逗号分隔的列表中一个或多个预处理标识符的序列、throw 语句的操作数、表达式的操作数、模板实例化时的实际类型参数等
|
程序员 C语言 C++
一文搞定C语言函数和函数递归(和bug郭一起学C系列)(1)
一文搞定C语言函数和函数递归(和bug郭一起学C系列)(1)
125 0
一文搞定C语言函数和函数递归(和bug郭一起学C系列)(1)
使用 Lambda 表达式的正确姿势,写得太好了叭
Lambda 表达式非常方便,在项目中一般在 stream 编程中用得比较多。 List<Student> studentList = gen(); Map<String, Student> map = studentList .stream() .collect(Collectors.toMap(Student::getId, a -> a, (a, b) -> a)); 理解一个 Lambda 表达式就三步: 1. 确认 Lambda 表达式的类型 2. 找到要实现的方法 3. 实现这个方法 就这三步,没其他的了。而每一步,都非常非常简单,以至于我分别展开讲一下,你就懂了。

热门文章

最新文章