difference between calling of pre-middleware with next and without next

Question

i wan't to know what's the difference between calling the middleware with next and without next

example without next All middleware run perfectly fine without next also

tourSchema.pre('save', function () {
  console.log('second middleware is getting called');
  const currentDoc = this;
  const slugDocument = slugify(currentDoc.name, { lower: true });
  this.slug = slugDocument;
  console.log('after addition of slug', this);
});
tourSchema.pre('save', function () {
  console.log('third pre middleware is called');
});
tourSchema.pre('save', function () {
  console.log('4th middleware is getting called');
});

with next there seems to be no difference with calling next or without next. So whats the main difference between these two.

tourSchema.pre('save', function (next) {
  console.log('second middleware is getting called');
  const currentDoc = this;
  const slugDocument = slugify(currentDoc.name, { lower: true });
  this.slug = slugDocument;
  console.log('after addition of slug', this);
  next();
});
tourSchema.pre('save', function (next) {
  console.log('third pre middleware is called');
  next();
});
tourSchema.pre('save', function (next) {
  console.log('4th middleware is getting called');
  next();
});