Toggle array value on a index on button click Javascript

Question

I have a array and i want to toggle its value on 0 index on button click between 'x' and 'a' but this is not working.I can not understand what i am doing wrong i am new in JavaScript.

function toggle() {
    let array = ['x', 'r', 'r'];
    let i = 0;
    if (array[i] == 'a') {
        array[i] = 'x';
    }
    else {
        array[i] = 'a';
    }

    console.log(array)
}

<button onclick='toggle()'>Toggle</button>

expected output

["a", "r", "a"]
["x", "r", "a"]
["a", "r", "a"]
["x", "r", "a"]

but got

["a", "r", "a"]
["a", "r", "a"]
["a", "r", "a"]
["a", "r", "a"]

Move let array = ['x', 'r', 'r']; outside the function. Your current code is recreating the array anew each time the function runs. — user5734311
– user5734311, Commented Dec 22, 2019 at 9:56

CertainPerformance · Accepted Answer · 2019-12-22 09:57:29Z

2

Declare the array outside of toggle, so that changes to it can be observed over multiple calls of toggle:

const array = ['x', 'r', 'r'];

function toggle() {
  let i = 0;
  if (array[i] == 'a') {
    array[i] = 'x';
  } else {
    array[i] = 'a';
  }

  console.log(array)
}

<button onclick='toggle()'>Toggle</button>

Otherwise, you'll be creating a new array containing ['x', 'r', 'r'] on every call, so it'll change the first element from an x to an x and log ["a", "r", "a"] every time.

edited Dec 22, 2019 at 9:57

answered Dec 22, 2019 at 9:56

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Toggle array value on a index on button click Javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related