Как можно оставить это свойство, но при этом чтобы слайдер работал нормально и не прокручивал в начало после последнего элемента?

$(document).ready(() => {


$('.slider-for').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
fade: true,
asNavFor: '.slider-nav'
});
$('.slider-nav').slick({
arrows: false,
slidesToShow: 3,
slidesToScroll: 1,
/* asNavFor: '.slider-for', */
centerMode: true,
focusOnSelect: true,
autoplay: true,
autoplaySpeed:1000
});
});
* {
transition: .5s;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.css" rel="stylesheet"/>

<!-- libraries -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js"></script>

<div class="slider-for">
<div class="item">
1
</div>
<div class="item">
2
</div>
<div class="item">
3
</div>
<div class="item">
4
</div>
<div class="item">
Сейчас перемотает в начало
</div>
</div>

<div class="slider-nav">
<div class="item">
1
</div>
<div class="item">
2
</div>
<div class="item">
3
</div>
<div class="item">
4
</div>
<div class="item">
Сейчас перемотает в начало
</div>
</div>