一、var 声明

ES6之前,js 中声明变量基本上用 var 关键字;

1、如果访问未声明的变量,会报错:ReferenceError

2、声明了未赋值,值为 undefined,跟前面的报错是两回事,虽然信息看起来像;

3、对于没有声明的变量可以直接赋值,不过这是一个非常不好的习惯;

而用 var 声明的全局变量,作为全局对象的属性,是不可配置的;

4、重复声明等价于赋值语句;

JavaScript从来不会告诉你是否多次声明了同一个变量;遇到这种情况,它只会对后续的声明视而不见(不过,它会执行后续声明中的变量初始化)。

5、声明提前(hoisting)

由于变量声明(以及其他声明)总是在任意代码执行之前处理的,所以在代码中的任意位置声明变量总是等效于在代码开头声明。这意味着变量可以在声明之前使用,这个行为叫做“hoisting”。“hoisting”就像是把所有的变量声明移动到函数或者全局代码的开头位置,但是 var 的赋值操作保留在原处。

声明原理:var 声明在代码执行之前,被提升到所在函数或全局环境的顶部,仅仅是声明提前,不涉及赋值操作;

总结:

  在 var 声明的函数或全局环境访问:在赋值操作之前访问,返回 undefined,不报错;在赋值操作之后访问,返回实际值,不报错;

  在 var 声明的函数或全局环境访问,报错,除非闭包;

举例:

实际上等价于:

更多例子:戳 MDN

二、let,const 声明

书上说没有声明提前,这样理解也没有问题,所以直接看 三 吧;

但是我的总结是可能有声明提前:

  1、在声明的函数或全局环境访问:

    在声明的代码块之访问:声明的位置之前访问(即使是使用 typeof),会报错(官方称”暂时性死区”);声明的位置之后访问,返回实际值;

    在声明的代码块之访问:报错(但使用 typeof 操作符不报错,返回不正确,可能为 undefined,与上述相比,证明了可能有声明提前);

  2、在声明的函数或全局环境访问,报错,除非闭包;

  证明可能有声明提前的代码:

function f() {
console.log(typeof a);
if (true) {
let a = 0;
}
}
f();//undefined

  下面代码报错:

function f() {
if (true) {
console.log(typeof a);
let a = 0;
}
}
f();//ReferenceError: a is not defined

  下面不报错:

function f() {
if (true) {
console.log(typeof b);
let a = 0;
}
}
f();//undefined

三、函数声明语句(不是函数表达式)

声明提前原理:函数声明语句在代码执行之前,被提升到所在函数或全局环境的顶部;

总结:

  在声明的函数或全局环境访问:都返回实际值;

  在声明的函数或全局环境访问,报错,除非闭包;

实际上是跟 var 一样声明提升了,不同的是:函数整体提升,不仅仅是声明提升,而且没有块级绑定(ES6 严格模式下会有);

参考资料:

JavaScript权威指南-第6版

JavaScript高级程序设计-第3版

深入理解ES6-中

js 中的变量声明提前总结的更多相关文章

  1. Js中有关变量声明和函数声明提升的问题

    在ECMAScript5中没有块级作用域一说,只有函数作用域和全局作用域,在其中声明的变量和函数和其他语言的展现形式不同,在某些情况下不一定需要先定义后使用,函数和变量的使用可以在其声明之前,这到底是 ...

  2. [JavaScript]JS中的变量声明与有效域

    1.变量声明 var a = 1; //使用var声明变量 b = 1; //不使用var 第一种情况,在当前域中声明一个名为a的变量,如果实在方法内则为局部变量,若在最外层声明则a为全局变量. 第二 ...

  3. js函数中变量声明提前

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. js中变量声明提前

    demo1: var a=10; function b(){alert(a); var a=20; alert(a)} b()//undefined 20 因为:js编译器在执行b这个函数时,会把函数 ...

  5. 【JS点滴】声明提前,变量声明提前,函数声明提前,声明提前的先后顺序

    声明提前,函数声明提前,好吧,老生常谈的问题了.正好,前些天在掘金看到一道关于声明提前的笔试题,那么这里就以这道题来作为本文的引子吧,代码如下: console.log(a)//? a();//? ; ...

  6. JavaScript变量声明提前

    上周四吃完午饭,leader发了一道JavaScript的题目给我们做,我们Team里面有做前端的,有做后台的,也有做mobile web的,所以大家对题目的理解各自都不一样,然后在QQ讨论组里面进行 ...

  7. js中的变量提升(hoisting)

    来看如下代码: function HelloJS(){ var array = [1,2,3,4,5]; for(var i in array){ } alert(i); } HelloJS(); a ...

  8. Javascript开发技巧(JS中的变量、运算符、分支结构、循环结构)

    一.Js简介和入门 继续跟进JS开发的相关教程. <!-- [使用JS的三种方式] 1.HTML标签中内嵌JS(不提倡使用): 示例:<button onclick="javas ...

  9. JavaScript 基础——使用js的三种方式,js中的变量,js中的输出语句,js中的运算符;js中的分支结构

    JavaScript 1.是什么:基于浏览器 基于(面向)对象 事件驱动 脚本语言 2.作用:表单验证,减轻服务器压力 添加野面动画效果 动态更改页面内容 Ajax网络请求 () 3.组成部分:ECM ...

随机推荐

  1. vue组件调用(用npm安装)

    vue用webpack打包方式新建项目,注意刚开始可以先关闭路由和代码错误检测功能 1.建立了一个Hi.vue的组件 <template> <div>Hi~~{{msg}}-- ...

  2. [Informix] unload load

    select tabname from systables where tabname  like 'aa%' select * from syscolumns where tabname like ...

  3. HTML中css和js链接中的版本号

    背景 在搜索引擎中搜索关键字.htaccess 缓存,你可以搜索到很多关于设置网站文件缓存的教程,通过设置可以将css.js等不太经常更新的文件缓存在浏览器端,这样访客每次访问你的网站的时候, 浏览器 ...

  4. Atitit. 最佳实践 QA----降低cpu占有率--cpu占用太高怎么办

    Atitit. 最佳实践 QA----降低cpu占有率--cpu占用太高怎么办 跟个磁盘队列长度雅十,一到李80%走不行兰.... 1. 寻找线程too 多的.关闭... Taskman>> ...

  5. Atitit.多媒体区----web视频格式的选择总结

    Atitit.多媒体区----web视频格式的选择总结 1. 因为现阶段不同的浏览器支持的视频格式是不同的 1 2. 各浏览器Html5 Video支持的影音格式: 2 3. 解决方案是什么?Flas ...

  6. gzexe加密 脚本

    sh-4.1# vi GZEXE.sh sh-4.1# cat GZEXE.sh #!/bin/bash echo "gzexe加密实验!!!" >> Cgzexe.l ...

  7. Secure REST API with oauth2 (翻译)

    http://blog.csdn.net/haiyan_qi/article/details/52384734 ******************************************** ...

  8. 由于link顺序错误导致的undefined reference

    其实我之前就遇到过这个问题,也强调过,GNU-G++在link阶段是依赖输入的.o或者.a文件的顺序的.如果顺序错误会导致undefined reference错误 见这篇随笔:http://www. ...

  9. 为女票写的计算工作时间的SQL(二)

    将非工作时间.非工作日.节假日去掉,计算工作时间,如下: 一.实现 -- 节假日表 CREATE TABLE Holiday ( id ) NOT NULL, DATE ), flag ) , PRI ...

  10. C语言 · 最大乘积

      算法提高 最大乘积   时间限制:1.0s   内存限制:512.0MB      问题描述 对于n个数,从中取出m个数,如何取使得这m个数的乘积最大呢? 输入格式 第一行一个数表示数据组数 每组 ...