1.什么是 es6?

是 ECMAScript 的第六个版本 在 es5 的基础上新增加了一些语法
js 分成三部分 dom(文档对象模型) bom(浏览器对象模型) ECMAScript(js 语法)

2.promise概念?

promise 是 es6 提供的一种异步解决方案,在我的理解中 promise 就是把异步操作换了一种写法
从之前的嵌套回调函数 变成了链式的写法
promise 本身其实就是一个容器 里面放异步的代码 这样就可以让这个异步的代码执行.then .catch 的操作

2.1. 说⼀下你对promise的理解?

promise 是 es6 提供的一种异步解决方案,在我的理解中 promise 就是把异步操作换了一种写法
从之前的嵌套回调函数 变成了链式的写法

2.2. 什么是promise?通过promise能够解决什么问题?

promise 是 es6 提供的一种异步解决方案,
promise 可以解决回调地狱的问题
回调地狱就是拿到 a 接口的数据后才能根据 a 返回的数据请求 b 接口
这样回调函数嵌套回调函数的写法就叫回调地狱
这种写法会让代码臃肿 并且后期难以维护
除了 promise 之外 async 是解决回调地狱的最终方案

  <script src="JQuery.js"></script><script>// 拿到a的数据后才去请求b,拿到b的数据后再去请求c 这就叫回调地狱// 像这种回调嵌套回调的写法就叫回调地狱$.ajax({method: "get",url: "data.json",success(res) {console.log(res);$.ajax({method: "get",url: "data2.json",success(res) {console.log(res);$.ajax({method: "get",url: "data3.json",success(res) {console.log(res);},});},});},});//jq的ajax本身就是一个promise对象$.ajax({method: "get",url: "data.json",}).then((res) => {console.log(res);return $.ajax({method: "get",url: "data2.json",});}).then((res) => {console.log(res);return $.ajax({method: "get",url: "data3.json",});}).then((res) => {console.log(res);console.log("最终拿到的", res);});//用promise 的方法处理回调地狱// es7的时候出了一个async和await 是解决回调地狱的终极方案async function getdata() {let data = await $.ajax({method: "get",url: "data.json"});console.log(data);let data2 = await $.ajax({method: "get",url: "data2.json"});console.log(data2);let data3 = await $.ajax({method: "get",url: "data3.json",});console.log(data3);return data3;}// async函数return的永远是一个promise对象getdata().then((res) => {console.log(res);});function handler() {let data = ""$.ajax({method: "get",url: "data.json",success(res) {data = res;}});console.log(data);}handler()function* getdata2() {yield $.ajax({method: "get",url: "data.json"})yield $.ajax({method: "get",url: "data2.json"})yield $.ajax({method: "get",url: "data3.json"})}let obj = getdata2();obj.next().value.then(res => {console.log(res);return obj.next().value}).then(res => {console.log(res);return obj.next().value}).then(res => {console.log("generator拿到的数据", res);})//用generator处理回调地狱 但是这种写法一般不用因为async已经取代了generotor</script>

2.3. 说⼀下 promise 的特点?也就是三种状态?

promise ⼀共有三个状态,分别是进⾏中,成功或者失败 如何成功的话可以通过 resolve ⽅法将正确结
果返回出去,通过.then 的⽅式进⾏接受,失败的话可以通过 reject 的⽅式将失败的结果返回出去,通 过.catch 的⽅式进⾏接受,pending 状态是进⾏中,⼀旦进⾏之后,他的状态是不可逆的

2.4. 说⼀下 promise 怎么⽤?

如果要使⽤ promise,我们需要对 promise 进⾏实例化,在实例化的构造函数⾥⾯有⼀个回调函数,这个
回调函数⾥⾯有两个参数,分别是 resolve 和 reject,我们可以通过 promise 的实例化对象调⽤.then 或 者.catch ⽅式接受结果

 <script>//封装 promiselet xhr = new XMLHttpRequest();//第一步创建xhr对象xhr.open("get", "./data.json", true);//第二步:设置请求的基本信息 如果是post请求在这里要设置一个头信息// get方式传参是在路径后面? 拼接 而post是在send里传// 第三个参数 可以控制异步同步 true就是异步xhr.send();//第三步:向服务器发送链接// xhr.onreadystatechange = function() {//     console.log(xhr.readyState);//     if (xhr.readyState == 4 && xhr.status == 200) {//         console.log(xhr.responseText);//     }// };// 第四步 在xhr对象和服务器都响应成功的时候拿到数据// 可以用onreadystatechange 事件这个事件的意思是 只要xhr的状态发生改变就会触发 需要判断xhr的状态为4 服务器的状态为200 就代表都准备好了 我们就可以拿到数据了// 也可以用下面的onload事件代替 onload本身就代表xhr对象已经准备好了 所以我们只需要判断服务器的状态是200就可以拿到数据了// responseText就是拿到的数据xhr.onload = () => {if (xhr.status == 200) {// console.log(xhr.responseText);} else {}};//onload事件在js中是加载完成// 把上面的原生js请求ajax的普通写法变成promise的写法function js_ajax(params) {return new Promise((resolve, reject) => {let xhr = new XMLHttpRequest();xhr.open(params.method, params.url, true);xhr.send();xhr.onload = () => {if (xhr.status == 200) {let res = JSON.parse(xhr.responseText);resolve(res);} else {reject("请求失败");}};});}//把异步请求放进promise容器中 就变成一种promise的写法 then就执行成功的resolve回调cathc就执行失败的reject回调js_ajax({method: "get",url: "./data.json",}).then((res) => {console.log(res);}).catch((err) => {console.log(err);});// js封装的promise处理回调地狱的写法js_ajax({method: "get",url: "./data.json",}).then((res) => {console.log(res);return js_ajax({method: "get",url: "./data2.json",});}).then((res) => {console.log(res);return js_ajax({method: "get",url: "./data3.json",});}).then((res) => {console.log(res);});</script>

2.5. 我们之前遇到的哪些东西本身就是一个 promise 对象?

jq 的 ajax 请求本身就是一个 promise 对象 所以可以直接用.then
axios 也是一个 promise 对象

原生的 ajax 以及 小程序的 wx.request 请求都不是 promise 对象 不能用。then 的写法,如果想用链式写法 就要自己封装一个 promise

3.promise 的 all 和 race 方法

promise 还给我们提供了.all 和 race, 其中 all ⽅法的作⽤是将多个请求合并成⼀个请求, ⽐如当⾸⻚
要请求 10 个接⼝,我们可以 promise.all 进⾏合并,.race 的作⽤也可以将多个请求合并成⼀个请求,不过
是谁先请求成功就先返回谁.

 <script src="./JQuery.js"></script><script>Promise.all([$.ajax({url: "data.json",}),$.ajax({url: "data2.json",}),$.ajax({url: "data3.json",}),]).then((res) => {// console.log(res);let [data, data2, data3] = res;//解构数组console.log(data, data2, data3);}).catch(err => {console.log(err);})//all方法可以并发请求 同时发送多个请求 当所有的请求都成功的时候才会执行then方法 res是一个数组 放的就是请求到的数据Promise.race([$.ajax({url: "data.json",}),$.ajax({url: "data2.json",}),$.ajax({url: "data3.json",}),]).then((res) => {console.log(res);});// race方法 也是执行多个请求 谁先请求成功就会执行then方法并且得到请求到的数据</script>

4.说⼀下 async 和 await、以及他们和 promise 的区别?

⾸先 async 和 await 是解决异步的终极⽅案,async 和 await ⼀般配和使⽤,当我
们给函数前⾯加上关键字 async,这个时候,这个函数的返回值就是⼀个 promise. ⽽ await 是⼀个同步
的操作,await 只能配合 async 只能,不然会报错,await 后⾯可以是表达式,也可以是⼀个 promise,在
await 下⾯的代码必须得等待 await 执⾏完之后才能在执⾏
他们和 promise 的区别就是在写法上更加的简洁.
以上就是我对 async 和 await 的理解.

5.generator 函数

generator 函数也是 es6 的处理异步回调的一种写法 但是这种写法现在被 async 取代了
generator 函数 用*表示 跟 yield 搭配使用

6.说⼀下 var 、let、const 之间的区别

  1. let var 是声明变量的 const 是声明常量的
  2. var 声明的变量会声明提升 但是 const 和 let 不会 (声明提升就是声明的变量会把声明语句提到作用域的顶端 但是赋值语句留在原地)
  3. var 在全局作⽤域下声明变量会导致变量挂载在 window 上,其他两者不会
  4. let 和 const 声明的是块级作用域 var 声明的是函数作用域

块级作用域:只要是大括号就能区分作用域
函数作用域: 只有函数才能区分作用域

 <script>// console.log(num);var num = 10;// var 声明的变量会把声明语句提到作用域的顶端 但是赋值语句留在原地function fun1() {// console.log(str);var str = "aaa";}// console.log(str);// console.log(num2);let num2 = 20;// console.log(window.num);// console.log(window.num2);// 变量的作用域的概念就是 变量可以活动的范围 出了这个作用域 就没有这个变量了//   var 变量的作用域是函数作用域 也就是说只有函数的{}能区别var变量的作用域别的都不行//   let const 块级作用域 只要看到{}就是一个作用域{let data = "大怨种";var data2 = "小怨种";}console.log(data2);console.log(data);</script>

前端工程师,Es6面试题?promise概念?相关推荐

  1. 2010年3月再谈前端工程师的笔试题

    最近在收集前端开发工程师的笔试题,正好看到Adam Lu.的这篇博客,感觉挺不错的转载过来! HTML && CSS 1.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分 ...

  2. 2010 前端工程师的笔试题

    最近在收集前端开发工程师的笔试题,正好看到Adam Lu.的这篇博客,感觉挺不错的转载过来! HTML && CSS 1.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分 ...

  3. 今日头条2017前端工程师实习生笔试题

    1.下面标签嵌套正确的是 答案: D  <ul><p>牛客网</p></ul> <a href="#"><a hr ...

  4. 【无标题】前端工程师面试题手册-有点长但是很有用

    不是原作者-想想要获取更多前端开发相关学习资料,请加微信1124692领取 前端工程师面试题手册 目录 1 | 前端基础........................................ ...

  5. 2016-2019年最新前端工程师面试题

    点击链接 https://github.com/HerbertKarajan/Fe-Interview-questions 时常更新,给大家一个最全的资料,我会不断的更新到github上...... ...

  6. 前端工程师300道面试题整理

    备注:由于整理很麻烦就没有去重,大家将就着看吧┑( ̄Д  ̄)┍ 1.手写jsonp的实现 2.手写链表倒数第K个查找 3.http请求头,请求体,cookie在哪个里面?url在哪里面? 4.原型链的 ...

  7. vue 高阶面试题_高级Web前端工程师面试之Vue问题汇总解析

    又是一年毕业季,很多学习前端的同学面对激烈的求职竞争倍感压力,想要了解企业招聘会提问哪些问题.今天千锋郑州Web前端培训小编就给大家分享一下高级Web前端工程师面试中有关Vue的问题及解析. 1.Vu ...

  8. 前端的c语言面试题,前端工程师面试题汇总(选择题)

    前端工程师面试题汇总(选择题) 时间:2017-12-05     来源:前端工程师面试题推荐 作为一名前端工程师,我们必不可少的就是参加面试,面试过程中会遇到各类奇葩的问题,今天小编为大家汇总了一些 ...

  9. 前端的c语言面试题,前端工程师面试题及答案

    完成面试题是前端工程师求职者在面试过程中必须经历的环节.下面是由学习啦小编分享的前端工程师面试题,希望对你有用. 前端工程师面试题:CSS 1. CSS样式表根据所在网页的位置,可分为?(B ) A. ...

最新文章

  1. java fork_浅谈Java的Fork/Join并发框架
  2. python要学哪些_学python都要学哪些内容?
  3. 肝!Python 教程:从零到大师
  4. spark Rdd 操作transformaction和action等
  5. UVa810 A Dicey Problem 筛子难题
  6. 如何解决秒杀的性能问题和超卖的讨论
  7. python linux log,linux,python 常用的处理log的命令
  8. 转载]Cyclone II JTAG ASP 配置下载程序
  9. edge新版 能够正则式_在最近的一项HTML5测试中,新版Edge浏览器表现满分
  10. java之点击一次之后失效_JavaScript 事件绑定只能执行一次了,再次点击就变得无效 ,求助怎么回事...
  11. WINDOWS下简单操作SQLITE3
  12. paip.java优缺点attilax总结c0.doc
  13. 改进型MUSIC算法(python)
  14. 怎样将计算机和电视机连接网络,家里怎么连接网络到电视机,让电脑和电视都可以上网。...
  15. 如何绕过强制门户——克隆 MAC 地址
  16. kinit什么意思_kerberos入坑指南
  17. 在网上疯传的行动艺术照
  18. 企业微信认证上网推广的好处
  19. 双子星量子计算机,【前沿】“前途”无量的量子科技
  20. CAD手机看图软件中如何根据已知坐标点绘制线段?

热门文章

  1. Linux删除目录非空的文件夹命令
  2. 我的家计算机教学反思,《我家》教学反思
  3. 下载: Excel Viewer 2003
  4. socketio客户端api
  5. 动态扩展Rest接口地址,动态卸载Rest接口
  6. NFT 为何能够重塑艺术价值?
  7. JAVA的OPENGL,JOGL入门例子(四)----富视觉的螺旋体
  8. 电脑照片误删了怎么恢复
  9. EasyPlayer:安卓播放器Android MediaMuxer录像(支持G711音频)支持MP4、音视频同步
  10. MTK平台通话音量配置