当“读取”函数多次调用自身时(这实际上是通过块读取文件),我有这个(简化的)代码。问题在于,通过这样做(这就是我的想法),链条丢失,并且从未达到upload()函数的“then”。
换句话说,“hola”文本永远不会显示在控制台中。写这个的正确方法是什么?
谢谢,
https://jsfiddle.net/yewdmh2o/1/
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="#">Progression</a>
<a class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Physio</a></li>
<li><a href="#">Massage</a></li>
<li><a href="#">Beauty</a></li>
<li><a href="#">First Aid</a></li>
</ul>
</div>
</div>
</nav>
<!-- Carousel -->
<!-- opening div -->
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<!-- open listbox -->
<div class="item active">
<img class="img-responsive" src="https://lh4.googleusercontent.com/-aCIY16PFylg/VsW6L-YwpqI/AAAAAAAAADA/wSTG1QlJLqY/w1310-h524-no/Progression_Val_dIsere.png" alt="...">
<div class="carousel-caption">
<h4>Physio Massage Beauty First-Aid</h4>
</div>
</div>
<div class="item">
<img src="https://lh5.googleusercontent.com/-WHXl1TAoHoQ/VsW7_mHWeQI/AAAAAAAAAEQ/nzQm8w62c3s/w1310-h524-no/Progression_Massage_Budha.png" alt="...">
<div class="carousel-caption">
<h4>A wide range of Massage Therapies</h4>
</div>
</div>
<div class="item">
<img src="https://lh4.googleusercontent.com/-lj7DIStRI8M/VthrRPFcQFI/AAAAAAAAAFY/2ynRLjTZTnI/w1310-h524-no/Progression_Beauty_Therapies.png" alt="...">
<div class="carousel-caption">
<h4>Nails - Facials - Waxing</h4>
</div>
</div>
</div> <!--close listbox -->
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<!-- Glyphicon Cheveron Left removed -->
<span class="glyphicon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<!-- Cheveron Right removed -->
<span class="glyphicon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<!-- Home Content Container-->
<!-- container opener -->
<div class="container container-home">
<!-- open row -->
<div class="row">
<!-- colums -->
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<img src="images/physiotherapy-concept-360x165.jpg" alt="...">
<div class="caption">
<h3>Physiotherapy</h3>
<p>...</p>
</div><!-- close caption -->
</div><!-- close thumbnail -->
</div><!-- close colum -->
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<img src="images/massage360x165.jpg" alt="...">
<div class="caption">
<h3>Massage</h3>
<p>...</p>
</div><!-- close caption -->
</div><!-- close thumbnail -->
</div><!-- close colum -->
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<img src="images/Facial2-360x165.jpg" alt="...">
<div class="caption">
<h3>Beauty</h3>
<p>...</p>
</div><!-- close caption -->
</div><!-- close thumbnail -->
</div><!-- close colum -->
<div class="col-xs-12 col-sm-6 col-md-3">
<div class="thumbnail">
<img src="images/First-aid-360x165.jpg" alt="...">
<div class="caption">
<h3>First aid</h3>
<p>...</p>
</div><!-- close caption -->
</div><!-- close thumbnail -->
</div><!-- close colum -->
</div><!-- close row -->
</div><!-- close container -->
<!-- nav footer -->
<div class="navbar navbar-default navbar-fixed-bottom">
<!-- nav foot left items -->
<a href="#" class="glyphicon glyphicon-earphone pull-left">
<p class="navbar-text"> +33 62738 5646</p>
</a>
<div class="fblink">
<!-- nav foot right items FB #x2 -->
<a href="https://www.facebook.com/ProgressionPhysiotherapyMassageFirstAid/" class="fa fa-facebook-square fa-3x pull-right"></a>
</div>
</div><!-- close nav fix bottom -->
<nav class="navbar navbar-default navbar-fixed-bottom">
<ul>
<li><a href="#">+33 62738 5646</a></li>
<li text-align="right"><a href="#">massage@progressionski.com</a></li>
</ul>
<div class="fblink">
<!-- nav foot right items FB #x2 -->
<a href="https://www.facebook.com/ProgressionPhysiotherapyMassageFirstAid/" target="_blank" class="fa fa-facebook-square fa-3x pull-right"></a>
</div>
</nav>
编辑: 在@Bergi的帮助下解决,总是返回一个承诺,它可以保持链接过程并给出所需的结果,如下所示:
reading = function() {
start++;
upload();
};
var start = 0;
var end = 5;
var myArray = [3,5,7];
myArray.reduce(function(promise, item) {
return upload()
.then(function(){
console.log('hola');
})
})
function upload() {
if (start < end) {
console.log('doing')
reading();
} else {
console.log('finished')
return Promise.resolve();
}
}