前  言

LiuDaP

   今天就给大家介绍一个特别基础的东西,javascript中函数的一点儿小知识(js代码的执行顺序),希望对大家有那么一点点帮助吧!!!

  

一、js--->单线程

  严格意义上来说,javascript没有多线程的概念,所有的程序都是单线程依次执行的。

  1、什么是单线程?

  通俗点说,就是代码在执行过程中,另一段代码想要执行就必须等当前代码执行完成后才可以进行。我们拿一段代码来解释一下吧

 for(var i=1;i<=3;i++){
setTimeout(function(){
console.log(i); //输出:4,4,4
},0)
}

  我们来看一下上面的这段代码,既然延时器时间设置为0,那么应该执行一遍循环就应该立即打印出一个i,但是最终的打印结果为:4,4,4。之所以会出现上面的结果,正是因为js代码是单线程应用。

  在执行过程中,先遇到for循环,for循环先进入线程。当i=1时,循环走到setTimeOut后,此时的for循环还没有执行完成,setTimeOut就会被放入一个地方(线程池)等待执行。此时for循环继续执行,当i=2时,for循环仍没有执行完,这时的setTimeOut仍会被放在线程池中等待执行……依次类推,直到for循环转完3遍后,for循环执行完了,此时线程空闲了,在线程池中等待执行的setTimeOut依次执行打印i,而for循环执行完成后,i变成了4,所以打印出了三个4。

  2、如果想要改变上面的状况可以运用以下代码

//将var变为let
for(let i=1; i<=3; i++){
setTimeOut(function(){
console.log(i); //输出的结果为1,2,3
},0);
}
//用自执行函数进行包裹
for(var i=1; i<=3; i++){
!function(i){
setTimeOut(function(){
console.log(i); //输出的结果为1,2,3
},0);
}(i)
}
二、js中的函数作用域和代码的执行

  >>>函数作用域

我们先来了解一下以下几个概念:

  1、在js语言中,没有类似于c语言这样的块级作用域。

  2、js语言中的顶级作用域为window对象范围内,称为全局作用域,在全局作用域中声明的变量为全局变量。

  3、js函数范围内的变量只能在函数内部使用,函数外部无法使用,这样的变量为局部变量。

  4、js函数可以嵌套,多个函数的嵌套构成了作用域的层层嵌套,这称为js中的作用域链。

  5、js作用域链变量访问规则:

    (1)、当前作用域内存在要访问的变量时,则使用当前作用域中的变量。

      (2)、当前作用域中不存在要访问的变量时,则会到上一层作用域中寻找,直到全局作用域。

  >>>执行顺序

  js代码执行分为两个部分:

  1、代码的检查装载阶段(预编译阶段),此阶段进行变量和函数的声明,但是不对变量进行赋值,变量的默认值为undefined。

  2、代码的执行阶段,此阶段对变量进行赋值和函数的声明。

看了上面的一些具体的概念,我们拿一段代码进行举例说明:

var a=1;  //声明了一个全局变量
function func(){
console.log(a); //输出:undefined。打印a,而在func这个作用域中已经声明了a变量,按照js的执行顺序,此时的a并未被赋值。
var a=1;
console.log(a); //输出:1。
}
func();

  看上面的代码:第一个a输出undefined。原因:js作用域链的访问规则,当前作用域内存在要访问的变量a,所以使用当前作用域中的变量。再根据js代码的执行顺序,此时的a只是声明了而并未被赋值,默认为undefined,所以输出undefined。

  而第二个a,输出1,正是因为此时的a已经被声明且被赋值,所以a输出1。

编者按

  这个周末由于事情太多了,就给大家分享到这里吧,希望这一点点小知识能给大家带来一点点的帮助。。

js代码执行顺序问题的更多相关文章

  1. [js]js代码执行顺序/全局&私有变量/作用域链/闭包

    js代码执行顺序/全局&私有变量/作用域链 <script> /* 浏览器提供全局作用域(js执行环境)(栈内存) --> 1,预解释(仅带var的可以): 声明+定义 1. ...

  2. JS代码执行顺序

    JavaScript执行引擎并非一行一行地分析和执行程序,而是一段一段地分析执行的.而且在分析执行同一段代码中,定义式的函数语句会被提取出来优先执行.函数定义执行完后,才会按顺序执行其他代码. 先看看 ...

  3. 关于js代码执行顺序

    上网查了一下关于这个方面的资料,大部分都是关于两个script标签中的js代码和变量以及函数提升方面的知识. 1.两个script标签 <script> alert("我是代码块 ...

  4. vue的$nextTick使用后的js代码执行顺序问题

    一.问题产生背景: 父组件已经获得子组件实例,并能直接触发子组件的方法,在父组件中调用了子组件的两个方法 // 父组件调用子组件,this.picker是获取的子组件整个实例,先调用update,再调 ...

  5. 浅析js的执行顺序

    javascript是一种描述型的脚本语言,是一种解析语言,由浏览器动态解析,不同种类的浏览器不同版本的浏览器对于js的解析有着微小的差别,不同浏览器的js解析引擎效率也有高低,下面来给大家分析一下j ...

  6. 浏览器环境下JavaScript脚本加载与执行探析之代码执行顺序

    本文主要基于向HTML页面引入JavaScript的几种方式,分析HTML中JavaScript脚本的执行顺序问题 1. 关于JavaScript脚本执行的阻塞性 JavaScript在浏览器中被解析 ...

  7. 详解JavaScript的任务、微任务、队列以及代码执行顺序

    摘要: 理解JS的执行顺序. 作者:前端小智 原文:详解JavaScript的任务.微任务.队列以及代码执行顺序 思考下面 JavaScript 代码: console.log("scrip ...

  8. js 异步执行顺序

    参考文章: js 异步执行顺序   1.js的执行顺序,先同步后异步 2.异步中任务队列的执行顺序: 先微任务microtask队列,再宏任务macrotask队列 3.调用Promise 中的res ...

  9. Java代码执行顺序(静态变量,非静态变量,静态代码块,代码块,构造函数)加载顺序

    //据说这是一道阿里巴巴面试题,先以这道题为例分析下 public class Text { public static int k = 0; public static Text t1 = new ...

随机推荐

  1. Java多线程高并发学习笔记(一)——Thread&Runnable

    进程与线程 首先来看百度百科关于进程的介绍: 进程是一个具有独立功能的程序关于某个数据集合的一次运行活动.它可以申请和拥有系统资源,是一个动态的概念,是一个活动的实体.它不只是程序的代码,还包括当前的 ...

  2. [04] 利用注解生成实体类对应的建表sql语句

    1.实现功能 我们已经对注解有了基本的认识,知道了如何自定义注解,如何使用和最基本的处理注解. 本篇主要介绍,如何使用运行时级别的注解,配合反射来自动生成建表的sql语句.如下例: 我们有实体类Stu ...

  3. 浅谈SQL优化入门:1、SQL查询语句的执行顺序

    1.SQL查询语句的执行顺序 (7) SELECT (8) DISTINCT <select_list> (1) FROM <left_table> (3) <join_ ...

  4. JDBC操作数据库之批处理

    JDBC开发中,操作数据库需要和数据库建立连接,然后将要执行的SQL语句发送到数据库服务器,最后关闭数据库连接,都是按照这样的操做的,如果按照此流程要执行多条SQL语句,那么就要建立多个数据库连接,将 ...

  5. [js高手之路] es6系列教程 - promise常见用法详解(resolve,reject,catch,then,all,race)

    关于promise我在之前的文章已经应用过好几次,如[js高手之路]Node.js+jade+express+mongodb+mongoose+promise实现todolist,本文就来讲解下pro ...

  6. AngularJS小结

    1.简介 AngularJS 通过 ng-directives 扩展了 HTML. 2.AngularJS指令 ng-app 指令定义一个AngularJS 应用程序的根元素.指令在网页加载完毕时会自 ...

  7. 转自知乎(JAVA后台开发可以纯粹用JAVA SE吗?)

    著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处.作者:巴多崽链接:http://www.zhihu.com/question/29663744/answer/45154839来源: ...

  8. 在分布式数据库中CAP原理CAP+BASE

    本篇博文的内容均来源于网络,本人只是整理,仅供学习! 一.关系型数据库 关系型数据库遵循ACID规则 事务在英文中是transaction,和现实世界中的交易很类似,它有如下四个特性: 1.A (At ...

  9. Java连接数据库完整代码 查找和插入

    package test; import java.io.InputStream; import java.sql.Connection; import java.sql.DriverManager; ...

  10. 关于python中的pickle函数

    8-7参考阅读 - 读文件.写文件.异常处理.文件保存游戏.pickle数据转成文本的过程又被称为"序列化",即将对象状态转换为可保持或传输的格式的过程.对应的,从序列化的格式中解 ...