Javascript: passing multiple arguments as a single variable

开发者_StackOverflow中文版

is it possible to pass multiple arguments using a single variable? For example, if I wanted to do something like:

function foo(x,y){
    document.write("X is " + x);
    document.write("Y is " + y);
}

var bar = "0,10";
foo(bar);

The example above is an simplified example of what I was trying to do. It doesn't work (because the "bar" is detected as a single argument). I know that there are easier ways to implement this using arrays.

So, I ask this question mostly out of curiosity - is it possible to get the "bar" variable to be detected as not one, but 2 arguments?

Thanks!

---

function foo(thing) {
    document.write("X is " + thing.x);
    document.write("Y is " + thing.y);
}

var bar = {x:0, y:10};
foo(bar);

---

What you're asking for is impossible. If you want to pass multiple values in a single argument, use an Array or an Object. If you really must use a string, you'll have to call split() to break the argument string into an array.

---

function Add (a, b, c) {
    return a + b + c;
}

var nums = [1, 2, 4];
var sum = Add.apply (null, nums);

variable-length argument list:

function Add () {
    var sum = 0;
    for (var i = 0; i < arguments.length; i++) {
        sum += arguments[i];
    }
    return sum;
}
var n = Add (1, 2, 3, 4, 5);

Reference: apply method (Function object)

---

Sure, this is common to pass an object for options

function foo(options){
  //...
}

then you can pass in anything...

var opts = {};//create an object
opts['x'] = 5;//set whatever properties you want
opts['y'] = 23;
opts['border'] = 3;
foo(opts);//pass 1 argument, with as many values as you want

Often these are defined inline, especially if the values are not needed outside of the method call.

foo({'x':5,'y':23,'border':3});

---

Not really.

You could do:

window.foo.apply(window, bar.split(','));

(Apply lets you pass an array of arguments instead of each argument separately)

… but the phrase "ugly" comes to mind.

---

You may use this:

var bar = [0,10]; // creates an array
foo(bar);

function foo(arg){
    document.write("X is " + arg[0]);
    document.write("Y is " + arg[1]);
}

---

No, but you could pass a an array or object:

function foo(options){
    document.write("X is " + options.x);
    document.write("Y is " + options.y);
}

var bar = {x: 0, y:10};

---

No, it's not possible. You could put two arguments in an array, but an array is still one variable. Then you would need to rewrite the function to accept one variable, and treat it as an array, like this:

function foo(x){
document.write("X is " + x[0]);
document.write("Y is " + x[1]);
}

Basically, a function accepts variables as arguments and, no matter what kind of variable you pass it, each variable is still only one variable - there's no way to get a single variable to be recognized as multiple arguments. An array is one variable, a JSON object is one variable, etc. These things have multiple parts to them, but they're encapsulated by a single variable.

---

How about? (For ES6+)

function foo({x, y}){
    document.write("X is " + x);
    document.write("Y is " + y);
}

and call it with:

foo({x:10, y:5})

There is a downside to using a single structured argument over multiple arguments, and that is with multiple arguments you can use /** in may IDEs to generate a method header which will display an @param for each argument. But if you only have one argument then you will lose the niceness of a description for each argument and hence less useful intelli-sense in the IDE as it wont pick up the docuemntation of the structure's properties.

/**
 * Do stuff
 * @param {*} param0 - A structure containing the blah, blah blah data
 */
function foo({x, y}){

instead of..

/**
 * 
 * @param {*} x - The value for blah
 * @param {*} y - the value for blah-blah
 */
foo1(x, y){

---

To directly answer your question, no. It's worth noting that the way you have bar defined it's only one value, a string containing "0,10".

---

function myFunction(a,b){
//do stuff with a and b here
}

myFunction(1,'text')

or...

<a onClick="myFunction(1,'text');"

There's an article on the issue here.