I'm assuming I'm doing something really dumb here. I basically have an array that I'm passing into a function. I want to remove an element of that array and do a bunch of stuff to it, and then iterate through the rest of the array as long as there are still members in that array. When the array is empty, I want to loop back and run through the original array again.
However, I'm running into a weird issue when using array.shift(). It seems to be affecting the wrong variable if that even makes sense.
Abstract example as follows:
var originalArray = [1,2,3,4,5,6,7,8,9]
function goThroughArray(array){
var untouchedArray = array
console.log('untouched array before is ' + untouchedArray)
var insideArray = untouchedArray
console.log('inside array is ' + insideArray)
var removedNumber = insideArray.shift()
console.log('removed number: ' + removedNumber + ' from insideArray')
console.log('inside array after is ' + insideArray)
console.log('untouched array after is ' + untouchedArray)
}
goThroughArray(originalArray)
The console log output yields:
untouched array before is 1,2,3,4,5,6,7,8,9
inside array is 1,2,3,4,5,6,7,8,9
removed number: 1 from insideArray
inside array after is 2,3,4,5,6,7,8,9
untouched array after is 2,3,4,5,6,7,8,9
This is without any looping going on. Can someone explain why doing the shift() on the insideArray ALSO affects the untouchedArray??
I would expect that the insideArray would lose it's first member which is stored as "removedNumber" but why is the untouchedArray also losing it's first member?
EDIT
function addOne(number){
console.log('number in is: '+number)
var original = number;
var modified = original
console.log('original before is ' + original)
console.log('modified before is ' + modified)
modified++
console.log('original after is ' + original)
console.log('modified after is ' + modified)
}
addOne(1)
Yields:
number in is: 1
original before is 1
modified before is 1
original after is 1
modified after is 2
NEW EDIT
Although this question is super old, I figured I would update with a much cleaner method to solve this question:
JSON.parse(JSON.stringify(obj))
will create a copy of the object.
In Javascript objects are never copied. If you write
var a = [1, 2, 3, 4];
var b = a;
both a
and b
are just pointers to the same array object. Thus for example executing a.push(99)
you will see the new element when dumping b
too.
It seems that copies are done with immutable types like numbers or strings:
var a = 14;
var b = a;
b = b + 3;
console.log(a); // still 14
but this happens because the +
operator returns a new number object and b
is bound to this new one instead of the old one.
If you need to make a copy you must do that explicitly. For arrays the solution is calling the slice
method passing no parameters.
var b = a.slice(); // Makes a new independent copy of the array
In JS, assignments are done by value:
var a = 1,
b = a; // 1 (by value)
a = 2;
b; // 1 (not modified)
However, in the case of objects, that value is a reference in memory. That means that if you modify a property of the object, you will see the change in all variables:
var obj1 = {},
obj2 = obj1;
obj1.foo = 'bar';
obj2.foo; // 'bar' (the change is reflected in the other variable)
obj1 = {}; // However, if you replace the entire object, the change
// won't be reflected because assignments are done by value
obj1.foo; // undefined
obj2.foo; // 'bar'
I am building a script that calculates the genetics of animals that are bred together. Each animal has a set of genes (e.g. BbEeKk) and the program should calculate all the genetic possibilities of ...
I am building a script that calculates the genetics of animals that are bred together. Each animal has a set of genes (e.g. BbEeKk) and the program should calculate all the genetic possibilities of ...
I'm really wondering if this is possible. Right now I'm designing a new personal website for myself with HTML5/CSS3, and I found some nice javascripts to execute on my site such as snowing effects ...
I'm really wondering if this is possible. Right now I'm designing a new personal website for myself with HTML5/CSS3, and I found some nice javascripts to execute on my site such as snowing effects ...
How can I change the background/highlight color of the column group in the following fiddle to another color than the light blue that shows by default? I have tried using plotOptions in various ways ...
How can I change the background/highlight color of the column group in the following fiddle to another color than the light blue that shows by default? I have tried using plotOptions in various ways ...
Hello this is my code i am trying to prevent form submit when button is clicked, and load ajax. but form continue to submits, I tried to add preventDefault, and onsubmit false parametar but no luck. ...
Hello this is my code i am trying to prevent form submit when button is clicked, and load ajax. but form continue to submits, I tried to add preventDefault, and onsubmit false parametar but no luck. ...