zoukankan      html  css  js  c++  java
  • javascript的执行顺序

    先看下面两段js程序,先是定义式函数写法:

    1. <script type="text/javascript">
    2. function myfunc(){
    3. alert("第一次调用");
    4. };
    5. myfunc(); //得出的是 第二次调用
    6. function myfunc() {
    7. alert("第二次调用");
    8. };
    9. myfunc(); //得出的是 第二次调用
    10. </script>

    接下来是变量式函数写法:

    1. <script type="text/javascript">
    2. var myfunc = function (){
    3. alert("第一次调用");
    4. };
    5. myfunc(); //得出的是 第一次调用
    6. myfunc = function () {
    7. alert("第二次调用");
    8. };
    9. myfunc(); //得出的是 第二次调用
    10. </script>

    在定义式函数写法的代码中执行两个方法后的结果是一样的,就等于定义式函数中第一个函数没起到任何作用,得到的都是第二个函数的结果,从结果来看,JavaScript执行顺序不是按顺序一条一条来执行。
    在变量式函数写法的代码中执行两个方法后的结果是不同的,从这来看,JavaScript执行顺序是按顺序一条一条来执行的,
    从这两个不同函数的表示方法来看,在同一段程序的分析执行中,定义式函数有优先权,定义式函数执行完后,其他语句(包括变量式函数)才顺序执行,那么下面的例子也就不难得出结果了:

    1. <script type="text/javascript">
    2. function myfunc(){
    3. alert("第一次调用");
    4. };
    5. myfunc(); //输出 第二次调用
    6. var myfunc = function (){
    7. alert("第三次调用");
    8. }
    9. myfunc();//输出 第三次调用 上次的结果已经被这次的变量式函数结果覆盖
    10. function myfunc() {
    11.        alert("第二次调用");
    12. };
    13. myfunc();//输出 第三次调用  function myfunc()已经不再执行
    14. myfunc = function () {
    15. alert("第四次调用");
    16. }
    17. myfunc();//输出 第四次调用
    18. </script>

    结果就不像我们上次分析的那样了,这里的改变就是把两个相同的方法放在两个JavaScript片段里,这时两个方法都得出各自的结果,这里也就说明JavaScript是按一段一段来分析执行的,如下面代码:

    1. <script type="text/javascript">
    2. myfunc();//输出 第一次调用
    3. var myfunc = function (){
    4. alert("第二次调用");
    5. }
    6. myfunc();//输出 第二次调用
    7. function myfunc() {
    8. alert("第一次调用");
    9. };
    10. </script>
    11. <script type="text/javascript">
    12. myfunc();//输出 第三次调用
    13. var myfunc = function (){
    14. alert("第四次调用");
    15. }
    16. myfunc();//输出 第四次调用
    17. function myfunc() {
    18. alert("第三次调用");
    19. };
    20. myfunc();//输出 第四次调用
    21. </script>

    贴内牛人总结:
    1、<script>中的代码是阻塞式同步下载执行的,当浏览器遇到一个<script>标签会先下载这个标签的代码然后执行。在完成这件事之前不会加载其他任何标签和资源。
    2、变量和函数的声明发生在代码解析期,但是,变量赋值发生在运行期,因此反复声明同名函数和变量,最后一次声明的函数被保存下来,直到运行到变量赋值的代码才发生变化。

  • 相关阅读:
    源码探索笔记:ArrayList和LinkedList的源码
    Java多线程学习总结:初窥门径
    设计模式学习总结:责任链模式
    踩坑日记:行之Blog微信小程序开发过程中碰到的问题及处理方案(持续更新...)
    初识设计模式之模板方法模式
    初识设计模式之装饰者模式
    初识设计模式之建造者模式
    初识设计模式之适配器模式
    初始设计模式之原型模式
    初识设计模式之单例模式
  • 原文地址:https://www.cnblogs.com/snake-hand/p/3180038.html
Copyright © 2011-2022 走看看