对Javascript到底了解多少,一测便知道
笔者在这里附上一段代码,请读者思考一下程序的运行结果:
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到底了解多少,一测便知道的更多相关文章
- JavaScript到底是不是单线程
JavaScript到底是不是单线程 JavaScript引擎 在了解计时器内部运作前,我们必须清楚一点,触发和执行并不是同一概念,计时器的回调函数一定会在指定delay的时间后被触发,但并不一定立即 ...
- web前端分享JavaScript到底是什么?特点有哪些?
web前端分享JavaScript到底是什么?特点有哪些?这也是成为web前端工程师必学的内容.今天为大家分享了这篇关于JavaScript的文章,我们一起来看看. 一.JavaScript是什么? ...
- JS转换HTML转义符,防止javascript注入攻击,亲测可用
function removeHtmlTab(tab) { return tab.replace(/<[^<>]+?>/g,'');//删除所有HTML标签 } functi ...
- JavaScript 开发的 睡眠状况自测(SRSS)
Javascript 开发睡眠状况自测程序,手记!2019.11.13日... <script>//初始化fbox = new Findpair('fbox','output');fbox ...
- 浅谈模块化的JavaScript
模块化JavaScript之风早已席卷而来, CommonJS . AMD . NodeJS .RequireJS . SeaJS . curljs 等模块化的JavaScript概念及库扑面而来, ...
- Unobtrusive JavaScript 是什么?
Unobtrusive JavaScript 是什么? <!--以下是常规Javascript下写出来的Ajax--><div id="test">< ...
- 对JavaScript 引擎基础:Shapes 和 Inline Caches
全文有5个部分组成 1.JavaScript 引擎工作流程:介绍 JavaScript 引擎的处理流水线,这一部分会涉及到解释器/编译器的内容,且会分点介绍不同引擎间的差别与共同点: 2.JavaSc ...
- JavaScript 引擎基础:Shapes 和 Inline Caches
JavaScript 引擎基础:Shapes 和 Inline Caches hijiangtao 中国科学院大学 计算机应用技术硕士 260 人赞同了该文章 前言:本文也可以被称做 “JavaS ...
- 深入理解JavaScript系列:JavaScript的构成
此篇文章不是干货类型,也算不上概念阐述,就是简单的进行一个思路上的整理. 要了解一样东西或者完成一件事情,首要的就是先要搞清楚他是什么.作为一个前端开发人员,JavaScript应该算作是最核心之一的 ...
随机推荐
- java实现单链表常见操作
一.概述: 本文主要总结单链表常见操作的实现,包括链表结点添加.删除:链表正向遍历和反向遍历.链表排序.判断链表是否有环.是否相交.获取某一结点等. 二.概念: 链表: 一种重要的数据结构,HashM ...
- 如何开发由Create-React-App 引导的应用(二)
此文章是翻译How to develop apps bootstrapped with Create React App 官方文档 系列文章 如何开发由Create-React-App 引导的应用 如 ...
- sudo :apt-get:command not found
在centos下用yum install xxx yum和apt-get的区别 一般来说著名的linux系统基本上分两大类: 1.RedHat系列:Redhat.Centos.Fedora等 2. ...
- NGINX 配置404错误页面转向
什么是404页面 如果碰巧网站出了问题,或者用户试图访问一个并不存在的页面时,此时服务器会返回代码为404的错误信息,此时对应页面就是404页面.404页面的默认内容和具体的服务器有关.如果后台用的是 ...
- 月薪20k以上的高级程序员需要学习哪些技术呢?
课程内容: 源码分析.分布式架构.微服务架构.性能优化.团队协作效率.双十一项目实战 适用对象: 1-5年或更长软件开发经验,没有工作经验但基础非常扎实,对java工作机制,常用设计思想,常用java ...
- 【编程技巧】Ext.MessageBox 大集合 不同的dialog图解加写法
1.alert对话框 效果图: function a1(){ Ext.MessageBox.alert('title','text'); } 2.confirm案例,确定不确定2个按钮对话框 效果图 ...
- assembly 基础
body, table{font-family: 微软雅黑; font-size: 13.5pt} table{border-collapse: collapse; border: solid gra ...
- Mysql中的force index和ignore index
前几天统计一个sql,是一个人提交了多少工单,顺便做了相关sql优化.数据大概2000多w. ) c order by c desc; 为了实验最少受其他因素干扰,将生产库的200多w数据导出来,用测 ...
- Spring+JTA+Atomikos+mybatis分布式事务管理
我们平时的工作中用到的Spring事务管理是管理一个数据源的.但是如果对多个数据源进行事务管理该怎么办呢?我们可以用JTA和Atomikos结合Spring来实现一个分布式事务管理的功能.了解JTA可 ...
- linux_操作系统
如何查询操作系统版本? cat /etc/redhat-release 什么是操作系统? -- win10,linux都是os,应用软件和硬件打交道中间桥梁软件,管理 硬件+软件 资源,计算机系统基础 ...