当前位置:  首页  >  前端开发  >  JavaScript

JavaScript中声明提升的介绍(代码示例)

本篇文章给大家带来的内容是关于JavaScript中声明提升的介绍(代码示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

本篇文章给大家带来的内容是关于JavaScript中声明提升的介绍(代码示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

一、概述

JS 中,我们会理所当然地认为代码是一句一句地执行的,但并不完全正确。

singer = "周杰伦";
var singer; 
console.log(singer); // 周杰伦

sing();  // 故事的小黄花
function sing() {
   console.log("故事的小黄花");
}

以上第一段代码,如果按照正常流程,后面的 var singer会重新把值默认声明为 undefined,但结果却是 '周杰伦';

以上第二段代码,会理解成,先执行,后声明,就会报错,但结果却没有。

以上代码块其实是可以改写成这样的:

var singer = undefined;
singer = "周杰伦";
console.log(singer); // 周杰伦
function sing() {
   console.log("故事的小黄花");
}
sing();  // 故事的小黄花

这是因为:

JS 定义声明会在编译阶段进行,赋值和其他操作则是在执行阶段进行。

所以,先有声明,再有赋值和执行,这就是变量和函数的声明提升。

二、函数声明优先于变量声明;

var foo = "bar";
function foo() {
   
}
typeOf(foo);  // string

var foo = "bar";
function foo() {
   
}
typeOf(foo);  // string

无论函数声明放在变量声明前,还是后,变量声明都覆盖了函数声明。

三、每个域都会进行声明提升

以下代码会输出 10,是为什么呢?

var foo = 1;
function bar() {
   if (!foo) {
       var foo = 10;
   }
   alert(foo);
}
bar();

因为:

每个域都会进行声明提升。

上面代码相当于:

var foo = 1;
function bar() {
   var foo = undefined;
   if (!foo) { // !foo === true
       var foo = 10;
   }
   alert(foo);
}
bar();

四、函数表达式不会声明提升

首先,什么是函数表达式?

// 函数声明
function foo() {
   console.log("函数声明");
}

// 函数表达式
var foo = function() {
   console.log("函数表达式");
}

函数表达式,不会声明提升,所以:

foo();  // Uncaught TypeError: foo is not a function

// 函数表达式
var foo = function() {
   console.log("函数表达式");
}

总结

JavaScript 中存在一种声明提升的机制,有变量声明和函数声明。JS 引擎会在编译阶段查找每个作用域的声明,而赋值和运算则在执行时进行。

函数定义分为函数声明和函数表达式,其中,函数声明有声明提升,函数表达式则没有。

以上就是JavaScript中声明提升的介绍(代码示例)的详细内容,更多请关注 第一PHP社区 其它相关文章!

吐了个 "CAO" !
扫码关注 PHP1 官方微信号
PHP1.CN | 中国最专业的PHP中文社区 | json解析格式化 | PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved PHP1.CN 第一PHP社区 版权所有 京ICP备19059560号-4