javascript - 请问下面这两种函数调用方式有什么区别的-PHP中文网问答

讲师中心微信公众号

首页

文章

后端开发 web前端数据库开发工具 php框架常见问题人工智能 Java 系统教程电脑教程硬件教程手机教程软件教程游戏教程自媒体新闻

专题

后端开发 web前端数据库开发工具 php框架人工智能 Java 系统教程电脑教程硬件教程手机教程软件教程游戏教程新闻

AI工具

AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 AI 提示词

学习

大前端后端开发数据库移动端运维开发计算机基础

编程手册

大前端后端开发数据库移动端运维开发计算机基础

下载

js特效网站源码工具下载类库下载网站素材学习资源插件扩展手机游戏

最近更新

javascript - 请问下面这两种函数调用方式有什么区别的

大家讲道理 2017-04-10 17:41:52

[JavaScript讨论组]

504

都可以弹出alert，但是上面那个在控制台输出了undefined，是怎么回事？

-----update-----
多谢大家的耐心解答，起初我的疑惑就是foo这个对象定义的先后顺序问题，因为使用非hoisted的函数定义方式在chrome的控制台中仍然可以正常运行而没有报TypeError。后来我新建文件之后再测试是完全没问题的。所以这里导致困惑的主要就是chrome对undefined输出的解释了。再次感谢@BetaRabbit

大家讲道理

光阴似箭催人老，日月如移越少年。

全部回复(4)

怪我咯2017-04-10 17:43:52 4楼

所有声明变量或声明函数都会被提升到当前函数的顶部。MDN链接地址

foo();
function foo() {
    alert(111);
}
//相当于
function foo() {
    alert(111);
}
foo();


//但是另外一个
foo();
var foo = function() {
    alert(111);
}
//相当于
var foo;
foo();
foo = function() {
    alert(111);
}


//Function declarations in JavaScript are hoisting the function definition. 
//你可以在函数声明之前使用函数:

hoisted(); // logs "foo"

function hoisted() {
  console.log("foo");
}
     
//注意 function expressions 不会提升:

notHoisted(); // TypeError: notHoisted is not a function

var notHoisted = function() {
   console.log("bar");
};

赞 +0

添加回复

ringa_lee2017-04-10 17:43:52 3楼

foo();
var foo=function(){
...
}

变量foo提升到顶部

等价为==>

var foo;
foo();
foo=function(){
}

会执行报错 TypeError: foo is not a function. (In 'foo()', 'foo' is undefined)

你说的执行输出了undefined,要看下之前的代码是什么样的！
是不是之前已经定义过foo函数了

function foo(){
}

而对于

foo();
function foo(){
....
}

函数foo声明提升到顶部
等价为

function foo(){
....
}
foo();

执行正常~~~

赞 +0

添加回复

巴扎黑2017-04-10 17:43:52 2楼

变量定义提升与函数声明提升

赞 +0

添加回复

黄舟2017-04-10 17:43:52 1楼

用function关键字声明的函数，会有一个函数声明提升的过程，所以你可以在声明函数之前进行调用。如果使用函数表达式来定义函数，只能在定义之后来调用，原因在于会存在一个变量声明提升。

//2. 报错，TypeError: foo is not a function
foo();
//1.在该执行环境下，声明的所有变量比如foo会被提升到顶部而未执行赋值语句，所以此时foo值为undefined而并非函数的引用。
var foo = function () {
    alert('hello world!');
}

赞 +0

添加回复

专题推荐

更多>

热门话题

热门教程

更多>