$.each() index start number in jQuery

Question

How do I start jQuery $.each() index from 1 instead of 0?

I am using .each function to populate select box. So here I want to populate options in the select box from 1. So based on a condition I want to add option in first index i.e 0.

Answer 1

You can start at any given starting value by simply adding that number to the current loop-set index value.

$.each(arrayOrObject, ( index ) => {

    index += 1 //or any other starting value
    if (items[index] === undefined)
        return false;

    // your code
});

EDIT

One comment said it doesn't work, so here's a working code. You see the results in console.

$('#go').click((e) => {
  e.preventDefault();

  const items = $('.item');
  const startingNumber = $('#startingNumber').val() * 1;

  $.each(items, (index) => {

    index += startingNumber;

    if (items[index] === undefined)
      return false; //this prevents the loop to go on after reaching the end

    console.log(items[index]);
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<style>
  .flex-container {
    display: flex;
    flex-wrap: wrap;
    gap: .2em;
    margin-top: 1em;
  }
  
  .item {
    background: #f0f0f0;
    display: flex;
    flex: 1 0 30px;
    justify-content: center;
    padding: .5em;
  }
</style>

<input id="startingNumber" type="number" min="0" max="5" value="1">
<input id="go" type="submit">

<div class="flex-container">
  <div class="item">0</div>
  <div class="item">1</div>
  <div class="item">2</div>
  <div class="item">3</div>
  <div class="item">4</div>
  <div class="item">5</div>
</div>

Answer 2

Seeing the clarification points in the comments below, jQuery.each or some variation thereof isn't the right tool at all. Use a for loop, and add 1 to the index to output the value of the <option>.

Use .prepend to insert an option as the first child of a select:

for (var i = 0; i < 10; i++) {
    $('select').prepend('<option>' + (i + 1) + '</option>');
}

Answer 3

You can't. Why not just declare another variable at the first line of the function var myIndex = index + 1;?

Answer 4

Not possible. jQuery.each loops over Objects (Arrays). For real objects, it uses a for in loop. Objectpropertys don't have a guaranteed index at all by the way.

For Arrays it uses standard for loop, but you don't have access to the starting index.

Your best shot is to just skip the first element.

$.each(obj, function(index, elem) {
    if( index === 0 )
        return true;

    // code
});