JS逻辑题 技术点: 1). 变量提升 2). 函数提升 3). 预处理 4). 调用顺序
考查的技术点: 1). 变量提升 2). 函数提升 3). 预处理 4). 调用顺序
- var c = 1;
- function c(c) {
- console.log(c);
- var c = 3;
- }
- c(2);
运行结果:
看到这结果有没有大吃一惊?
我们现在来分析下原因。
这里我们先来了解下“预处理”,那什么是预处理呢?js语言本身具有预处理机制,js引擎在预处理期对所有声明的变量和函数进行处理,就是先把变量进行声明并读到内存里。也就是收集用var声明的变量信息和函数声明信息
还有一点是预处理时,变量和函数的优先顺序,先变量后函数。当变量名和函数名一致时后者会覆盖前者,我们看下下面的小案例,
- function b() {
- }
- var b
- console.log(typeof b)
结果为function,这就证实了,我们刚才的结论,执行顺序先变量后函数,变量名一致时,函数就会覆盖变量。
再来说一下预处理,看一下下面的小案例:
- var a = 2
- function fn() {
- console.log(a)
- var a = 3
- }
- 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不是一个函数的错误了,因为他现在是一个整型变量了啊,哈哈,是不是很伤脑筋啊……
最后我们再次运行以下代码,证实我们的结论:
- var c = 1
- function c(c) {
- console.log(c)
- var c = 3
- }
- console.log(c) //
- console.log(typeof c) //
- c(2) //
结果截图:
JS逻辑题 技术点: 1). 变量提升 2). 函数提升 3). 预处理 4). 调用顺序的更多相关文章
- JS 变量提升与函数提升
JS 变量提升与函数提升 JS变量提升 变量提升是指:使用var声明变量时,JS会将变量提升到所处作用域的顶部.举个简单的例子: 示例1 console.log(foo); // undefined ...
- js变量提升与函数提升的详细过程
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- js中的变量提升和函数提升
从上周开始,我所在的学习小组正式开始了angular的学习,angular是全面支持es6的,所以语法上和以前的angular有了很大的不同,比如变量声明时就抛弃了var,而选择了let和const: ...
- JS——变量提升和函数提升
一.引入 在了解这个知识点之前,我们先来看看下面的代码,控制台都会输出什么 var foo = 1; function bar() { if (!foo) { var foo = 10; } aler ...
- js中变量提升和函数提升
变量提升和函数提升的总结 我们在学习JavaScript时,会遇到变量提升和函数提升的问题,为了理清这个问题,现做总结如下,希望对初学者能有所帮助 我们都知道 var 声明的变量有变量提升,而 let ...
- JavaScript系列文章:变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- JavaScript:变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- JavaScript: 变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- ES6-LET,变量提升,函数提升
1:let命令 ①类似var,但只在let所在代码块内有效 ②不存在变量提升 ③暂时性死区(TDZ)—有let命令时,在此命令前都没法使用此变量 ④不允许重复声明 ⑤ES6允许块级作用域任意嵌套 ⑥E ...
随机推荐
- [AirFlow]AirFlow使用指南二 DAG定义文件
1. Example """ Code that goes along with the Airflow tutorial located at: https://git ...
- Return type declarations返回类型声明
PHP 7.新增了返回类型声明 http://php.net/manual/en/functions.returning-values.php 在PHP 7.1中新增了返回类型声明为void,以及类型 ...
- nodejs——js 实现webSocket 兼容移动端
nodejs——js 实现webSocket 兼容移动端 //服务器端 //npm install --save ws const express = require('express'); cons ...
- 利用pandas随机切分csv文件
把数据集随机切分为训练集和测试集 method 1: df = pd.read_csv('data/tgnb_merge.csv', encoding='utf-8') df.drop_duplica ...
- vuex(一)mutations
前言:vuex的使用,想必大家也都知道,类似于状态库的东西,存储某种状态,共互不相干的两个组件之间数据的共享传递等.我会分开给大家讲解vuex的使用,了解并掌握vuex的核心(state,mutati ...
- 【IDEA】创建maven项目时,报错[FATAL_ERROR] Cannot start Maven: Cannot find JRE '1.7'
在使用IDEA使用maven创建springMVC项目时,出现下面的错误,导致无法创建生成正常的springMVC项目结构,而只有一个pom文件: [FATAL_ERROR] Cannot start ...
- js 值和引用
js对值和引用的赋值/传递在语法上没有区别,完全根据值得类型决定 简单值(即标量基本类型值),总是通过值复制的方式来赋值/传递,包括null,undefined,字符串,数字,布尔值和ES6中的sym ...
- 使用python处理selenium中的获取元素属性问题
# 获取我的订单元素class属性值 at = self.driver.find_element_by_link_text('我的订单').get_attribute('class') # 判断cla ...
- 给select增加placeholder技巧
转自:http://stackoverflow.com/questions/5805059/how-do-i-make-a-placeholder-for-a-select-box/8442831 使 ...
- OpenCL入门
初入OpenCL,做个记录. 在Windows下开发OpenCL程序,必须先下载OpenCL的SDK,现在AMD,NVIDIA,Intel均提供各自的OpenCL库,基本是大同小异.安装好SDK后新建 ...