Keep original array after JavaScript function

Question

I'm sure there is an easy answer for this, though I only really have experience with PHP. Why does the "pizza" array change when I pass it to my function as "my_pizza" and only make changes to "my_pizza"? How do I keep my original array I pass to the function outside of the function? Once the function is finished running, the pizza array should have not changed. I noticed if I change my string variable (pie) it will stay the same after the function runs, unlike the array.

In short, I want the first set of results to be identical to the second.

var pizza = [];
pizza.push('crust');
pizza.push('ham');

var pie = "apple"

function bake_goods(my_pizza, my_pie){
    console.log(my_pizza);
    console.log(my_pie);

    delete my_pizza['1'];
    my_pie = "peach";

    console.log(my_pizza);
    console.log(my_pie);
}

//first run

bake_goods(pizza, pie);
//console logs
//['crust','ham']
//apple

//['crust']
//peach

//second run

bake_goods(pizza, pie);
//console logs
//['crust']
//apple

//['crust']
//peach

See [Is JavaScript a pass-by-reference or pass-by-value language?](http://stackoverflow.com/questions/518000/is-javascript-a-pass-by-reference-or-pass-by-value-language) — josh3736, Oct 03 '13 at 21:55
Arrays are passed by reference in JavaScript. You will need to make a copy of the array and pass it to the function (or have the function make a copy) if you want the original unmodified.. — J.D. Pace, Oct 03 '13 at 21:55
Also, the proper way to remove elements from an array is [`Array#splice`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice), not `delete`. — josh3736, Oct 03 '13 at 21:56
What's that # notation? I haven't seen that in javascript before. — recursive, Oct 03 '13 at 21:58
@recursive: It's a shortcut to saying `Array.prototype.splice`, which you actualy invoke as `someArr.splice()`. (It's not actually valid syntax.) — josh3736, Oct 03 '13 at 21:59

score 7 · Accepted Answer · answered Oct 03 '13 at 21:55

you should clone (create a copy of) your array in your function

function bake_goods(my_pizza, my_pie){
    var innerPizza = my_pizza.slice(0);
    console.log(innerPizza);
    console.log(my_pie);

    delete innerPizza ['1'];
    my_pie = "peach";

    console.log(innerPizza );
    console.log(my_pie);
}

score 2 · Answer 2 · answered Oct 03 '13 at 21:56

2

Arrays and objects are passed as pointers to the original object. If you don't want to modify the original, you need to make a copy first.

function bake_goods(my_pizza, my_pie) {
    my_pizza = my_pizza.slice(0);
    delete my_pizza[1];
}

answered Oct 03 '13 at 21:56

Barmar

741,623
53
500
612

score 0 · Answer 3 · answered Oct 03 '13 at 21:59

The "pizza" array changes because the function is apparently call by reference. The function manipulates the parameters through the same location in memory that the variable outside the function is initialized in. You can avoid these unwanted changes by creating a copy of the my_pizza array and its elements, and working with that.

score 0 · Answer 4 · answered Oct 03 '13 at 22:02

use this, to force javascript to edit the object in the local context and not in the global context, also youll need to clone objects.

function bake_goods(my_pizza, my_pie){
    this.my_pizza = my_pizza.slice(0);

    console.log(this.my_pizza);
    console.log(this.my_pie);

    delete this.my_pizza['1'];
    this.my_pie = "peach";

    console.log(this.my_pizza);
    console.log(this.my_pie);
}

Keep original array after JavaScript function

4 Answers4

Linked