1、什么是promise
- promise是一个对象,是用来处理异步操作的
2、promse有什么用:
* 避免回调地狱
* promise可以支持多个并发的请求,获取并发请求中的数据
* 这个promise可以解决异步的问题(把异步变同步),本身不能说promise是异步的
* axios.get axios.post得到的也是一个promise对象
- 2.1 避免回调地狱
// 首先获取商品id ,然后根据商品id 查询商品详情
let url =" 接口地址";
axios.get(url).then(res=>{
return new Promise((resolve,reject) =>{
let id = res.goodsId
axios.get(url,{goodsId:id}).then(res=>{
resolve(res); //请求成功后
}).catch(err=>{
reject(err); //请求失败后
})
})
}).then(res=>{ //链式书写
res.xxxx
return new Promise((resolve,reject)=>{
axios.get(url,{id:res.xxxx}).then(res=>{
resolve(res); //请求成功后
}).catch(err=>{
reject(err); //请求失败后
})
})
})
- 2.2 支持多个并发请求(需求:所有的请求都得到数据之后再显示页面)
通过Promise.all() 方法
var p1,p2,p3
p1 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("foo");
}, 3000);
})
p2 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("oof");
}, 2000);
})
p3 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("ofo");
}, 1000);
})
//参数是一个数组
Promise.all([promise1,promise2,promise3]).then(res=>{
[res,res,res]
})
- 2.3 当有多个请求的时候,方法返回一个 promise,一旦迭代器中的某个promise解决或拒绝,返回的 promise就会解决或拒绝
通过Promise.race()方法
var p1,p2,p3
p1 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("foo");
}, 3000);
})
p2 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("oof");
}, 2000);
})
p3 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve("ofo");
}, 1000);
})
//参数是一个数组
Promise.race([promise1,promise2,promise3]).then(res=>{
console.log(res)
}).catch(err=>{
console.log(err);
})
3、 async/awiat 的错误处理
async function f() {
// throw new Error('try again');
await Promise.reject('出错了');
await Promise.resolve('hello world'); // 不会执行
}
async function b() {
try { //可能会报错的代码
await f();
} catch(err) { // 捕获异常
console.log(err);
b();
}
}
b();
4、防抖与节流
4.1 什么是防抖(debounce)
- 就是在一定的时间内事件只发生一次,比如你点击button按钮,1秒内任点击无数次,他也还是只触发一次。
<body>
<button id="debounce">防抖</button>
<script>
window.onload = function () {
let obtn = document.getElementById('debounce'); //获取按钮
obtn.addEventListener('click',debounce,false); //监听绑定事件
}
//执行函数
let timer
function debounce() {
clearTimeout(timer);
//setTimeout () 在几秒后执行某个方法
timer = setTimeout(function(){
console.log('防抖,防抖,防抖');
},300)
}
</script>
</body>
4.2有什么用
- 当你在页面中使用onkeyUp监听用户在input框中的输入,如果用户按住一个6不放,那监听事件岂不是一直被触发,这样就浪费了一部分性能了,那么我们在一定事件内监听,也就是说我过了一秒再来看看你输入了多少个6
4.3 节流 (throttle)
- 节流就是在一定时间间隔内触发一次事件
5、JavaScript代码中的‘use strict’是什么意思
- js 开发的严格模式
6、说说你对amd和commonjs的理解
- Commonjs是前端模块化的一种规范,同步加载模块,主要使用于服务器端模块化开发,目前使用该规范的有nodejs
- AMD:是由commonjs衍生出来的用在浏览器端的异步模块加载规范,实现该规范的技术有require.js
- CMD:同步模块加载规范,实现该规范的技术有sea.js
网友评论