笔者在这里附上一段代码,请读者思考一下程序的运行结果:

        console.log(a);  //???
a();
var a=3;
function a(){
console.log(10);
}
console.log(a);//???
a=6;

  

  运行结果如下:

  

     console.log(a);  //输出function a(){}
a();
var a=3;
function a(){
console.log(10);
}
console.log(a);//
a=6;

    

不知道读者有没有猜对呢?哈哈,可能很多读者会认为第一行的console.log(a);会输出undefine ,因为大家都知道变量提升与函数提升,而Javascript编译器执行代码也是逐行执

行,当js文件首先加载到内存时,编译器便会对代码执行预编译,将代码中的var 声明与function声明提升到头部,再一行行的去执行代码,那这样的逻辑的话,可能读者会想,既然

变量提升,上面的代码在预编译期间应该首先会提升var a,再提升function a(){}, 等执行console.log(a)的时候,自然输出undefine,没有被定义才对啊。

这里向读者强调一下一个容易被忽视的小问题。,虽然JS预编译期间会对var 和 函数声明提升,但是函数声明提升是优先于变量提升的(也适用于函数字面量声明的情况,这

里不做演示),所以应该是先提升function a(){}.再提升var a,所以第一行输出了function a(){},有没有一种恍然大悟呢?哈哈。

 而console.log(a);这一行为什么输出3而不是6或者function a(){} 呢,我们再回忆一下JS已经将function a(){} 与var a 提升到了头部,首先分析末尾的代码a=6;这行代码编译器

并没有执行到这一行,所以忽略,现在就是纠结到底是3还是function a(){},,而输出结果却告诉我们是3,至于已经声明过的function a(){},去哪里了呢。

 这里为读者解析一下程序的运行状态,在我们预编译阶段function a(){}和var a已经存在于内存中,只是这时var a并没有被赋值,而接下来执行了a(),这里我们要强调一下,

每种语言都有垃圾回收机制,程序中已经用过的函数,当他执行完毕后,便会被当做垃圾回收掉,而a()执行完后 ,便会被回收,而内存里面只剩下了var a; 接下来再执行下一

句var a=3;所以末尾的console.log(a);便输出了3 而不是function a(){}。

   总结:第一、JS预编译阶段函数声明提升优先于变量提升,第二、当函数被使用后,便会被垃圾回收。

   

   

对Javascript到底了解多少,一测便知道的更多相关文章

  1. JavaScript到底是不是单线程

    JavaScript到底是不是单线程 JavaScript引擎 在了解计时器内部运作前,我们必须清楚一点,触发和执行并不是同一概念,计时器的回调函数一定会在指定delay的时间后被触发,但并不一定立即 ...

  2. web前端分享JavaScript到底是什么?特点有哪些?

    web前端分享JavaScript到底是什么?特点有哪些?这也是成为web前端工程师必学的内容.今天为大家分享了这篇关于JavaScript的文章,我们一起来看看. 一.JavaScript是什么? ...

  3. JS转换HTML转义符,防止javascript注入攻击,亲测可用

    function removeHtmlTab(tab) {  return tab.replace(/<[^<>]+?>/g,'');//删除所有HTML标签 } functi ...

  4. JavaScript 开发的 睡眠状况自测(SRSS)

    Javascript 开发睡眠状况自测程序,手记!2019.11.13日... <script>//初始化fbox = new Findpair('fbox','output');fbox ...

  5. 浅谈模块化的JavaScript

    模块化JavaScript之风早已席卷而来, CommonJS . AMD . NodeJS .RequireJS . SeaJS . curljs  等模块化的JavaScript概念及库扑面而来, ...

  6. Unobtrusive JavaScript 是什么?

    Unobtrusive JavaScript 是什么? <!--以下是常规Javascript下写出来的Ajax--><div id="test">< ...

  7. 对JavaScript 引擎基础:Shapes 和 Inline Caches

    全文有5个部分组成 1.JavaScript 引擎工作流程:介绍 JavaScript 引擎的处理流水线,这一部分会涉及到解释器/编译器的内容,且会分点介绍不同引擎间的差别与共同点: 2.JavaSc ...

  8. JavaScript 引擎基础:Shapes 和 Inline Caches

    JavaScript 引擎基础:Shapes 和 Inline Caches hijiangtao ​ 中国科学院大学 计算机应用技术硕士 260 人赞同了该文章 前言:本文也可以被称做 “JavaS ...

  9. 深入理解JavaScript系列:JavaScript的构成

    此篇文章不是干货类型,也算不上概念阐述,就是简单的进行一个思路上的整理. 要了解一样东西或者完成一件事情,首要的就是先要搞清楚他是什么.作为一个前端开发人员,JavaScript应该算作是最核心之一的 ...

随机推荐

  1. java 数据类型间的转换

    byte a = (byte)129; 129已经超过了byte数据类型的存储上限,所以需要在值的前面加括号需要转换的数据类型名. 但是从高往低转的时候数值精度会有丢失; 所以最后结果为 a = -1 ...

  2. Cannot declare class app\home\controller\Cases because the name is already in use

    Cannot declare class app\home\controller\Cases because the name is already in use 命名空间冲突了 use 模型类的时候 ...

  3. 关于MacOS升级10.13系统eclipse菜单灰色无法使用解决方案

    最近,苹果发布了macOS High Sierra,版本为10.13,专门针对mac pro的用户来着,至于好处大家到苹果官网看便是,我就是一个升级新版本系统的受益者,同时也变成了一个受害者:打开ec ...

  4. oracle01

    01-基本的查询语句 A:一些命令 sqlplus sys/sys@192.168.22.220:1521/orcl as sysdba; conn scott/123456@192.168.22.2 ...

  5. mybatis实战教程三:mybatis和springmvc整合

    一.搭建maven环境,引入相关jar 参考demo 二.写web.xml <?xml version="1.0" encoding="UTF-8"?&g ...

  6. 基于esp8266的智能台灯DIY

    研究esp8266已经很久了,特制作了一个智能灯, 代码如下,总结几点 一.关于arduino pro mini 的烧写方法 一定要在编译成功之后的下载提示出现的瞬间,单击复位按钮.才可进入烧写 二. ...

  7. python3 第十一章 - 数据类型之str(字符串)

    字符串是 Python 中最常用的数据类型,我们可以使用引号 ' 或 " 来创建字符串,例如: name = 'roy' sex = "男" 1.访问字符串中的值 Pyt ...

  8. synchronized内存可见性理解

    一.背景 最近在看<Java并发编程实战>这本书,看到共享变量的可见性,其中说到"加锁的含义不仅仅局限于互斥行为,还包括内存可见性". 我对于内存可见性第一反应是vol ...

  9. 国家语言,语言代码,locale id对应表

    国家语言,语言代码,locale id对应表.比如 en_US对应的id为1033, 中文的locale=zh_CN,id=2052. Locale Languagecode LCIDstring L ...

  10. php微信扫码支付

    一 概述 扫码支付是商户系统按微信支付协议生成支付二维码,用户再用微信"扫一扫"完成支付的模式.该模式适用于PC网站支付.实体店单品或订单支付.媒体广告支付等场景.前几天公司需要做 ...