console.log( a );
var a = 2;

执行输出undefined

a = 2;
var a;
console.log( a );

执行输出2

说明:javaScript 运行时在编译器阶段会最先处理var a;也就是变量被提升

foo();
function foo() {
console.log( a ); // undefined var a = 2;
var a = 2;
}

执行输出undefined,执行foo();时找到了函数的声明,但实际代码写在foo()的后面。说明函数声明会被提升,函数作用域里变量也会被提升

foo();
var foo = function bar() {
console.log(a)
var a =2
};

执行输出TypeError: foo is not a function,说明函数表达式不会被提升,foo() 由于对 undefined进行调用抛出TypeError异常

var foo;
foo(); // 1
foo = function() {
console.log( 2 );
};
function foo() {
console.log( 1 );
}

执行输出1,说明虽然函数和变量都能被提升,但是函数声明提升优先于变量声明提升

foo(); // 3
function foo() {
console.log( 1 );
}
var foo = function() {
console.log( 2 );
};
function foo() {
console.log( 3 );
}

执行输出3,后面的函数声明会覆盖前面的函数声明

总结

var 变量声明和函数声明其实跟javaScript运行原理有关,在javaScript运行之前会先进行编译,在编译阶段会先为变量和函数根据作用域规则开辟内存空间并初始化变量为undefined,而函数是初始化函数变量并且直接赋值函数体,以便在执行的时候方便查找和存储。

let , const到底有没有有变量提升?

console.log(a)
let a=2

输出:ReferenceError: Cannot access 'a' before initialization,表明变量没有被定义,不能在变量为初始化之前使用。其实从这句话看来js是找到了变量a的,但a还没有被初始化;这样看来,let其实也有变量提升(在我理解上来说,提升就是先为变量创造内存空间),js 处理let声明变量的过程:

{
let x = 1
x = 2
}

1、查找let声明的变量x,并在作用域中创建变量,不进行初始化

2、执行代码x=1,初始化为1

3、执行x = 2赋值为2

let 特性

let a=2
let a=3
console.log(a)

输出:SyntaxError: Identifier 'a' has already been declared,不能重复定义变量

参考资料

《你不知道的javaScript 上卷》第四章 变量提升

【你不知道的javaScript 上卷 笔记3】javaScript中的声明提升表现的更多相关文章

  1. 你不知道的JavaScript上卷笔记

    你不知道的JavaScript上卷笔记 前言 You don't know JavaScript是github上一个系列文章   初看到这一标题的时候,感觉怎么老外也搞标题党,用这种冲突性比较强的题目 ...

  2. 【你不知道的javaScript 上卷 笔记2】 javaScript 的作用域规则

    一.什么是词法作用域? 词法作用域是在定义词法阶段的作用域,就是由代码变量和作用域块写在哪里决定的,基本上词法分析器在处理代码时会保持作用域不变. 二.词法作用域特点 完全由写代码期间函数所声明的位置 ...

  3. Javascript学习笔记1 javascript的特点

    ..对于网页而言,Javascript无处不在,对于英语不好的人它简直是噩梦般的存在,但形式所逼,今天开始着手学习!希望自己能坚持下去.从什么地方着手,我的目标是从大处着眼,从应用着眼,不抠细节,反正 ...

  4. JavaScript学习笔记(4)——JavaScript语法之变量

    一.变量可以使用短名称(比如 x 和 y),也可以使用描述性更好的名称(比如 age, sum, totalvolume). 变量必须以字母开头 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做 ...

  5. 1.2(JavaScript学习笔记)JavaScript HTML DOM

    一.DOM DOM全称为document object model(文档对象模型). 此处的文档指当前HTML文档,对象指HTML标签. 当网页被加载时,浏览器会创建页面的文档对象模型. 下面结合具体 ...

  6. Javascript学习笔记3 Javascript与BOM简介

    什么是BOM BOM是browser object model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象 ...

  7. 【你不知道的javaScript 上卷 笔记7】javaScript中对象的[[Prototype]]机制

    [[Prototype]]机制 [[Prototype]]是对象内部的隐试属性,指向一个内部的链接,这个链接的作用是:如果在对象上没有找到需要的属性或者方法引用,引擎就 会继续在 [[Prototyp ...

  8. 【你不知道的javaScript 上卷 笔记6】javaScript中的对象相关内容

    一.创建一个对象的语法 var myObj = { key: value // ... };//字面量 var myObj = new Object(); //new myObj.key = valu ...

  9. 【你不知道的javaScript 上卷 笔记5】javaScript中的this词法

    function foo() { console.log( a ); } function bar() { var a = 3; foo(); } var a = 2; bar(); 上面这段代码为什 ...

随机推荐

  1. 使用vscode对threejs的本地调试

    始终坚信阅读和调试结合的方式,才是学习开源的高效方法 一.老版本调试 遥想当年的threejs(使用版本为r75)还没有CommonJS,对于我这个小白可以拿起大刀大杀四方......(咳.咳. 就是 ...

  2. 让$(window).scroll()监听事件只执行一次

    可以用jQuery中的unbind()来进行事件解绑. $(window).scroll(function() { console.log("滚离顶部" + $(document) ...

  3. 邓士鹏【MySql大全】

    禁止使用系统关键字: typename 1.计算两个日期的时间差函数 SELECT TIMESTAMPDIFF(MONTH,'2009-10-01','2009-09-01'); interval可是 ...

  4. c# 读写SerialPort

     SerialDataReceivedEventHandler无反映不要忘记这2属性赋值. serialPort1.DtrEnable = true; serialPort1.RtsEnable = ...

  5. 剑指offer-面试题58_1-翻转单词顺序-字符串

    /* 题目: 输入一个英文句子,翻转单词顺序,但单词内部顺序不变. */ /* 思路: 先翻转整个句子,再将每个单词分别翻转一次. */ #include<iostream> #inclu ...

  6. java 开发中 dom4j的简单用法

    Java中处理XML的方式有很多种,个人任务dom4j还是比较好用的.下面介绍以下简单的使用方法 先把import补充上 import org.dom4j.Document; import org.d ...

  7. css3神奇的圆角边框、阴影框及其图片边框

    css3圆角,建议IE10以上 如果border-radius 单位是百分比,则参考为自身宽高,因此当宽高不一致时,圆角为不规则形状 如果border-radius 为50%,则为椭圆:当宽高一致时, ...

  8. Maven国内镜像配置(阿里云)-sunziren

    <?xml version="1.0" encoding="UTF-8"?> <settings xmlns="http://mav ...

  9. 【Flutter】Demo1一个名字生成器

    根据官网的例子敲的~效果还是很棒的! 首先导入一个第三方包,可以用来随机生成单词组合 在 pubsepec.yaml下添加如下语句 dependencies: flutter: sdk: flutte ...

  10. Win10安装.net2.0/3.0

    Windows 安装.net2.0/3.0 将下列代码拷到本地bat文件中(bat文件和sxs文件夹同级),下载适用的.net安装包版本后放置到sxs文件夹,用管理员权限执行bat文件即可. @ech ...