赵鑫20200924
学习总结
pormise
1.异步问题
假设现在我刚认识你,需要和你说话,但是我普通话不够标准,需要间隔一秒钟才能说一句话,以此让你可以慢慢思考。这样的话我们就需要用到定时器。
最沙雕的代码如下:
setTimeout(
function(){
console.log('你好,我是saoge');
setTimeout(
function(){
console.log('很高兴认识你');
setTimeout(
function(){
console.log('交个朋友吧');
},1000)
},1000)
},1000)
但是这种代码,是根本没有可读性的。因此我们还有另一种写法。
function helloOne(next){
setTimeout(function(){
console.log('你好,我是saoge');
next();
},1000)
}
function helloTow(next){
setTimeout(function(){
console.log('你好,很高兴认识你');
next();
},1000)
}
function helloThree(){
setTimeout(function(){
console.log('交个朋友吧');
},1000)
}
helloOne(function(){
helloTow(function(){
helloThree()
})
})
用回调函数来实现代码看上去会有逻辑性的多,但是在调用的时候也会存在层层嵌套的问题,如果这个时候我是个话痨,要和你说很多据话,那么用回调函数写出来的代码也是相当恐怖的,而且采用这种方式并不能很方便的改变执行的顺序等。总而言之就是因为总总不好,所以出现了更好的方式promise。
使用Promise
使用new来创建一个Promise的实例。
var promise = new Promise(function(resolve,reject){
setTimeout(function(){
resolve('你好,我是saoge');
reject(new Error('发生错误'));
// if(false){
// resolve('你好,我是saoge');
// }else{
// reject(new Error('发生错误'))
// }
},1000)
})
promise.then(function(data){
console.log(data);
},function(err){
console.log(err)
})
//使用catch
promise.then(function(data){
console.log(data);
}).catch(function(err){
console.log(err);
})
我们来一步一步的分析上述案例。
在上述实例中,Promise传入了两个形参 resolve 和 reject 这两个参数的回调,代表成功和失败,如果执行正常,就调用resolve,否则就调用reject。上代码:
var promise = new Promise(function(resolve,reject){
//成功时调用resolve
//失败时调用reject
})
同时,promise实例具有then方法,then方法接受两个参数,第一个参数时resolve执行成功的回调,第二个参数reject 是执行失败的回调。
因此,在上述案例中,最终会输出 "你好我是骚哥"
我们可以用if语句来模拟一下执行失败的情况,这个时候输出的就是 Error:发生错误
同时,Promise实例还提供了一个catch()方法,该方法和then()方法接收的第二个参数一样,用来执行reject的回调。
var promise = new Promise(function(resolve,reject){
//成功时调用resolve
//失败时调用reject
})
promise.then( resolve的回调 , reject 的回调(可选) );
promise.catch(reject的回调);
我们用Promise来实现一下最初对话的案例。
function helloOne() {
return new Promise(
function(next) {
setTimeout(function() {
console.log('你好,我是saoge');
next();
}, 1000)
})
}
function helloTwo() {
return new Promise(
function(next) {
setTimeout(function() {
console.log('你好,很高兴认识你');
next();
}, 1000)
})
}
function helloThree() {
return new Promise(
function(next) {
setTimeout(function() {
console.log('交个朋友吧');
next();
}, 1000)
})
}
helloOne().then(helloTwo).then(helloThree);
和使用回调的区别在于,我们将要执行的代码放在了Promise实例中,这样,在我们最后需要执行的时候,只需要用then()方法去调用即可,语法结构简单,即使我想说再多的话也不会造成代码结构混乱。且在这里使用了Promise方法之后,如果是我想要改变代码执行顺序的话只需要改变then()方法传入的值即可。
异步之间传参
function hello(){
var text='你好,我是saoge';
setTimeout(function(){
console.log(text);
say(text);
},1000)
}
function say(text){
setTimeout(function(){
console.log(text)
},1000)
}
hello();
学习心得
学习的东西理解性比较强,需要多思考。总的来说感觉还不错,但是需要总结的东西太多,得利用假期好好总结一下学习过的知识点,不然都会忘掉。
评论留言