了解javascript中变量及函数的提升

 更新时间:2019年05月27日 12:01:44   作者:可可西里的骄傲  
这篇文章主要介绍了关于javascript中变量及函数的提升,下面和小编来一起学习吧

javascript中变量以及函数的提升,在我们平时的项目中其实还是挺常用的,尤其是大型项目中,不知不觉就会顺手添加一些变量,而有时候自己的不小心就会酿成一些不必要错误,趁有时间整理一下自己对于js中变量及函数提升的理解。

首先,看一个题目:

console.log(a); // undefined
var a = 1;
console.log(a); // 1
console.log(b());
function b(){return 2;} // 2
console.log(c) //报错
let c = 4;
console.log(d()) // 报错 
var d = function(){return 3;} // 报错
(function(){
var m = n = 1;
})()
console.log(m) //报错
console.log(n) // 1

上面的实例对于javascript变量及函数提升的可谓是淋漓尽致...

一、javascript 变量的提升

-函数及变量的声明都将被提升到函数的最顶部

-变量可以在使用后声明,也就是变量可以先使用再声明

敲黑板,划重点,是变量的声明,声明,声明,当变量或函数已经初始化之后,就不会提升到函数的最顶部。这里上面的变量a已经初始化了,所以第一个console取不到变量a得值,为undefined;

注意:变量的提升只会提升到当前作用域下

二、javascript函数的提升

而函数b仅仅是先声明了一个函数方法,函数c是函数表达式无法提升,所以在严格模式下b=2;d报错

对于m,n,这里就涉及到javascript作用域的问题

首先,var m = n = 1的执行顺序是什么?并不是我们大多数人心中所想的连续赋值,javascript的赋值是从右向左的,而是 n=1;var m = n;很好,一目了然,在函数作用域内的变量m=n,n是全局变量,最后严格模式下输出结果,n=1,m报错;

三、关于es6两个关键字——let和const

let 声明的变量只在 let 命令所在的代码块内有效,不存在变量的提升

const 声明一个只读的常量,一旦声明,常量的值就不能改变。一旦声明必须初始化,否则就会报错

来个对比很明显的栗子(完美的体现出let命令只在代码块内有效的意思):

{
let test = 2;
var web = 'font';
}
console.log(test); // 报错
console.log(web); // font

再次回到上面的题目,c就是报错的

ES6 明确规定,代码块内如果存在 let 或者 const,代码块会对这些命令声明的变量从块的开始就形成一个封闭作用域。代码块内,在声明变量 PI 之前使用它会报错。

var PI = "a";
if(true){
console.log(PI); // 报错,即使函数外面全局声明了PI,但在代码块内还是会报错
const PI = "3.1415926";
}

以上,就是关于javascript中变量提升的理解。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 一文教会你从Windows中完全删除node.js

    一文教会你从Windows中完全删除node.js

    作为新手nodejs卸载后安装就总出错,下面这篇文章主要给大家介绍了关于如何从Windows中完全删除node.js的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-08-08
  • 详解nodejs的express如何自动生成项目框架

    详解nodejs的express如何自动生成项目框架

    本篇文章主要介绍了nodejs的express如何自动生成项目框架,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 如何利用node实现静态文件缓存详解

    如何利用node实现静态文件缓存详解

    HTTP 缓存机制作为 Web 应用性能优化的重要手段,对于从事 Web 开发的同学们来说,应该是知识体系的基础环节,也是想要成为前端架构的必备技能,这篇文章主要给大家介绍了关于如何利用node实现静态文件缓存的相关资料,需要的朋友可以参考下
    2021-07-07
  • axios基本用法教程示例详解

    axios基本用法教程示例详解

    这篇文章主要为大家介绍了axios基本用法示例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-05-05
  • 在Linux系统中搭建Node.js开发环境的简单步骤讲解

    在Linux系统中搭建Node.js开发环境的简单步骤讲解

    这篇文章主要介绍了在Linux系统中搭建Node.js开发环境的步骤,Node使得JavaScript程序可以在本地操作系统环境中解释运行,需要的朋友可以参考下
    2016-01-01
  • nodejs连接mysql数据库简单封装示例-mysql模块

    nodejs连接mysql数据库简单封装示例-mysql模块

    本篇文章主要介绍了nodejs连接mysql数据库简单封装(mysql模块),具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
    2017-04-04
  • 使用node.js中的Buffer类处理二进制数据的方法

    使用node.js中的Buffer类处理二进制数据的方法

    大家应该都知道在客户端JavaScript脚本代码中,对二进制数据并没有提供一个很好的支持。然而,在处理TCP流或文件流时,必须要处理二进制数据。因此,下面通过这篇文章来一起看看利用node.js中的Buffer类处理二进制数据的方法,有需要的朋友们可以参考借鉴。
    2016-11-11
  • Lua表达式和控制结构学习笔记

    Lua表达式和控制结构学习笔记

    这篇文章主要介绍了Lua表达式和控制结构学习笔记,本文讲解了算术操作符、关系操作符、逻辑操作符、局部变量与作用域、控制结构等内容,需要的朋友可以参考下
    2014-12-12
  • nodejs抓取notion emoji svg资源的脚本示例

    nodejs抓取notion emoji svg资源的脚本示例

    这篇文章主要为大家介绍了nodejs抓取notion emoji svg资源脚本实现示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-02-02
  • Node绑定全局TraceID的实现方法

    Node绑定全局TraceID的实现方法

    这篇文章主要介绍了Node 绑定全局 TraceID的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-11-11

最新评论