在JavaScript中传递一个数组作为函数参数
我想调用一个数组作为参数:
const x = ['p0', 'p1', 'p2']; call_me(x[0], x[1], x[2]); // I don't like it function call_me (param0, param1, param2 ) { // ... }
有没有更好的方式将x
的内容传递给call_me()
?
const args = ['p0', 'p1', 'p2']; call_me.apply(this, args);
请参阅Function.prototype.apply()
MDN文档。
如果环境支持ECMAScript 6,则可以使用扩展参数 :
call_me(...args);
为什么不传递整个数组,并根据需要在函数内部处理?
var x = [ 'p0', 'p1', 'p2' ]; call_me(x); function call_me(params) { for (i=0; i<params.length; i++) { alert(params[i]) } }
假设call_me是一个全局函数,所以你不要指望这个被设置。
var x = ['p0', 'p1', 'p2']; call_me.apply(null, x);
有一个新的传播运营商 ...
正是这样做。
call_me(...x)
它是标准化的ES6,但尚不支持IE。
正如@KaptajnKold所回答的
var x = [ 'p0', 'p1', 'p2' ]; call_me.apply(this, x);
而且你不需要为call_me函数定义每个参数。 你可以使用arguments
function call_me () { // arguments is a array consisting of params. // arguments[0] == 'p0', // arguments[1] == 'p1', // arguments[2] == 'p2' }
注意这一点
function FollowMouse() { for(var i=0; i< arguments.length; i++) { arguments[i].style.top = event.clientY+"px"; arguments[i].style.left = event.clientX+"px"; } };
// —————————
html页面
<body onmousemove="FollowMouse(d1,d2,d3)"> <p><div id="d1" style="position: absolute;">Follow1</div></p> <div id="d2" style="position: absolute;"><p>Follow2</p></div> <div id="d3" style="position: absolute;"><p>Follow3</p></div> </body>
可以用任何参数调用函数
<body onmousemove="FollowMouse(d1,d2)">
要么
<body onmousemove="FollowMouse(d1)">
1 – 你可以将数组连接成一个string
2通过它的function
三通拆分
var fruits = ["Banana", "Orange", "Apple", "Mango"]; function myFunction(name) { var nameArray = name.split(','); . . . }
通话方式:
myFunction(fruits.join(','));
甚至
myFunction("orange,Apple,fruits");