javaScript中的小细节-script标签中的预解析

时间:2022-09-26 14:11:12

  首先介绍预解析,虽然预解析字面意思很好理解,但是却是出坑出的最多的地方,也是bug经常会有的地方,利用好预解析的特性可以解决很多问题,并且提高代码的质量及数量,浏览器在解析代码前会把变量的声明和函数(整个函数体)提前到当前作用域的最顶端,函数的提升要比var变量的提升高,相同命名情况下,var会覆盖掉函数。

  细节问题:  在多对的script标签中如果有相同的函数,那它们相互之间是不会受影响的,在第二对script标签中声明变量或者是创建函数,在第一对script标签中是无法访问到的,这就说明了,javaScript的预解析只会在各自的script标签中发生,同时,第一对script标签中报错是不会影响到下面script标签中js代码的执行。但在第一对标签中声明的变量和函数是可以在第二对标签中获取到的。当然对于函数来说,预解析也只会将声明的变量及子级函数提升到当前函数的内部的最上面。

<script>
var numOne = 5;
function num() {
return 1;
}
console.log(num());  //1
console.log(numOne);  //5
</script>
<script>
function num() {
return 2;
}
console.log(num());  //2
console.log(numOne);  //5
var numOne = 10;
</script>

javaScript中的小细节-script标签中的预解析的更多相关文章

  1. javaScript中的小细节-局部作用域中的var

    javaScript中var是很神奇的,在局部作用域中,var a = b = c = 1;是不一样的,a为使用var声明的变量,而b和c则是全局下的,此类变量被称为隐式全局变量:var a = 1; ...

  2. script标签中type为&quot&semi;text&sol;x-template&quot&semi;或&quot&semi;text&sol;html&quot&semi;

    写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况,一般的写法都是使用+号以字符串的形式拼接,如果是短点的还好,如果很长很长的话就会拼接到令人崩溃了. 比如 ...

  3. script标签中type为&lt&semi;script type&equals;&quot&semi;text&sol;x-template&quot&semi;&gt&semi;是个啥

    写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况,一般的写法都是使用+号以字符串的形式拼接,如果是短点的还好,如果很长很长的话就会拼接到令人崩溃了. 比如 ...

  4. script标签中的async、defer属性

    Script标签是我们常用的引用js脚本的一种方式. 撸代码的时候,我们常常只写src属性,直接忽略其他属性. 最近发现了2个可以利用的属性:async.defer. 顾名思义async就是异步,在不 ...

  5. 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量&quest;

    <!DOCTYPE html> <!-- 为什么不能在 body 标签的前面的 script 标签中定义 JS 全局变量? 在全局环境下的代码就是在页面加载阶段从上到下一边加载一边执 ...

  6. 关于html中的 script标签中的 代码写法有效性&quest; easyui tabs的href不能载入内容页面

    script标签, 即 html中的 js脚本区域中: 它其实就是一个 普通的 html标签, 在 html 渲染器 parser 看来, 它跟其他任何的普通 的 html标签 , 比如 p 标签, ...

  7. 在JS文件中,不需要&lt&semi;script&gt&semi;标签

    在JS文件中,不需要<script>标签\

  8. 手摸手教你如何在 Python 编码中做到小细节大优化

    手摸手教你如何在 Python 编码中做到小细节大优化 在列表里计数 """ 在列表里计数,使用 Python 原生函数计数要快很多,所以尽量使用原生函数来计算. &qu ...

  9. 【JavaScript性能优化】------理解Script标签的加载和执行

    1.script标签是如何加载的?当浏览器遇到一个 < script>标签时,浏览器会停下来,运行JavaScript代码,然后再继续解析.翻译页面.同样的事情发生在使用 src 属性加载 ...

随机推荐

  1. HackerRank savita-and-friends

    Description 在一条边上求一个点,使得这个点到所有点的最长的最短距离 最短. \(n \leqslant 10^5\) Sol Dijkstra+扫描线+单调队列. 这个好像叫什么最小直径生 ...

  2. C&plus;&plus; 记事本&colon; 从历史说起

    C 的简史 在谈论 C++ 的历史那么必须先得了解 C 的历史,那么我们先来看一段来自于 <<C专家编程>> 对 C 语言史前阶段的简单阐述: Ken Thompson(左), ...

  3. (spring-第12回【IoC基础篇】)JavaBean的属性编辑器

    在spring实例化bean的最后阶段,spring利用属性编辑器将配置文件中的文本配置值转换为bean属性的对应值,例如: 代码0011 <bean id="car" cl ...

  4. 用Android-X86和VirtualBox打造高性能Android开发环境

    不知道有多少Android开发着对Android虚拟机的那悲剧的性能有意见,反正我的看法是:那速度实在是太坑爹了! 为什么Android虚拟机比iOS和WP7的虚拟机要慢很多呢?原因如下: 1. An ...

  5. js 截取字符串里的ip

    var ip_reg = /([\d\.]*)/ig; ip = ip_reg.exec(str); return ip; ip_reg会截取 '(' 开始的字符串,中间包含数字和 '.' .

  6. python中OS模块方法

    常见函数: os.sep:取代操作系统特定的路径分隔符 os.name:指示你正在使用的工作平台.比如对于Windows,它是'nt',而对于Linux/Unix用户,它是'posix'. os.ge ...

  7. 动态调试&vert;Maccms SQL 注入分析&lpar;附注入盲注脚本&rpar;

    0x01 前言 已经有一周没发表文章了,一个朋友叫我研究maccms的代码审计,碰到这个注入的漏洞挺有趣的,就在此写一篇分析文. 0x02 环境 Web: phpstudySystem: Window ...

  8. 四步法分析定位生产环境下MySQL上千条SQL中的问题所在

    第一步:通过以下两种方式之一来打开慢查询功能 (1)方式一:通过修改mysql的my.cnf文件 如果是5.0或5.1等版本需要增加以下选项: log-slow-queries="mysql ...

  9. jquery 查找元素

    /************ 查找父元素 *************/ //closest()方法 $("#mytd1").bind("click",functi ...

  10. 一款基于jQuery的图片左右滑动焦点图

    今天给大家分享一款基于jQuery的焦点图插件,这款jQuery焦点图插件的特点是可以多张图片左右滑动切换,可以点击切换按钮进行图片滑动,同时也支持图片自动切换.另外,这款jQuery焦点图是宽屏的, ...

相关文章