前端笔试中常考题--js的函数与变量提升问题

先谈谈作用域####

-- 什么是作用域?
就是某个变量有(起)作用的范围;
--词法作用域和动态作用域
词法作用域:在变量声明的时候,它的作用域就已经确定了;
动态作用域:在程序运行的时候,由程序的当前上下文(执行环境)决定的;
-- js属于词法作用域
词法作用域的访问规则:
先在当前作用域中查找,如果找到就直接使用,如果没有找到,那么就到上一级作用域中查找,如果还没有找到那么就重复这个查找的过程,直到全局作用域

  • js中的作用域
    (01) script标签构成的全局作用域;
    (02) 在js中,函数是唯一一个可以创建作用域的对象;
    var a1 = "a1";
    var b1 = "b1";
    function func(){
        var a1 = "n1";
        console.log(a1);   //n1(此行a1先在func函数内部作用域中查询;
        console.log(b1);   //b1
    }

    func();

变量和函数的提升####

js的执行过程:
预解析阶段 变量和函数的提升(声明);
具体的执行阶段
变量和函数的提升:
js代码是一个从上至下逐步解析的过程,在这个过程中之前会把所有的的变量和函数提前申明.

console.log(a);   //undefined 而不是报错
    var a = 10;
    f1();   //f1而不是报错
    function f1(){
        console.log("f1");
    }

上面一段js代码,会先把var a与 func函数提前申明,所以代码实际可用模拟成下面这段代码:

  var a;  //变量a提前申明,但未定义
  function f1(){//函数提前申明
      console.log("f1");
  }
  console.log(a);  //申明未定义,结果为undefined
  a = 10;
  f1();   //结果为f1

经过上面的解析,结果便可以理解了.
具体会出现的一些问题和几种情况:
①变量和变量同名的情况:后面的变量会把前面的变量覆盖;

    var n1 = "n1";
    console.log(n1);                //n1
    function test(){
      console.log(n1);
    }
    test();                           //n1
    var n1 = "new n1";        //覆盖了之前n1的值
    console.log(n1);                //new n1
    test();                         //new n1

②函数和函数同名的情况,后面的函数会覆盖前面的函数.

    f1();  // 20
    function f1(){
        console.log(10);
    }
    f1(); //20
    function f1(){
        console.log(20);
    }
    f1();//20

③函数和变量同名,可以理解为函数声明提升而变量的声明不提升(实际上变量也提升了,但是会被函数覆盖).

    console.log(demo);  // demo函数                   
    var demo = "我是字符串";
    function demo(){
        console.log("我是函数");
    }
    console.log(demo);  //我是字符串

④变量提升是分作用域的

var num=5;
function test1(){
console.log(num);//undefined
var num=10;//此处函数test1作用域中有申明变量num,会提升申明
}
test();

⑤如果函数是函数表达式定义,那么在做函数声明提升的时候,仅仅只会把var 变量的名称(函数)提升到当前作用域中.

    console.log(func);          //undefined
    var func = function(){//此处只提升申明var func;所以为undefined;
        console.log("func");
    }
   var func = "我是MT";  
   console.log(func);  //'我是MT'

---自己的学习总结,希望大家喜欢,不足之处欢迎指正,O(∩_∩)O谢谢!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 7,852评论 2 17
  • 前面讲完变量提升的知识和注意点,这次主要是来点题目操练一下,废话不多说了,直接上案例.注意undefined和报错...
    _三月阅读 7,320评论 10 34
  • 三、闭包和高阶函数 3.1 闭包 3.1.1 变量的作用域 所谓变量的作用域,就是变量的有效范围。通过作用域的划分...
    梁同学de自言自语阅读 1,494评论 0 6
  • 函数声明和函数表达式有什么区别 (*)解析器会率先读取函数声明,并使其在执行任何代码之前可以访问;函数表达式则必须...
    coolheadedY阅读 402评论 0 1
  • 大雨瓢泼夹杂着冰雹 看着窗外的大雨,自己拿着相机琢磨着今天下午要进展的活动。 好在有大神忙完来指导,真的是恍然大悟...
    见夏知晓阅读 257评论 0 0