注:不知道为什么URL写绝对路径在FF下会出错,知道的麻烦告诉下。下面的get()和post()示例使用的是绝对路径,所以在FF下你将会出错并不会看到返回结果。...请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 .ajax。示例代码: $.get("....其实应该为客户端请求的类型(JSON,XML,等等) 这是一个简单的 POST 请求功能以取代复杂 .ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 .ajax。...}, complete: function(){ // Handle the complete event } // ... }); 全局事件是每次的Ajax请求都会触发的...successFunction请求成功后回调函数。
异步和非阻塞 我对异步的另外一个难以理解的点是异步/同步和阻塞/非阻塞的关系 人们常说: “异步是非阻塞的” , 但为什么异步是非阻塞的, 或者说, 异步和非阻塞又有什么关系呢 非阻塞是对异步的要求,...回调存在的问题 回调存在的问题可概括为两类: 信任问题和控制反转 可能你比较少意识到的一点是:我们是无法在主程序中掌控对回调的控制权的。 例如: ajax( ".....Zalgo" (将Zalgo释放了出来) 为什么它如此可怕?...因为函数的调用时间是不确定的,难以预料的。 我想没有人会喜欢这样难以掌控的代码。..., 设它的初始值为true, 这时候foo或者bar在第一次执行的时候, 是可以进入if内部的代码块并且执行baz函数的, 但在if内部的代码块结束的时候, 我们把flag的值置为false,这个时候下一个函数就无法进入代码块执行了
注:不知道为什么URL写绝对路径在FF下会出错,知道的麻烦告诉下。下面的get()和post()示例使用的是绝对路径,所以在FF下你将会出错并不会看到返回结果。...请求成功时可调用回调函数,如果需要在出错时执行函数,请使用 $.ajax。 示例代码: $.get("....complete: function(){ // Handle the complete event } // ... }); 全局事件是每次的Ajax请求都会触发的,它会向DOM中的所有元素广播,在上面...complete Function 请求完成后回调函数 (请求成功或失败时均调用)。参数: XMLHttpRequest 对象,成功信息字符串。...success Function 请求成功后回调函数。
axios 是一个基于 Promise 的http请求库,可以用在浏览器和node.js中,很多不知道的是,高版本的jQuery中,ajax也是一个Promise对象。...当readyState为4的时候,我们还需要判断status,只有通过这个状态判断才能确定得到的数据是正确的,否则有可能得到的是错误的数据。...一般成功状态是200,很多封装的时候判断是大于等于200和小于300就是成功,还有一个特殊304也是成功的标志。...概括来说,ajax和axios请求过程分成5步,创建对象、设置回调函数、建立连接、发送请求、回调函数进行操作。...为什么设置回调函数要放第二步呢,因为onreadystatechange是在readyState状态切换的时候都会触发,所以建立对象之后就要设置回调函数。 (完)
简而言之就是每次循环都会声明一次(对比var声明的for循环只会声明一次),可以这么理解let/const中的for循环 给每次循环创建一个块级作用域: ?...有些人会有疑问,为什么日常开发中没有显式的声明块级作用域,let/const声明的变量却没有变为全局变量 ?...你使用的第三方ajax库还有可能并没有提供一些错误的回调,请求失败的一些错误信息可能会被吞掉,而你确完全不知情 总结一下回调函数的一些缺点 多重嵌套,导致回调地狱 代码跳跃,并非人类习惯的思维模式 信任问题...,你不能把你的回调完全寄托与第三方库,因为你不知道第三方库到底会怎么执行回调(多次执行) 第三方库可能没有提供错误处理 不清楚回调是否都是异步调用的(可以同步调用ajax,在收到响应前会阻塞整个线程,会陷入假死状态...这3种模块化方案,前者用在浏览器端,后面2种用在服务端,直到ES6 Module出现 ES6 Module默认目前还没有被浏览器支持,需要使用babel,在日常写demo的时候经常会显示这个错误 ?
console.log(res); }).catch(e=>{//回调发生错误 console.log("Error:",e); }); } // Promise.all function...何为惰性求值: 它指的是:代码直到调用时才会执行。即,当我们需要时,相应的值才会被计算并返回。...iteratorValue = iteratorResult.value; if(iteratorValue instanceof Promise) {//如果生成器的值是一个Promise,则对其注册成功和失败回调...//如果promise成功返回,则恢复生成器的执行并传入Promise的返回结果 //遇到错误,向生成器抛出异常 iteratorValue.then(res=>handle(iterator.next...Promise:帮助处理异步代码 回调函数:在Promise对象上注册成功和失败的回调函数 箭头函数:适合用在回调函数上 闭包:迭代器在async函数内被创建,在promise的回调函数内通过闭包获取该迭代器
引子 几乎在每一本JS相关的书籍中,都会说JS是 单线程的,JS是通过事件队列 (EventLoop)的方式来实现异步回调的。...单线程与 多线程,都是指在一个 进程内的单和多 浏览器是多进程的 我们已经知道了 CPU、 进程、 线程之间的关系,对于计算机来说,每一个应用程序都是一个 进程, 而每一个应用程序都会分别有很多的功能模块...请求 当请求完成时,若有回调函数,通知事件触发线程 当我们了解了渲染进程包含的这些线程后,我们思考两个问题: 为什么 javascript 是单线程的 为什么 GUI 渲染线程与 JS 引擎线程互斥 为什么...从 Event Loop 看 JS 的运行机制 到了这里,终于要进入我们的主题,什么是 Event Loop 先理解一些概念: JS 分为同步任务和异步任务 同步任务都在JS引擎线程上执行,形成一个 执行栈...如此循环 宏任务、微任务 当我们基本了解了什么是执行栈,什么是事件队列之后,我们深入了解一下事件循环中 宏任务、 微任务 什么是宏任务 我们可以将每次执行栈执行的代码当做是一个宏任务(包括每次从事件队列中获取一个事件回调并放到执行栈中执行
傻X前端才会把AJAX设置为同步,这样做会使请求期间页面卡住。 我们试一下把之前代码改成同步,整个页面都会卡主。...(data.toString())//成功 }) 方法二:搞两个回调呗 ajax('GET','/1.json',data()=>{},error()=>{}) //前面函数是成功回调,后面函数是失败回调...1.规范回调的名字或顺序 2.拒绝回调地狱,让代码可读性更强 3.很方便的捕获错误 ---- 前端程序猿开始翻书了 1976年,Daniel P.Friedman 和 David Wise。...因为之前我们说的那三个原因,不规范、回调地狱、很难错误处理。...花时间把ajax写到完美(有时间可以做) 使用JQuery.ajax(这个可以) 使用axios(这个库比JQuery逼格高) ---- JQuery.ajax 已经非常完美,进入JQuery文档
这个主要用在jQuery内部的调用:Deferred, Ajax。相关内容可以查看艾伦的慕课网或博客园教程。 我在这里和大家讨论的是另一个话题:关于参数传递的处理。...☑ unique: 确保一次只能添加一个回调(所以在列表中没有重复的回调)。 ☑ stopOnFalse: 当一个回调返回false 时中断调用。...代码中每次去调用该方法时,都会将字符串列转为JSON对象,如果传递参数相同,需要再次去转吗? 4. 针对第三个问题,jQuery的解决方法是使用一个缓存,可以看下1.7.2中的实现。...第二次调用时 如果使用缓存,只需要在flagCache中取到JSON对象就可以了 -- flagCache['once memory'] 如果不适用缓存,还需要转成JSON对象。...为什么呢?使用缓存和不适用缓存有什么另外的比较吗? 大家可以积极留言,互相讨论。
这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。示例代码: $.get("....其实应该为客户端请求的类型(JSON,XML,等等) 这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。...错误的 MIME 类型可能导致不可预知的错误。见 Specifying the Data Type for AJAX Requests 。...complete Function 请求完成后回调函数 (请求成功或失败时均调用)。参数: XMLHttpRequest 对象,成功信息字符串。...success Function 请求成功后回调函数。
当代码执行流进入函数时,函数的上下文被推到一个执行栈中。在函数执行完之后,执行栈会弹出该函数上下文,在其上的所有变量和函数都会被销毁,并将控制权返还给之前的执行上下文。...ES6中有全局作用域、函数作用域和块级作用域三层概念。 当一个变量在当前块级作用域中未被定义时,会向父级作用域(创建该函数的那个父级作用域)寻找。...每次 Tick 的过程就是查看是否有待处理事件,如果有则取出相关事件及回调函数放入执行栈中由主线程执行。...待处理的事件会存储在一个任务队列中,也就是每次 Tick 会查看任务队列中是否有需要执行的任务。 任务队列: 异步操作会将相关回调添加到任务队列中。...)或.then(undefined, rejection)的别名,用于指定发生错误时的回调函数。
验证码的目的是为了阻止机器人暴力撞库,作为管理后台很有必要,而且是要每次登录请求都需重新验证。 3、填完用户名或密码时,Ajax实时验证。...但cookie必然需要记录 用户ID或用户名 相关的信息,存在浏览器中,有一定的CSRF攻击风险和信息泄漏风险。 5、找回密码功能。这是一个高危功能,无论是逻辑疏漏还是安全不严谨,都会导致账号的失窃。...以AJAX提交为例,每次尝试登录后,无论是否登录成功,后端都要注销当前验证码SESSION,前端JS刷新验证码。后台要注销SESSION是以免黑客屏蔽JS导致验证码只需一写次,从而导致爆库。...为什么登录名也要加密呢?还是避免信息泄露,以免别人根据登录名猜出密码。 3、登录成功时重新生成SESSION_ID。主要是为了防止固定会话ID的CSRF攻击。 三、登录日志 知己知彼,战斗才能胜利。...核心代码如下,需要注意的是,ajaxForm接受的这两个回调函数,参数名是固定的无法修改,修改表单数据用的是formData,提交成功回调的结果名是responseText。
(3).关于status 由服务器返回的 HTTP 状态代码,200 表示成功,而 404 表示 "Not Found" 错误。当 readyState 小于 3 的时候读取这一属性会导致一个异常。...作为Ajax最常用的两种数据提交方式,GET和POST有着自己的特点和适用场景,正确区分GET和POST的不同并根据实际需要进行选用在开发中十分重要,简单但是关键! ?...五.success和complete的区别 JQuery封装的Ajax回调函数中,success、error、complete是最常用的三个,其中,success和error很好区别,一个是请求成功调用的...但是success和complete容易混淆,在这里特别做一个说明: success:请求成功后回调函数。 complete:请求完成后回调函数 (请求成功或失败时均调用)。...(状态码404、403、301、302...都会进入complete,只要不出错就会调用) 六.XML -> JSON Ajax中的是 "x" 指的就是XML。
,这个回调函数两个参数,第一个把Promise 改成为成功的状态,第二个参数把Promise改变成失败的状态,捕获成功和异常可以使用.then和.catch方法,这两个方法返回的也是一个Promise对象...// end 执行完之后才会执行这个 console.log(err) }) // end 会先执行 console.log('end') 不管Promise中有没有异步操作,then方法中的回调函数依然会进入回调队列中排队...catch方法捕获,而then方法传递两个回调函数的捕获异常的方式只会捕获谁上一个Promise的错误 ajax('/json1.json').then(ret => { console.log(ret...reason, promise) => { console.log(reason, promise) // reason 失败原因, // promise 失败的Promise }) 如果需要无论成功和错误都需要执行则可以用...("失败执行这个") }) .finally(function() { console.log("成功和失败都会执行这个") }); Promise 静态方法 Promise.resolve
告诉Ajax请求地址和请求方式 xhr.open('get','127.0.0.1'); 3. 发送请求 xhr.send(); 4....,表示动作被成功接收、理解和接受 3xx 重定向响应类,为了完成指定的动作,必须接受进一步处理 4xx 客户端错误,请求可能出错,妨碍服务器的处理 5xx 服务端错误,服务器不能正确执行一个正确的请求...t=' + Math.random()); 通过Math下的方法产生随机数,使请求地址不同 也可以使用Date下的方法,利用时间戳,也可以使值不同 Ajax的封装 给函数设定一些默认值 创建ajax对象...拼接转化用户传递参数格式 配置ajax请求方式和地址 对不同的方式进行不同的处理 最后对返回的数据进行输出 function ajax (options) { // 设置初始化的默认值 var defaults...if (xhr.status == 200) { // 调用成功回调函数, 并且将服务器端返回的结果传递给成功回调函数 defaults.success(responseText, xhr
【重点】为什么基本数据类型存在栈中,而引用数据类型存在堆中呢? 基本数据类型大小可控,应用类型数据大小不可控 栈的速度比堆内存的速度块 答案地址 4....主要记住客户端错误的状态码 状态码分类: 分类 分类描述 2** 请求成功 3** 重定向(需要进一步的操作以完成请求) 4** 客户端错误(请求包含语法错误或无法完成请求) 5** 服务器错误(服务器在处理请求的过程中发生了错误...思路:用时间戳来判断是否已到执行时间,记录上次执行的时间戳,然后每次触发事件执行回调,回调中判断当前时间戳距离上次执行时间戳的间隔是否已经达到时间差(Xms) ,如果是则执行,并更新上次执行的时间戳...请求的成功回调,一个事件绑定的回调方法,一个setTimeout的延时回调,或者一个函数内部返回另一个匿名函数,这些都是闭包。...作用: 可以在函数外部读取闭包函数内部作用域的变量 可以让这些变量始终保持在内存中,ajax中请求成功的回调函数就利用了闭包的这个特效 封装私有变量 示例地址 缺点以及解决方法: 由于闭包会使函数中的变量都被保存在内存中
对象,添加.then和.catch函数,等待结果promise对象内,当调用了resolve(),会把当前Promise对象,状态:'fulfilled'(成功),内部会回调.then()小括号里函数体执行...promise对象内,当调用了reject(),会把当前Promise对象,状态:'rejected'(失败),内部会回调.catch()小括号里函数体执行Promise的链式调用在.then()小括号里...Promise对象的成功结果回调地狱通俗说就是回调函数嵌套回调函数代码演示: myAjax('url', res => { .........不能获取到Promise对象内失败的结果,需要借助try+catch代码块来捕获使用await和async解决回调地狱const getListFn = async () => { const res...JS引擎,会先把回调函数推入 -- 微任务队列)宏任务:script标签,事件绑定代码,Ajax,定时器 → (浏览器,执行后把回调函数推入 -- 宏任务队列)注意:等执行栈空闲,先清空微任务队列里回调函数