How to change multiple variables for any given variable inside a function?

Question

In the following code, I want to assign new values to 3 variables inside a function. If I had only 1 variable, I could simply return the new value. Is there a simple way to do that with multiple variables inside one function (without using complicated methods such as turning the variables into an array and returning the array)?

Here is my code:

function increment(x, y, z) {
    x += 1;
    y += 2;
    z += 3;
}

var a = 1;
var b = 1;
var c = 1;

var d = 20;
var e = 12;
var f = 8;

increment(a, b, c);
console.log(a + ", " + b + ", " + c);

increment(d, e, f);
console.log(d + ", " + e + ", " + f);

// desired output: 
// 2, 3, 4
// 21, 14, 11
// actual output: 
// 1, 1, 1
// 20, 12, 11

Are there any restrictions on the JavaScript Version? ES6, ES5, ...? — yunzen, Oct 19 '18 at 08:59
You might find this useful: https://stackoverflow.com/questions/518000/is-javascript-a-pass-by-reference-or-pass-by-value-language — Krisztián Balla, Oct 19 '18 at 09:13

score 4 · Answer 1 · edited Jun 20 '20 at 09:12

Possibility 1

function increment(...elem) {
  return elem.map(([x, y]) => x + y);
}

let a = 1;
let b = 1;
let c = 1;

let d = 20;
let e = 12;
let f = 8;

[
  a,
  b,
  c
] = increment([a, 1], [b, 2], [c, 3]);

console.log(`${a}, ${b}, ${c}`);

[
  d,
  e,
  f
] = increment([d, 10], [e, 2], [f, 5]);

console.log(`${d}, ${e}, ${f}`);

Possibility 2

function increment(...elem) {
  return elem.reduce((tmp, x, xi) => xi % 2 ? [
    ...tmp,
    
    x + elem[xi - 1],
  ] : tmp, []);
}

let a = 1;
let b = 1;
let c = 1;

let d = 20;
let e = 12;
let f = 8;

[
  a,
  b,
  c
] = increment(a, 1, b, 2, c, 3);

console.log(`${a}, ${b}, ${c}`);

[
  d,
  e,
  f
] = increment(d, 10, e, 2, f, 5);

console.log(`${d}, ${e}, ${f}`);

Possibility 3

function increment(obj, keysAndVal) {
  keysAndVal.forEach(([x, y]) => (obj[x] += y));
}

const vars = {
  a: 1,
  b: 1,
  c: 1,
  d: 20,
  e: 12,
  f: 8,
};

increment(vars, [
 ['a', 1],
 ['b', 5],
 ['c', 8],
]);

console.log(`${vars.a}, ${vars.b}, ${vars.c}`);

increment(vars, [
 ['d', 10],
 ['e', 2],
 ['f', 3],
]);

console.log(`${vars.d}, ${vars.e}, ${vars.f}`);

Possibility 4

function increment(elem, indexes, values) {
  indexes.forEach((x, xi) => (elem[x] += values[xi]));
}

const vals = [
 1,
 1,
 1,
 20,
 12,
 8,
];

increment(vals, [0, 1, 2], [10, 20, 30]);

console.log(`${vals[0]}, ${vals[1]}, ${vals[2]}`);

increment(vals, [3, 4, 5], [5, 10, 15]);

console.log(`${vals[3]}, ${vals[4]}, ${vals[5]}`);

This adds only one to the variables but in the question, he is trying to add different values to each of the parameters — Abraham Murciano Benzadon, Oct 19 '18 at 08:46

score 0 · Answer 2 · answered Oct 19 '18 at 08:57

You may use Object format to return your variables

function increment(x, y, z) {
    return {
        x: x + 1,
        y: y + 2,
        z: z+ 3
    }
}

var incremented = increment(a, b, c);
console.log(incremented.x + ", " + incremented.y + ", " + incremented.z);

I hope this helps.

yunzen · Answer 3 · 2018-10-19T09:32:59.360

You can use ES6 destructuring, if you don't have compatibility issues with it.

console.clear()

let a = 1;
let b = 1;
let c = 1;

// destructuring the function's array parameter 
// to three variables x, y, and z
function increment([x, y, z]) {
  return [
    x+1, 
    y+2, 
    z+3
  ];
};

console.log('Before', a, b, c);
// destructuring the returned array of function `increment`
// to three variables a, b, and c
// no let or var before it, as a, b, and c are already declared
[a,b,c] = increment([a,b,c]);
console.log('After ', a, b, c);

score 0 · Answer 4 · answered Oct 19 '18 at 09:12

I want to assign new values to 3 variables inside a function.

If it's always the same variables, put the increment function in the scope of the variables and close over them:

var x = 1, y = 1, z = 1;
function increment() {
    x += 1;
    y += 2;
    z += 3;
}
console.log(x, y, z);
increment();
console.log(x, y, z);
increment();
console.log(x, y, z);

If there are different sets of variables, in different scopes even, that you want to increment using a common function, you don't actually want 3 variables. You want an object, that you can pass around and mutate:

function increment(obj) {
    obj.x += 1;
    obj.y += 2;
    obj.z += 3;
}

var one = {x: 1, y: 1, z: 1};
console.log(one.x, one.y, one.z);
increment(one);
console.log(one.x, one.y, one.z);

var two= {x: 20, y: 12, z: 8};
console.log(two.x, two.y, two.z);
increment(two);
console.log(two.x, two.y, two.z);

zer00ne · Answer 5 · 2018-10-19T19:48:19.700

Generator Function

At last a reason to build a Generator Function!

Signature

function *inc(array, count=0; maxInc=3)

Parameters

array [Array of Numbers].....: Any amount of numbers.

count [Number][Default: 0]..: Determines the initial increment value.

maxInc [Number][Default:3]: Determines the largest increment value.

Description

*inc() passes an array of numbers of which each number of the array is incremented by an incremented number (ex. +=1, +=2, +=3, etc.) The count parameter determines the value of the first increment and the rest thereafter. The last parameter determines the maximum value of count before it resets back to 0.

Return

An array of incremented numbers.

Demo

function *inc(array, cnt = 0, max = 3) {

  for (let i = 0; i < array.length; i++) {

    if (cnt > max) {
      cnt = 0;
    }
    cnt = i + 1;
    
    let b = array[i];
    
    b += cnt;
    
    yield b;
    
  }
  
}

const array = [1, 1, 1, 20, 12, 8];

for (let num of inc(array)) {
  console.log(num);
}