zoukankan      html  css  js  c++  java
  • 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()函数未定义,匿名函数又不会向上提升
  • 相关阅读:
    使用setTimeout()代替setInterval()
    音视频入门-02-RGB拼图
    音视频入门-01-认识RGB
    CMake入门-04-自定义编译选项
    CMake入门-03-还是HelloWorld
    CMake入门-02-HelloWorld扩展
    CMake入门-01-从HelloWorld开始
    HTML页面启动sass监听编译成css文件
    安装+配置Express
    安装+配置Nginx
  • 原文地址:https://www.cnblogs.com/leezhxing/p/4274485.html
Copyright © 2011-2022 走看看