2 dimensional JavaScript Array generated by for loop is being overwritten by last loop result

Question

Im trying to make pseudo-random sequence generator that works just line Linear Feedback Shift Register. Im doing it in JavaScript because its the only language that I know and im using HTML to create GUI. User should type in initial value and get schematic diagram and pseudo-random sequence itself. Here is my JavaScript code:

var UserInput = document.getElementById('ulaz');
var Output = document.getElementById('izlaz');

//variable `data` is an array of objects which I used to store pictures of circuits
// and [taps][3] necessary for shift registers to give max possible length output
// before going into loop which is 2^n-1, where n (`bit` in my code) is number of 
//register blocks and number of digits in input value.

function pss (){
    var data = [
        {
            slika:"pic/2bit.png",
            tap:[0,1]
        },
        {
            slika:"pic/3bit.png",
            tap:[0,2]
        },
        {
            slika:"pic/4bit.png",
            tap:[0,3]
        },
        {
            slika:"pic/5bit.png",
            tap:[1,4]
        },
        {
            slika:"pic/6bit.png",
            tap:[0,5]
        },
        {
            slika:"pic/7bit.png",
            tap:[0,6]
        },
        {
            slika:"pic/8bit.png",
            tap:[1,2,3,7]
        },
        {
            slika:"pic/9bit.png",
            tap:[3,8]
        },
        {
            slika:"pic/10bit.png",
            tap:[2,9]
        },
        {
            slika:"pic/11bit.png",
            tap:[1,10]
        },
        {
            slika:"pic/12bit.png",
            tap:[0,3,5,11]
        },
        {
            slika:"pic/13bit.png",
            tap:[0,2,3,12]
        },
        {
            slika:"pic/14bit.png",
            tap:[0,2,4,13]
        },
        {
            slika:"pic/15bit.png",
            tap:[0,14]
        },
        {
            slika:"pic/16bit.png",
            tap:[1,2,4,15]
        },
        {
            slika:"pic/17bit.png",
            tap:[2,16]
        },
        {
            slika:"pic/18bit.png",
            tap:[6,17]
        },
        {
            slika:"pic/19bit.png",
            tap:[0,1,4,18]
        },
        {
            slika:"pic/20bit.png",
            tap:[2,19]
        },
        {
            slika:"pic/21bit.png",
            tap:[1,20]
        },
        {
            slika:"pic/22bit.png",
            tap:[0,21]
        },
        {
            slika:"pic/23bit.png",
            tap:[4,22]
        },
        {
            slika:"pic/24bit.png",
            tap:[0,2,3,23]
        },
        {
            slika:"pic/25bit.png",
            tap:[2,24]
        },
        {
            slika:"pic/26bit.png",
            tap:[0,1,5,25]
        },
        {
            slika:"pic/27bit.png",
            tap:[0,1,4,26]
        },
        {
            slika:"pic/28bit.png",
            tap:[2,27]
        },
        {
            slika:"pic/29bit.png",
            tap:[0,28]
        },
        {
            slika:"pic/30bit.png",
            tap:[0,3,5,29]
        },
        {
            slika:"pic/31bit.png",
            tap:[2,30]
        },
        {
            slika:"pic/32bit.png",
            tap:[1,5,6,31]
        }
    ];
    var first = UserInput.value.split("");
        for (k=0;k<first.length;k++) first[k] = +first[k]; 
               //first is just UserInput separated in one char strings than parsed to integers
    var bit = first.length - 2;
          // I subtracted 2 here so I can access objects from data
    var matrix = [first];
    var t = 0;
    var between;
    var z;

    for (i=1; i<Math.pow(2, bit+2)-1; i++){     //here is that 2^n-1. +2 is because i had -2 before. For loop is starting from 1 and ending with <2^n-1 because i already have first array of matrix
        for (j=0; j<data[bit].tap.length; j++){
            z = data[bit].tap[j];
            t = t ^ matrix[i-1][z];
        }      // this for makes "t" which is all taps XOR-ed. If user input was 101, tap would be [0,2] and t would be 1xor1=0
        between = matrix[i-1];
            console.log(between);
        between.unshift(t);
        between.pop();
        matrix[i] = between;
        t=0;    // here Im "shifting registers" or just placing t in front of last generated row and removing its last digit, thus generating new row 
    }   
console.log(matrix);
}

and here is HTML so you can run it.

variable data is an array of objects which I used to store pictures of circuits and taps necessary for shift registers to give max possible length output before going into loop which is 2^n-1, where n (bit in my code) is number of register blocks and number of digits in input value.

So problem is: console.log(between); which logs last generated row is all correct except, ofc, there is no last row because it shows last generated, but than console.log(matrix) which should log complete matrix , shows all rows overwritten by last one. So for user input 101, matrix should be

101
010
001
100
110
111
011

but is just

011
011
011 ...

I cant figure out what is wrong with it if part before console.log(between); is all fine...

P.S. Code is not finished it wont display solution in HTML, and there still needs to be part of function that makes an array from last column of matrix, which is pseudo-random sequence.

Answer 1

I realized that var between refers to the same array as var matrix[i-1], rather than a new, independent array.

between = matrix[i-1];

So, if you want to store only values of matrix[i-1], not to create reference, you can do this like this:

between = JSON.parse(JSON.stringify(matrix[i-1]));

In js when you copy array in some variable, you create reference of that array by default. There are many ways to avoid this, and you can find many examples here.

Answer 2

I do not know why but I've come to a solution (will investigate more when I get free time).

for (i=1; i<Math.pow(2, bit+2)-1; i++){     //here is that 2^n-1. +2 is because i had -2 before. For loop is starting from 1 and ending with <2^n-1 because i already have first array of matrix
    for (j=0; j<data[bit].tap.length; j++){
        z = data[bit].tap[j];
        t = t ^ matrix[i-1][z];
    }      // this for makes "t" which is all taps XOR-ed. If user input was 101, tap would be [0,2] and t would be 1xor1=0
    between = matrix[i-1];
    console.log(between);
    between.unshift(t);
    between.pop();
    // MODIFICATION
    var between_string = between;
    matrix[i] = between_string.join(); // Turn it to a string
    matrix[i] = matrix[i].split(','); // Turn it back to array to keep it working on the for loop above.
   // END MODIFICATION

    t=0;    // here Im "shifting registers" or just placing t in front of last generated row and removing its last digit, thus generating new row 
}   

Now, when you print it out in the console it'll show you a bidimentional array, although it's weird, sometimes (on my console) it shows int numbers and sometimes mixed with string numbers (respecting the original value of between).

Edit: I tried only using "101" for the input.

Second edit: Okay, I feel ashamed, the reason why it returns [1, "0", "0"] (example) is because of split(',') for "1,0,0"(only tow numbers were preceded by comas). Haha. Sorry.