zoukankan      html  css  js  c++  java
  • JavaScript:预解析

    一.预解析:JS代码执行由浏览器中的JS解析器来执行。JS解析器执行JS代码的两个过程是预解析和代码执行。

    • 第一步变量提升,把变量的声明提升到当前作用域的最上面,不会提升变量赋值
    • 第二步函数提升,把函数的声明提升到当前作用域的最上面,不会提升函数调用
    • 先提升var,在提升function
     1 //例一:变量提升
     2 console.log(num);
     3 var num = 5;
     4 //预解析
     5 var num;
     6 console.log(num);
     7 num = 5;
     8 
     9 //例二:函数提升
    10 f1();
    11 function f1() {
    12   console.log('hello');
    13 }
    14 // 预解析
    15 function f1() {
    16   console.log('hello');
    17 }
    18 f1();

    二.案例

     1 //
     2 var a = 25;
     3 function abc() {
     4   console.log(a); 
     5   var a = 10;
     6 }
     7 abc();
     8 // 预解析
     9 var a;
    10 function abc() {
    11   // 局部作用域的预解析
    12   var a;
    13   console.log(a); 
    14   a = 10;
    15 }
    16 a = 25;
    17 abc();//结果打印出undefined,因为局部作用域里变量声明提升后的下一句就是打印了,还没有赋值
     1 //
     2 console.log(a);
     3 function a() {
     4   console.log('aaa');
     5 }
     6 var a = 1;
     7 console.log(a);
     8 //预解析
     9 //在预解析的过程中如果函数和变量的名字相同,那么结果输出是函数优先
    10 var a;
    11 function a() {
    12   console.log('aaa');
    13 }
    14 console.log(a);//打印函数a
    15 a = 1;
    16 console.log(a);//1
     1 //
     2 var a = 10;
     3 f1();
     4 function f1() {
     5   var b = 5;
     6   console.log(a);
     7   console.log(b);
     8   var a = '123';
     9 }
    10 // 预解析
    11 var a;
    12 function f1() {
    13   var b;
    14   var a;
    15   b = 5;
    16   console.log(a);
    17   console.log(b);
    18   a = '123';
    19 }
    20 a = 10;
    21 f1();//undefined 5
     1 //
     2 f1();
     3 console.log(c);
     4 console.log(b);
     5 console.log(a);
     6 function f1() {
     7   var a = b = c = 10;
     8   console.log(a);
     9   console.log(b);
    10   console.log(c);
    11 }
    12 //预解析
    13 function f1() {
    14   var a;
    15   a = b = c = 10;//b和c是全局变量,因为没有直接var
    16   console.log(a);
    17   console.log(b);
    18   console.log(c);
    19 }
    20 f1();//10 10 10
    21 console.log(c);//10
    22 console.log(b);//10
    23 console.log(a);//a is not defined
  • 相关阅读:
    js生成点阵字体
    随笔
    html5 textarea 的 placeholder 换行的几种方式
    有物不知其数,三三数之剩二,五五数之剩三,七七数之剩二。问物几何?
    javascript 水仙花数
    避免url传值字符串sjstr过长,使用from表单【隐藏域】post提交
    图表转换
    highcharts 显示点值的效果
    导出报表
    JQuery ----文档处理
  • 原文地址:https://www.cnblogs.com/M-M-Monica/p/11655596.html
Copyright © 2011-2022 走看看