var a; // 声明一个变量,标识符为a
function a() { // 声明一个函数,标示符也为a
}
alert(typeof a); 

显示的是“function”,即function的优先级高于var。 
有人觉得这是代码顺序执行的原因,即a被后执行的funcion覆盖了。好,将它们调换下。 

function a() {
}
var a;
alert(typeof a); 

结果仍然显示的是“function”而非“undefined”。即函数声明优先于变量声明。 
我们把代码稍作修改,声明a时同时赋值。

function a() {
}
var a = 1; // 注意此处
alert(typeof a); 

这时显示的是“number”却不是“function”了,这相当于

function a() {
}
var a;
a = 1; // 注意此处
alert(typeof a); 

即把“var a = 1”拆分为两步。 a被重新赋值了,自然是最后的那个值。

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

变量声明提升

1、变量定义

可以使用var定义变量,变量如果没有赋值,那变量的初始值为undefined

2、变量作用域

变量作用域指变量起作用的范围。变量分为全局变量和局部变量。全局变量在全局都拥有定义;而局部变量只能在函数内有效。 
在函数体内,同名的局部变量或者参数的优先级会高于全局变量。也就是说,如果函数内存在和全局变量同名的局部变量或者参数,那么全局变量将会被局部变量覆盖。 
所有不使用var定义的变量都视为全局变量

3、函数作用域和声明提前

JavaScript的函数作用是指在函数内声明的所有变量在函数体内始终是有定义的,也就是说变量在声明之前已经可用,所有这特性称为声明提前(hoisting),即javascript函数里的所有声明(只是声明,但不涉及赋值)都被提前到函数体的顶部,而变量赋值操作留在原来的位置。如下面例子: 
注释:声明提前是在JavaScript引擎的预编译时进行,是在代码开始运行之前。

var scope = 'global';
function f(){ console.log(scope); var scope = 'local'; console.log(scope); }

由于函数内声明提升,所以上面的代码实际上是这样的

var scope = 'global';
function f(){ var scope; //变量声明提升到函数顶部 console.log(scope); scope = 'local'; //变量初始化依然保留在原来的位置 console.log(scope); }

经过这样变形之后,答案就就非常明显了。由于scope在第一个console.log(scope)语句之前就已经定义了,但是并没有赋值,因此此时scope的指是undefined.第二个console.log(scope)语句之前,scope已经完成赋值为’local’,所以输出的结果是local

函数声明提升

1、函数的两种创建方式

  • 函数声明
  • 函数表达式

函数声明语法

f('superman');
function f(name){ console.log(name); }

运行上面的程序,控制台能打印出supemran。 
函数表达式语法

f('superman');
var f= function(name){ console.log(name); }

运行上面的代码,会报错Uncaught ReferenceError: f is not defined(…),错误信息显示说f没有被定义。 
为什么同样的代码,函数声明和函数表达式存在着差异呢? 
这是因为,函数声明有一个非常重要的特征:函数声明提升,函数声明语句将会被提升到外部脚本或者外部函数作用域的顶部(是不是跟变量提升非常类似)。正是因为这个特征,所以可以把函数声明放在调用它的语句后面。如下面例子,最终的输出结果应该是什么?:

var getName = function(){console.log(2); } function getName (){ console.log(1); } getName();

可能会有人觉得最后输出的结果是1。让我们来分析一下,这个例子涉及到了变量声明提升函数声明提升。正如前面说到的函数声明提升,函数声明function getName(){}的声明会被提前到顶部。而函数表达式var getName = function(){}则表现出变量声明提升。因此在这种情况下,getName也是一个变量,因此这个变量的声明也将提升到底部,而变量的赋值依然保留在原来的位置。因此上面的函数可以转换成下面的样子:

function getName(){ //函数声明提升到顶部 console.log(1); }
var getName;    //变量声明提升
 getName = function(){ //变量赋值依然保留在原来的位置 console.log(2); } getName(); // 最终输出:2

所以最终的输出结果是:2。在原来的例子中,函数声明虽然是在函数表达式后面,但由于函数声明提升到顶部,因此后面getName又被函数表达式的赋值操作给覆盖了,所以输出2

----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

你不知道的JavaScript(上卷)    一书的第40页中写到:函数会首先被提升,然后才是变量。

console.log(foo);
function foo(){console.log("函数声明");
}
var foo = "变量"

输出为:
function foo(){
    console.log("函数声明");
}

疑问:函数先提升,接着变量再提升,但函数优先级比变量更高,所以console.log(foo)会是一个函数;

这段代码相当于

function foo(){console.log("函数声明");
}
var foo;
console.log(foo);
foo = "变量"

----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

JavaScript中变量和函数声明的提升

现象:

1.在JavaScript中变量和函数的声明会提升到最顶部执行。

2.函数的提升高于变量的提升。

3.函数内部如果用var声明了相同名称的外部变量,函数将不再向上寻找。

4.匿名函数不会提升。

5.不同<script>块中的函数互不影响。

函数声明提升高于变量声明

//同时声明变量a和函数a
var a;
function a() {}
alert(typeof a);  //显示的是"function",初步证明function的优先级高于var。//先声明函数后声明变量,证明上边的例子不是function覆盖了变量
function a() {}
var a;
alert(typeof a);  //显示的仍是"function",而不是"undefined",即function的优先级高于var。//声明了变量的同时赋值
function a() {}
var a = 1;
alert(typeof a);  //number,此时不是function了。
//说明:"var a=1"相当于"var a;a=1",即先声明,后赋值,"a=1"相当于把a重新赋值了,自然就是number!

函数内部用var定义了和外部相同的变量,函数将不再向上找外部的变量

var value = 'hello';
function  show() {alert(value);if (!value) {var value = 'function';}alert(value);
}
show() //此处调用函数依次弹出 "undefined", "function"//上例相当于
var value = 'hello';
function  show() {var value;  //注意这行
    alert(value);if (!value) {value = 'function';  //这行去掉var
    }alert(value);
}
show()
//1.如果上列中show内部定义value未用var,则会用到外部的变量,弹出"hello", "hello"。
//2.如果函数内部未定义value,也能获取到外部的value值。

匿名函数不会向上提升

getName()
var getName = function () {alert('closule')
}
function getName() {alert('function')
}
getName()//上边的代码相当于
function getName() {  //函数向上提升alert('function')
}
getName()
var getName = function () {alert('closule')
}
getName()//代码执行分别弹出 "function", "closule"

不同<script>块中的函数互不影响

<script>getName()var getName = function () {alert('closule')}
<script>
<script>function getName() {alert('function')}
<script>//代码执行报错:TypeError: getName is not a function
//因为第一个<script>块中getName()函数未定义,匿名函数又不会向上提升

----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

还有一个很疑惑的就是

function bar(){console.log(a);}
bar();
var a = 33333;
bar();

输出结果竟然是undefined和33333,为什么第二个能够得到33333?

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------

function testOrder(arg) {console.log(arg); // arg是形参,不会被重新定义console.log(a); // 因为函数声明比变量声明优先级高,所以这里a是函数var arg = 'hello'; // var arg;变量声明被忽略, arg = 'hello'被执行var a = 10; // var a;被忽视; a = 10被执行,a变成numberfunction a() {console.log('fun');} // 被提升到作用域顶部console.log(a); // 输出10console.log(arg); // 输出hello
};
testOrder('hi');
/* 输出:
hi
function a() {
        console.log('fun');
 } 10 hello */

转载于:https://www.cnblogs.com/aixiuxiu/p/7099138.html

函数声明和变量声明提升相关推荐

  1. python公共变量声明_Python变量声明

    繁星coding 好的,首先要做的事情.Python中没有"变量声明"或"变量初始化"这样的东西.简直就是我们所谓的"任务",但应该只是称之 ...

  2. js php 变量声明,javascript变量声明实例分析_javascript技巧

    本文实例讲述了javascript变量声明的方法.分享给大家供大家参考.具体分析如下: js中使用一个变量之前应当先声明.变量使用关键字var来声明. 如果未在var声明语句中给变量指定初始值,则该变 ...

  3. python变量类型声明_python变量声明及简单数据类型

    以上代码将打印出两个结果,按照执行先后顺序,第一个print打印的是在他之前的变量值,如果这里不打印,在代码的最后只打印一次,那么它将始终打印最新记录的变量值,其他不打印 因此上在python程序中可 ...

  4. php变量 声明提升,TypeScript:let和const变量声明

    在开始介绍let和const变量声明前,有必要先了解下JavaScript里的var变量声明. var变量声明 全局声明 var声明在函数体外,所声明的变量为全局变量.var name = " ...

  5. ES5和ES6中的变量声明提升

    ES5和ES6中的变量声明提升 Example1: a=2; var a; console.log( a ); //结果为2 Example2: console.log( a ); //结果是unde ...

  6. php变量 声明提升,JavaScript 变量提升

    JavaScript 变量提升 JavaScript 中,函数及变量的声明都将被提升到函数的最顶部. JavaScript 中,变量可以在使用后声明,也就是变量可以先使用再声明. 以下两个实例将获得相 ...

  7. 变量和函数的定义和声明

    2. 定义和声明 2.1. extern和static关键字 在上一节我们把两个程序文件放在一起编译链接,main.c用到的函数push.pop和is_empty由stack.c提供,其实有一点小问题 ...

  8. JavaScript函数声明前置与变量声明

    先看一个例子 func1(); // 输出:我是函数声明func2(); // 报错 console.log(a); // 输出:undefinedfunction func1() {console. ...

  9. js中变量名提升和函数名提升

    首先,js中变量没有块级作用域,但是有函数作用域,即只有函数可以约数变量的作用域. 并且,函数的实质也是一个变量,所以可以改变它的值,即赋值.所以变量名提升和函数名提升非常相像. 1.变量名的提升发生 ...

最新文章

  1. spring整合springmvc和mybatis
  2. linux内核竞争条件漏洞,Linux内核竞争条件漏洞-导致远程代码执行
  3. gulp html页面路径,配置gulp前端开发环境
  4. 避免每个类中都初始化日志类
  5. 查询高考成绩2021一分一段表,一分一段表查询2021 如何查询一分一段表
  6. python编写es脚本_es数据迁移脚本(python)
  7. BZOJ2816:[ZJOI2012]网络(LCT)
  8. linux系统性能监视高级命令(12个)
  9. 解决WP7的32位图像渐变色色阶问题
  10. SAS在金融中的应用七
  11. Spring 事务初始化源码分析
  12. lz0-007 读书笔记03
  13. ecmall ajax,ajax
  14. 【渝粤教育】电大中专跨境电子商务理论与实务 (25)作业 题库
  15. 一句话点评国内在产主流A级车
  16. linux安装红警教程,Deepin v20下玩红警三
  17. 如何随心意改变桌面快捷方式的图标
  18. 人脸对齐SDM原理----Supervised Descent Method and its Applications to Face Alignment
  19. 两年内5000万台电脑都要换成国产电脑
  20. HCIA的基础知识(1)

热门文章

  1. GameByro渲染系统剖析
  2. linux查看内存、cpu等硬件信息
  3. 《ASP.NET办公自动化系统开发实例导航》笔记一
  4. 求集合/字符串中的所有组合 (C语言)
  5. 关于引用与指针实现多态的一些记录
  6. 犹豫了许久,还是写个年总结记录一下吧
  7. Docker 初步认识
  8. shelve 序列化模块——day18
  9. Django 之Form
  10. 2017 清北济南考前刷题Day 2 afternoon