考查的技术点:  1). 变量提升 2). 函数提升  3). 预处理  4). 调用顺序

  1. var c = 1;
  2. function c(c) {
  3. console.log(c);
  4. var c = 3;
  5. }
  6. c(2);

运行结果:

看到这结果有没有大吃一惊?

我们现在来分析下原因。

这里我们先来了解下“预处理”,那什么是预处理呢?js语言本身具有预处理机制,js引擎在预处理期对所有声明的变量和函数进行处理,就是先把变量进行声明并读到内存里。也就是收集用var声明的变量信息和函数声明信息

还有一点是预处理时,变量和函数的优先顺序,先变量后函数。当变量名和函数名一致时后者会覆盖前者,我们看下下面的小案例,

  1. function b() {
  2. }
  3. var b
  4. console.log(typeof b)

结果为function,这就证实了,我们刚才的结论,执行顺序先变量后函数,变量名一致时,函数就会覆盖变量。

再来说一下预处理,看一下下面的小案例:

  1. var a = 2
  2. function fn() {
  3. console.log(a)
  4. var a = 3
  5. }
  6. fn()

运行下,结果为undefined。

为什么为undefined呢?因为这里预处理顺序是这样的,外面声明了个全局变量a,值为2,但是里面把a声明成了局部变量,函数内部的预处理顺序为先声明var a;然后console.log(a);最后a=3;所以我们调用函数的时候,里面是有a,所以不会调外面的全局a,只是里面的a暂时还没有值,因为a=3这赋值步骤是在console.log(a)后面执行的,所以我们运行时就看到undefined了。拓展下,如果函数里面去掉var,那么打印出来的值就是2了,然后全局变量a又被赋值为3。

那好,我们现在回到我们刚才的题目上来,刚才题目的解析顺序可以理解为以下步骤:

先预处理var c;

然后预处理整个c函数

function c(c) {
            console.log(c)
            var c = 3
    }

此时c的typeof为function

接下来再给c赋值,值为1,即c=1,此时c是整型变量1.typeof为number了。

最后再执行c(2)调用函数。所以我们调用的时候当然就会报c不是一个函数的错误了,因为他现在是一个整型变量了啊,哈哈,是不是很伤脑筋啊……

最后我们再次运行以下代码,证实我们的结论:

  1. var c = 1
  2. function c(c) {
  3. console.log(c)
  4. var c = 3
  5. }
  6. console.log(c) //
  7. console.log(typeof c) //
  8. c(2) //

结果截图:

JS逻辑题 技术点: 1). 变量提升 2). 函数提升 3). 预处理 4). 调用顺序的更多相关文章

  1. JS 变量提升与函数提升

    JS 变量提升与函数提升 JS变量提升 变量提升是指:使用var声明变量时,JS会将变量提升到所处作用域的顶部.举个简单的例子: 示例1 console.log(foo); // undefined ...

  2. js变量提升与函数提升的详细过程

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  3. js中的变量提升和函数提升

    从上周开始,我所在的学习小组正式开始了angular的学习,angular是全面支持es6的,所以语法上和以前的angular有了很大的不同,比如变量声明时就抛弃了var,而选择了let和const: ...

  4. JS——变量提升和函数提升

    一.引入 在了解这个知识点之前,我们先来看看下面的代码,控制台都会输出什么 var foo = 1; function bar() { if (!foo) { var foo = 10; } aler ...

  5. js中变量提升和函数提升

    变量提升和函数提升的总结 我们在学习JavaScript时,会遇到变量提升和函数提升的问题,为了理清这个问题,现做总结如下,希望对初学者能有所帮助 我们都知道 var 声明的变量有变量提升,而 let ...

  6. JavaScript系列文章:变量提升和函数提升

    第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...

  7. JavaScript:变量提升和函数提升

    第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...

  8. JavaScript: 变量提升和函数提升

    第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...

  9. ES6-LET,变量提升,函数提升

    1:let命令 ①类似var,但只在let所在代码块内有效 ②不存在变量提升 ③暂时性死区(TDZ)—有let命令时,在此命令前都没法使用此变量 ④不允许重复声明 ⑤ES6允许块级作用域任意嵌套 ⑥E ...

随机推荐

  1. three.js入门系列之粒子系统

    其实代码很简单,也很容易懂(我用的是r99版本的three.js,目前网上大多数demo是60或者80的版本,其中的一些api已经废弃,如下是r99版本支持的写法): 注:渲染器是WebGl渲染器 如 ...

  2. PHP常见带有下划线的常量

    1.__PHP_Incomplete_Class <?php echo __PHP_Incomplete_Class::class; ?> __PHP_Incomplete_Class 2 ...

  3. vue-cli搭建及项目目录结构

    今天总结一下vue的脚手架的搭建.很简单,今天我们就来说一下 一.vue 脚手架的搭建. 对于脚手架的具体搭建方法,我这里不在很详细的书写,具体方法我推荐菜鸟教程的方法,和具体,你一步一步的来就可以实 ...

  4. Linux系统管理员必备参考资料下载汇总

    Linux系统管理员必备: Linux系统管理工具包系列汇总 Linux系统管理员必看 VanDyke SecureCRT 6.1.3 附特别文件 鸟哥的Linux私房菜 基础学习篇 (第二版) 高清 ...

  5. HDU1575 Tr A

    解题思路:矩阵快速幂模板题,见代码: #include<cstdio> #include<cstring> #include<algorithm> using na ...

  6. SQLServer OpenRowSet 导入数据

    今早上同事要求从SQLServer2008导出一部分数据到SQLServer2000中作为演示/测试数据,开始也没想多,直接去SQLServer2000的企业管理器中,用了数据导入的功能.以为完事了, ...

  7. div横排放置对齐问题;block,inline,inline-block区别

    1.左右两个div都设置为float:left,如果右边div没有设置宽度,右边div的宽度会根据div里的内容自动调整. 缺点:不易控制 2.只有左侧div设置为float:left,右侧div设置 ...

  8. Java并发--深入剖析ThreadLocal

    想必很多朋友对ThreadLocal并不陌生,今天我们就来一起探讨下ThreadLocal的使用方法和实现原理.首先,本文先谈一下对ThreadLocal的理解,然后根据ThreadLocal类的源码 ...

  9. BZOJ3688 折线统计【树状数组优化DP】

    Description 二维平面上有n个点(xi, yi),现在这些点中取若干点构成一个集合S,对它们按照x坐标排序,顺次连接,将会构成一些连续上升.下降的折线,设其数量为f(S).如下图中,1-&g ...

  10. Hexo+GitHub+Netlify一站式搭建属于自己的博客网站

    喜欢的话请关注我的个人博客我在马路边https://hhongwen.cn/,此文为博主原创,转载请标明出处. 更好的阅读体验请点击查看:Hexo+GitHub+Netlify一站式搭建属于自己的博客 ...