javaScript变量提升,函数声明提升

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

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

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

4.匿名函数不会提升。

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

js的变量提升:

 

变量声明:

Js编译器会把变量声明看成两个部分分别是声明操作(var a)和赋值操作(a=2)

声明操作在编译阶段进行,声明操作会被提升到执行环境的顶部,值是undefined(表示未初始化)

1. 作用域以函数进行划分的,而不是由块(block)划分的。

2. 使用变量的时候将会从当前作用域开始查找其“声明”(隐式或者显式),如果没有找到再向上一级作用域查找。

3. 变量是允许重复定义的,后一个定义将覆盖前一个定义。

4. 函数内部如果不加关键字var而定义的变量,默认为全局变量。

1.默认变量提升,看下面代码执行结果

1 console.log(a); //undefined
2 var a = 100;

 

1 var a;
2 console.log(a); //undefined
3 a = 100;

说明:变量声明提升,赋值在后面,所以输出undefined。

 

2.在javaScript中作用域是函数作用域,不像java,c++有块级作用域

2.1 在fn内部定义的age变量为局部变量,所以在外部访问时报:Uncaught ReferenceError: age is not defined

function fn(name) {
    var age = 20;
    console.log(name, age); //ldd 20
}
    fn('ldd');
    console.log(age); //Uncaught ReferenceError: age is not defined

 

2.2 虽然javaScript是函数作用域,但是在其内部没有用var声明的变量被视为全局变量,且没有变量提升,看下面代码

function fn(name) {
    age = 20;
    console.log(name, age); //ldd 20
}
    fn('ldd');
    console.log(age); //20
function fn(name) {
    console.log(name, age); //ldd undefined 
    var age = 20;
}
  fn('ldd');
function fn(name) {
    console.log(name, age); //Uncaught ReferenceError: age is not defined
   age = 20;
}  
 fn(
'ldd');

 

函数声明提升

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

//同时声明变量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>标签

<script>
    getName() //Uncaught TypeError: getName is not a function
    var getName = function() {
        alert('closule')
    }
    //    alert(a);//Uncaught ReferenceError: a is not defined
</script>
<script>
    var a = 3;

    function getName() {
        alert("a")
    }
</script>

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

//因为第一个<script>块中变量a未定义,变量不会提升到上一个script标签内。

 

posted @ 2018-11-22 17:54  黔驴技琼  阅读(243)  评论(0编辑  收藏  举报