首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

JS执行顺序

javascript给人的直观感受是,从上往下执行,但实际上却不是这样的,先看个例子 1. console.log(test); 2. var test = "你好"; 3. console.log(...因为javascript执行时,在同一个作用域内是编译再执行 编译的时候会编译 function 和 var 这两个关键词定义的变量,编译完成后从上往下执行并向变量赋值 所以执行第1行时, var test...已经执行过了,所以test不会报错,而test2就会报错 需要注意的是,对 var test 执行编译时,只是定义了 test 这个变量,并不会把 "你好" 这个值赋给test,而是到第2行时才给test...赋值的,这就是为什么第1行的执行结果是 undefined 对于上面的例子,可以这样理解 //编译 var 定义的变量 1. var test; //编译完成后,从上到下执行代码 2. console.log...//执行结果是"你好" function test() { console.log("你好"); } 模拟编译执行过程 //找到 function 定义的部分进行编译 //以函数名作为变量名,同时用函数赋值

9.2K60
您找到你想要的搜索结果了吗?
是的
没有找到

ajax 和 js 事件的执行顺序

有一个需求,滚轮滚动到相应位置的时候执行当前的动画,这个动画在footer里面,而网页的主体通过ajax进行渲染,我在js里面调用ajax渲染数据,然后再获取主体的高度,滚动到该高度的时候执行动画。...放在服务器上测试发现无论怎么写,都是获取主体的高度,然后才进行数据的渲染。那么必然高度是一个极小的值,不符合我想要的属性。...我大致想了两种解决办法,均以失败告终,本地是ajax执行,服务器是js执行。...js事件。...当然这样做有弊端的,如果接口出问题,ajax渲染失败,那么整个网页的js都将执行不了。不过我想真到了数据都渲染不出的地方,访问网页就没有意义了,所以最后我采用了这种方法。

2.9K30

JS如何控制任务的执行顺序

Eat supper~ 从这里不难看出,这里主要的点是链式调用和流程控制 链式调用很简单,核心的点就是函数执行完后 返回 this,栗子: class EatMan { eat(food) {...${food} ~`); return this; } } new EatMan().eat('apple').eat('pear') 这样就实现链式调用了,下面上主菜 - 控制任务的执行顺序...这里参考某些中间件的实现思路,首先创建一个任务队列,把每个函数放进去,按顺序执行,每个函数执行完成后调用一个 next 函数,执行下一个函数 class EatMan { constructor(...{ this.name = name; this.tasks = []; this.init(); // 利用 setTimeout 的机制 在下一个事件循环才开始执行...Eat dinner~ Eat supper~ 首发自:JS如何控制任务的执行顺序 - 小鑫の随笔

3.5K30

Js篇-面试题2-Promise 执行顺序问题

Promise 执行问题 写出下面一段程序的输出的结果 new Promise(resolve => { console.log(1); setTimeout(() => console.log...console.log(3)) resolve(); }).then(() => console.log(4)) console.log(5) 答案: 1 5 3 4 2 解析:事件循环,任务队列的执行顺序...,new Promise是会立即调用,接收了一个resolve参数,执行调用输出console.log(1)语句,遇到setTimeout,它是一个异步宏任务,会推送到任务队列中,进入挂起状态 而promise.resove...也是一个异步微任务,仍然会推送到任务队列中,进入挂起状态,当主线程console.log(5)执行完后,在从异步任务队列中进行执行,在同一栈中,微任务要优先于宏任务的执行,所以执行 3,然后 4,最后是...2 最终执行顺序结果是:1,5,3,4,2

1.3K10

面试官:说说Event Loop事件循环、微任务、宏任务

为了解决这个问题,JS中出现了同步和异步。他们的本质区别是:一条流水线上各个流程的执行顺序不同。在讲JS任务执行机制前,先要了解一下什么是同步任务与异步任务。...一.1.执行主线程上的log(1)2.当有两个await时,只有第一个await右边的代码会立即执行log(4),后面的几行代码都会放入微任务队列中。...其实是声明了⼀个promise,promise是同步代码,会顺序⾏打印async2函数里的4 ,只有.then⾥⾯的代码会加⼊微任务队列⾥,这⾥相当于⾏了async2()之后,再将后面的代码加⼊⼀个微任务队列中...一.1.执行主线程上的log(1)2.当有两个await时,只有第一个await右边的代码会立即执行log(4),后面的几行代码都会放入微任务队列中。...其实是声明了⼀个promise,promise是同步代码,会顺序⾏打印async2函数里的4 ,只有.then⾥⾯的代码会加⼊微任务队列⾥,这⾥相当于⾏了async2()之后,再将后面的代码加⼊⼀个微任务队列中

74540

面试官:说说Event Loop事件循环、微任务、宏任务5

为了解决这个问题,JS中出现了同步和异步。他们的本质区别是:一条流水线上各个流程的执行顺序不同。在讲JS任务执行机制前,先要了解一下什么是同步任务与异步任务。...同步任务:即主线程上的任务,按照顺序由上⾄下依次⾏,当前⼀个任务⾏完毕后,才能⾏下⼀个任务。异步任务:不进⼊主线程,⽽是进⼊任务队列的任务,执行完毕之后会产生一个回调函数,并且通知主线程。...一.1.执行主线程上的log(1)2.当有两个await时,只有第一个await右边的代码会立即执行log(4),后面的几行代码都会放入微任务队列中。...3.执行主线程上的log(6)4.执行第4行至第6行的微任务二.图片1.执行主线程上的1,5,72.主线程的同步任务执行完毕后,会执行微任务。...,进⼊async1内部,async1其实是声明了⼀个promise,promise是同步代码,会顺序⾏打印async2函数里的4 ,只有.then⾥⾯的代码会加⼊微任务队列⾥,这⾥相当于⾏了async2

73520

面试官:说说Event Loop事件循环、微任务、宏任务

为了解决这个问题,JS中出现了同步和异步。他们的本质区别是:一条流水线上各个流程的执行顺序不同。在讲JS任务执行机制前,先要了解一下什么是同步任务与异步任务。...同步任务:即主线程上的任务,按照顺序由上⾄下依次⾏,当前⼀个任务⾏完毕后,才能⾏下⼀个任务。异步任务:不进⼊主线程,⽽是进⼊任务队列的任务,执行完毕之后会产生一个回调函数,并且通知主线程。...一.图片1.执行主线程上的log(1)2.当有两个await时,只有第一个await右边的代码会立即执行log(4),后面的几行代码都会放入微任务队列中。...3.执行主线程上的log(6)4.执行第4行至第6行的微任务二.图片1.执行主线程上的1,5,72.主线程的同步任务执行完毕后,会执行微任务。...其实是声明了⼀个promise,promise是同步代码,会顺序⾏打印async2函数里的4 ,只有.then⾥⾯的代码会加⼊微任务队列⾥,这⾥相当于⾏了async2()之后,再将后面的代码加⼊⼀个微任务队列中

1.8K31

说说Event Loop事件循环、微任务、宏任务

为了解决这个问题,JS中出现了同步和异步。他们的本质区别是:一条流水线上各个流程的执行顺序不同。在讲JS任务执行机制前,先要了解一下什么是同步任务与异步任务。...同步任务:即主线程上的任务,按照顺序由上⾄下依次⾏,当前⼀个任务⾏完毕后,才能⾏下⼀个任务。异步任务:不进⼊主线程,⽽是进⼊任务队列的任务,执行完毕之后会产生一个回调函数,并且通知主线程。...一.1.执行主线程上的log(1)2.当有两个await时,只有第一个await右边的代码会立即执行log(4),后面的几行代码都会放入微任务队列中。...3.执行主线程上的log(6)4.执行第4行至第6行的微任务二.图片1.执行主线程上的1,5,72.主线程的同步任务执行完毕后,会执行微任务。...,进⼊async1内部,async1其实是声明了⼀个promise,promise是同步代码,会顺序⾏打印async2函数里的4 ,只有.then⾥⾯的代码会加⼊微任务队列⾥,这⾥相当于⾏了async2

68820

面试官:说说Event Loop事件循环、微任务、宏任务_2023-02-28

为了解决这个问题,JS中出现了同步和异步。他们的本质区别是:一条流水线上各个流程的执行顺序不同。在讲JS任务执行机制前,先要了解一下什么是同步任务与异步任务。...同步任务:即主线程上的任务,按照顺序由上⾄下依次⾏,当前⼀个任务⾏完毕后,才能⾏下⼀个任务。异步任务:不进⼊主线程,⽽是进⼊任务队列的任务,执行完毕之后会产生一个回调函数,并且通知主线程。...一.1.执行主线程上的log(1)2.当有两个await时,只有第一个await右边的代码会立即执行log(4),后面的几行代码都会放入微任务队列中。...3.执行主线程上的log(6)4.执行第4行至第6行的微任务二.图片1.执行主线程上的1,5,72.主线程的同步任务执行完毕后,会执行微任务。...,进⼊async1内部,async1其实是声明了⼀个promise,promise是同步代码,会顺序⾏打印async2函数里的4 ,只有.then⾥⾯的代码会加⼊微任务队列⾥,这⾥相当于⾏了async2

81910

JS中的同步异步编程,宏任务与微任务的执行顺序

浏览器是多线程的,JS是单线程的(浏览器只分配一个线程来执行JS)   进程大线程小:一个进程中包含多个线程,例如在浏览器中打开一个HTML页面就占用了一个进程,加载页面的时候,浏览器分配一个线程去计算...(node中实现的api,把当前任务放到主栈最后执行,当主栈执行完,执行nextTick,再到等待队列中找)    - MutationObserver (创建并返回一个新的 MutationObserver...执行顺序优先级:SYNC => MICRO => MACRO 所有JS中的异步编程仅仅是根据某些机制来管控任务的执行顺序,不存在同时执行两个任务这一说法 先来看一个例子: setTimeout(()...我们模拟下浏览器的程序执行过程,代码自上而下执行,碰到第一个程序,放入主栈(主任务队列),此时浏览器发现这是一个宏任务定时器,把它移出主栈,放入等待任务队列,再继续执行下面的代码,放入主栈执行,发现第二个任务也是宏任务的定时器...我们用ajax来看看js的同步与异步的执行顺序和机制,AJAX任务开始:SEND,AJAX任务结束:状态为4 let xhr = new XMLHttpRequest(); xhr.open('GET'

2K10
领券