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

注:本文转自:http://blog.csdn.net/qq673318522/article/details/50810650仅做学习方便,没有任何商业目的;

变量声明提升

1、变量定义

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

2、变量作用域

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

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

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

1 var scope = ‘global‘;
2 function f(){
3     console.log(scope);
4     var scope = ‘local‘;
5     console.log(scope);
6 }

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

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

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

函数声明提升

1、函数的两种创建方式

  • 函数声明
  • 函数表达式

函数声明语法

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

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

1 f(‘superman‘);
2 var f= function(name){
3     console.log(name);
4 }

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

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

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

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

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

 1    var sum =0;
 2     var a = 10;
 3     all1 = 1000;
 4     function test(){
 5         console.log(a);//10
 6         all2=200;
 7         console.log(foo());//2//foo是一个函数,解析的时候会提升,所以能够访问到
 8         function foo() {
 9             return 2;
10         };
11     }
12     test();
时间: 2024-08-29 13:56:44

函数声明的提升和变量声明提升的相关文章

前端面试题,js预处理部分小结,函数声明提升和变量声明提升

博客搬迁,给你带来的不便,敬请谅解! http://www.suanliutudousi.com/2017/11/25/%e5%89%8d%e7%ab%af%e9%9d%a2%e8%af%95%e9%a2%98%ef%bc%8cjs%e9%a2%84%e5%a4%84%e7%90%86%e9%83%a8%e5%88%86%e5%b0%8f%e7%bb%93%e5%87%bd%e6%95%b0%e5%a3%b0%e6%98%8e%e6%8f%90%e5%8d%87%e5%92%8c%e5%8f%9

js变量声明提升

1.变量提升 根据javascript的运行机制和javascript没有块级作用域这个特点,可以得出,变量会声明提升移至作用域 scope (全局域或者当前函数作用域) 顶部的. 变量声明提升至全局域 console.log(a); // undefined var a ="Hi"; 相当于 var a; // 变量提升到全局作用域 console.log(a); // 已声明变量a,但未初始化,固为undefined a="Hi"; 变量声明提升至当前函数域 v

javascript中函数声明、变量声明以及变量赋值之间的关系与影响

函数声明.变量声明以及变量赋值之间有以下几点共识: 1.所有的全局变量都是window的属性 2.函数声明被提升到范围作用域的顶端 3.变量声明被提升到范围作用域的顶端 4.变量声明比函数声明的优先级高,变量声明优先于函数声明被提升,如果两者同名同时存在,后被提升的函数声明会覆盖先被提升的变量声明 5.变量赋值不会被提升,到执行行代码才开始赋值 补充: 6.调用javascript函数的整个过程可以分为预编译期(也叫声明期)和赋值期(也叫计算执行期). 预编译期完成对所有变量(包括形参.函数内部

函数提升和变量提升,以及他们的优先级

一.变量提升 在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域.变量提升即将变量声明提升到它所在作用域的最开始的部分. (1) 创建函数有两种形式,一种是函数声明,另外一种是函数字面量,只有函数声明才有变量提升 console.log(a) // f a() { console.log(a) } console.log(b) //undefined function a() { console.log(a) } var b = fu

js 函数提升和变量提升

问题背景:在写一个非常简单的弹出交互时,定义了一个全局变量和一个方法,这个方法始终调不到这个变量,得到高人指点后,特意总结一下这个知识点: 一.变量提升 在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域.变量提升即将变量声明提升到它所在作用域的最开始的部分. console.log(global); // undefined var global = 'global'; console.log(global); // global

变量声明置顶规则、函数声明及函数表达式和函数的arguments属性初始化

一.变量声明和变量赋值: if (!("a" in window)) { var a = 1; } alert(a);//a为? 你可能认为alert出来的结果是1,然后实际结果是"undefined".要了解为什么,我们需要知道JavaScript里的3个概念: 1.所有的全局变量都是window的属性,语句 var a = 1;等价于window.a = 1; 可以用如下方式来检测全局变量是否声明: "变量名称" in window 2.声明

ES6的变量声明

在ES5中,变量声明只有var和function以及隐式声明三种,在ES6中则增加了let,const,import和class四种,以下来介绍着七种变量的声明. var ES5中最原始的变量声明,用于声明变量,其实JavaScript是弱类型语言,对数据类型变量要求不太严格,所以不必声明每一个变量的类型(这就是下面说的隐式声明,当然这并不是一个好习惯),在使用变量之前先进行声明是一种好的习惯. 1.作用域 使用var声明的变量的作用域是函数作用域(在ES5时代,只有函数作用域和全局作用域两种作

CSS变量:声明全局变量,让编写更快捷 --root

在编写css公共样式的时候,我们都会声明很多通用的颜色.字号等.现在我们可以通过声明CSS变量来实现了 1.变量的声明 CSS变量声明是字母前加两个横线(--)如: body{ --Colors:#dfdfdf; --fS16px:16px; } 上述代码中,body选择器中声明了Colors和fS16px两个变量.而使用'--'是因为$被Sass占用了,@被Less占用了,所以是为了区分它们. 同时,你也可以用--root{}来存放所有变量,在下边使用的时候直接调用即可.如: --root{

深入理解变量声明提升和函数声明提升

变量声明提升 1.变量定义 可以使用var定义变量,变量如果没有赋值,那变量的初始值为undefined. 2.变量作用域 变量作用域指变量起作用的范围.变量分为全局变量和局部变量.全局变量在全局都拥有定义:而局部变量只能在函数内有效. 在函数体内,同名的局部变量或者参数的优先级会高于全局变量.也就是说,如果函数内存在和全局变量同名的局部变量或者参数,那么全局变量将会被局部变量覆盖. 所有不使用var定义的变量都视为全局变量 3.函数作用域和声明提前 JavaScript的函数作用是指在函数内声