美文网首页JavaScript前端记念册Web
前端笔试中常考题--js的函数与变量提升问题

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

作者: _三月 | 来源:发表于2017-03-01 17:27 被阅读241次

先谈谈作用域####

-- 什么是作用域?
就是某个变量有(起)作用的范围;
--词法作用域和动态作用域
词法作用域:在变量声明的时候,它的作用域就已经确定了;
动态作用域:在程序运行的时候,由程序的当前上下文(执行环境)决定的;
-- 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谢谢!

相关文章

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

    先谈谈作用域#### -- 什么是作用域?就是某个变量有(起)作用的范围;--词法作用域和动态作用域词法作用域:在...

  • js变量声明提升与函数表达式

    1.变量声明提升 js引擎会把变量声明与函数声明都提升到当前函数的顶部。eg: js引擎编译为 2.函数表达式 对...

  • JS中的提升

    JS中包含两种提升,变量提升和函数提升。 变量提升 变量提升只能是var或者function声明的变量或者函数,l...

  • JavaScript 中的提升(Hoisting)

    前言: JS中在声明函数与变量的时候是存在变量提升的问题,一不注意,有的时候会导致一些bug,本文主要就是针对JS...

  • 猫眼

    var变量提升,函数声明提升,消除变量声明提升(let); 高阶函数,函数式的编程,柯里化 原型链继承,js面向对...

  • js函数与变量提示提升的问题

    1:作用域 函数时唯一一个可以创建作用域的对象 什么是作用域就是某个变量起作用的范围 全局作用域在页面的任意位置可...

  • js变量提升与函数提升

    从别人给我的一道题目说起,请问执行下面语句后的输出结果 我最初的答案是: 其实应该是 这道题包含了了函数提升与变量...

  • Javascript 变量执行过程 和 数组 & 对象的区别

    变量提升 JS执行过程1. 先提升(先提升函数,再提升变量,如果名字一样,变量提升会覆盖函数提升)2. 再执行,如...

  • js中变量和函数声明的提升

    二 、 js中变量和函数声明的提升

  • js的变量提升与函数提升

    什么是变量提升 JavaScript 中,变量的声明都将被提升到函数的最顶部。也就是说变量可以先使用再声明。简单的...

网友评论

  • 令武:④变量提升是分作用域的 调用test1(),而不是test吧,不然会报错
  • _LibraX:加油哟!
  • 鬼雄起:你好 ,能讲解一下闭包吗?新手不太懂
    _三月:敬请期待:stuck_out_tongue_winking_eye:

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

本文链接:https://www.haomeiwen.com/subject/hcfcgttx.html