对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);//3
        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预编译阶段函数声明提升优先于变量提升,第二、当函数被使用后,便会被垃圾回收。

   

   

原文地址:https://www.cnblogs.com/weshare/p/8447345.html

时间: 2024-10-15 05:24:36

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

偶然在网上看到的题目,jQuery功底如何一测便知晓!!!!!!

笔者最终实现的效果如下: 参考答案下载地址 通过手写html代码实现如图效果: ============以下题目全部使用jQuery来做=========== 当点击"加载数据"按钮时根据提供的数据通过jQuery动态创建表格数据填充该表格.数据见data.txt文件.效果如图: 当点击"设置样式与事件"按钮时实现如下图效果: 效果说明: a)         设置表头背景图片为bg.png,及表头的文字颜色#055A78. b)        所有单元格中的文字居

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

1 2 3 function removeHtmlTab(tab) {  return tab.replace(/<[^<>]+?>/g,'');//删除所有HTML标签 } 1 2 3 function html2Escape(sHtml) {  return sHtml.replace(/[<>&"]/g,function(c){return {'<':'<','>':'>','&':'&','"'

JavaScript版 过敏性鼻炎症状自测 www.zxgj.cn

过敏性鼻炎是一个治不好又死不了的病,只要沾上了过敏性鼻炎就麻烦脱不了身,其中的痛苦只有本人清楚....那么如何才能不让过敏性鼻炎惹上我们,如果真有过敏性鼻炎,我们又该如何去治疗. var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = ""; var s = document.getElementsByTagName("script&q

浅谈模块化的JavaScript

模块化JavaScript之风早已席卷而来, CommonJS . AMD . NodeJS .RequireJS . SeaJS . curljs  等模块化的JavaScript概念及库扑面而来,不得不承认,对于前端JavaScript代码的组织编写是一次伟大的变革.本文主要参考snandy 的有关 modular js 系列文章,对SeaJS和RequireJS做一个系统的深入分析及对比. 一.我们为什么要用模块化的JavaScript 相信大家也都经历了“过程式的JavaScript”.

JavaScript大杂烩4 - 理解JavaScript对象的继承机制

面向对象之继承 JavaScript是单根的面向对象语言,它只有单一的根Object,所有的其他对象都是直接或者间接的从Object对象继承(没有指定父类的对象,都被认为是从Object继承的). 在前面我们讨论了面向对象的封装性,在最后的地方也谈到了JavaScript的继承是通过原型和原型链实现的,下面我们就详细的展开这个问题:JavaScript到底是如何实现继承的? 继承的本质 继承的本质是重用,从语法上来讲,继承就是"D是B"的描述,其中B是基类,描述共性,D是子类,描述特性

Type入门(JavaScript的超集)-译

你是否听过 TypeScript? TypeScript 是 JavaScript 的超集,TypeScript结合了类型检查和静态分析,显式接口.TypeScript是微软的开源项目,它是由C#之父Anders Hejlsberg发起的. 为什么会有 TypeScript? JavaScript 只是一个脚本语言,并非真正设计用于开发大型 Web 应用,JavaScript 没有提供类和模块等概念,对于一个真正的应用开发,TypeScript 扩展JavaScript 并实现了这些特性.Typ

JavaScript DOM编程艺术学习笔记(二)

第二章 JavaScript语法 2.1 准备工作 编写JavaScript的环境:文本编辑器 + Web浏览器 用JavaScript编写的代码必须通过HTML/XHTML文档才能执行.有两种方式可以做到这点. 第一种是将JavaScript代码放到文档<head>便签中的<script>标签之间: <!DOCTYPE html> <html lang="en"> <head> <meta charset="

浅谈JavaScript DOM编程艺术读后感和一点总结

最近工作不是很忙就想想想JavaScript的内部组成和一些要点,就是从这本书开始的.对新手来说还好,简单易懂. 简单终结下我重书中学到的一些要点. 下面都是个人学习的要点提取: 1.给自己预留退路,现在浏览器基本都支持Javascript,但是当时可能有一些浏览器不支持还是怎么的,毕竟我没经历过那个年代.作者的这种做法很厉害,不管你的浏览器支持还是不支持Javascript,网站最基本的信息你是能看见的,不会出现不支持Javascript就什么都看不到.例子: <a href="http

JavaScript神一样的变量系统

话说上一篇介绍了JavaScript故事版的身世之谜.看官你估计也明白JavaScript出生之时,就未曾托于重任.布兰登-艾奇估计也没料到今天的JavaScript变得如此重要.要不然,当年他也不会如此惜墨,竟然只搞了一个"Var"声明就海纳百川.当然不是说如此惜墨有什么重大缺陷,人家内部搞个类型推断那也是牛B轰轰的.话说微软那个c#也有个神奇的Var,有抄袭布兰登-艾奇Idea的嫌疑! 布兰登-艾奇如此惜墨,搞了个Var就算了,连咱们后端鞋同最熟悉的那些数据类型也省了.后端鞋同们一