jquery 为什么.join()不能处理函数参数?

vh0rcniy  于 2023-05-17  发布在  jQuery
关注(0)|答案(9)|浏览(104)

为什么这样做(返回“一,二,三”):

var words = ['one', 'two', 'three'];
$("#main").append('<p>' + words.join(", ") + '</p>');

而这个工作(返回“列表:111”):

var displayIt = function() {
    return 'the list: ' + arguments[0];
}   
$("#main").append('<p>' + displayIt('111', '222', '333') + '</p>');

但不是这个(返回空白):

var displayIt = function() {
    return 'the list: ' + arguments.join(",");
}   
$("#main").append('<p>' + displayIt('111', '222', '333') + '</p>');

我必须对我的“arguments”变量做些什么才能在它上面使用.join()?

5jvtdoz2

5jvtdoz21#

它不起作用,因为arguments对象不是数组,尽管它看起来像数组。它没有join方法:

>>> var d = function() { return '[' + arguments.join(",") + ']'; }
>>> d("a", "b", "c")
TypeError: arguments.join is not a function

要将arguments转换为数组,可以执行以下操作:

var args = Array.prototype.slice.call(arguments);

现在join可以工作了:

>>> var d = function() {
  var args = Array.prototype.slice.call(arguments);
  return '[' + args.join(",") + ']';
}
>>> d("a", "b", "c");
"[a,b,c]"

或者,您可以使用jQuery的**makeArray**,它将尝试将“almost-arrays”(如arguments)转换为数组:

var args = $.makeArray(arguments);

以下是**Mozilla reference**(我最喜欢的这类资源)对此的看法:
arguments对象不是数组。它类似于数组,但除了length之外没有任何数组属性。例如,它没有pop方法。...
arguments对象只能在函数体中使用。试图在函数声明之外访问arguments对象将导致错误。

7bsow1i6

7bsow1i62#

如果你对其他Array.prototype方法不感兴趣,而只是想使用join,你可以直接调用它,而不需要将它转换为数组:

var displayIt = function() {
    return 'the list: ' + Array.prototype.join.call(arguments, ',');
};

另外,你可能会发现知道逗号是默认分隔符是有用的,如果你没有定义分隔符,根据规范,逗号将被使用。

zpqajqem

zpqajqem3#

你可以用我做的这个jQuery .joinObj Extension/Plugin
正如你将在小提琴中看到的,你可以如下使用它:

$.joinObj(args, ",");

$.(args).joinObj(",");

插件代码:

(function(c){c.joinObj||(c.extend({joinObj:function(a,d){var b="";if("string"===typeof d)for(x in a)switch(typeof a[x]){case "function":break;case "object":var e=c.joinObj(a[x],d);e!=__proto__&&(b+=""!=b?d+e:e);break;default:"selector"!=x&&"context"!=x&&"length"!=x&&"jquery"!=x&&(b+=""!=b?d+a[x]:a[x])}return b}}),c.fn.extend({joinObj:function(a){return"object"===typeof this&&"string"===typeof a?c.joinObj(this,a):c(this)}}))})(jQuery);
20jt8wwn

20jt8wwn4#

只需使用jQuery实用函数makeArray
arguments不是Array,而是一个对象。但是,由于它是“类似数组”的,你可以调用jQuery实用函数makeArray来使它工作:

var displayIt = function() {
    return 'the list: ' + $.makeArray(arguments).join(",");
}   
$("#main").append('<p>' + displayIt('111', '222', '333') + '</p>');

它将输出:

<p>the list: 111,222,333</p>
ejk8hzay

ejk8hzay5#

目前你不能连接数组参数,因为它们不是数组,如下所示
所以你要么先把它们变成这样的数组

function f() {
  var args = Array.prototype.slice.call(arguments, f.length);
  return 'the list: ' + args.join(',');
}

或者像这样再短一点

function displayIt() {
  return 'the list: ' + [].join.call(arguments, ',');
}

如果你使用的是babel或者兼容的浏览器来使用es6的特性,你也可以使用rest参数。

function displayIt(...args) {
  return 'the list: ' + args.join(',');
}

displayIt('111', '222', '333');

这会让你做更酷的事情,比如

function displayIt(start, glue, ...args) {
  return start + args.join(glue);
}

displayIt('the start: ', '111', '222', '333', ',');
lvjbypge

lvjbypge6#

你可以使用typeof来看看这里发生了什么:

>>> typeof(['one', 'two', 'three'])
"object"
>>> typeof(['one', 'two', 'three'].join)
"function"
>>> typeof(arguments)
"object"
>>> typeof(arguments.join)
"undefined"

这里你可以看到typeof在两种情况下都返回“object”,但是只有一个对象定义了连接函数。

cbwuti44

cbwuti447#

我不知道是否有一种简单的方法可以将参数转换为数组,但你可以尝试这样做:

var toreturn = "the list:";
for(i = 0; i < arguments.length; i++)
{
   if(i != 0) { toreturn += ", "; }
   toreturn += arguments[i];
}
hgqdbh6s

hgqdbh6s8#

arguments不是jQuery对象,只是一个普通的JavaScript对象。在尝试调用.join()之前扩展它。我想你会写:

return 'the list:' + $(arguments)[0];

(我对jQuery不太熟悉,只熟悉Prototype,所以我希望这不是完全虚假的。
编辑:错了!但在他的回应中,道格·内纳描述了我试图实现的目标。

x3naxklr

x3naxklr9#

您也可以使用Array.from,然后使用join()与您想要的任何令牌:

function joinArgs() {
  return Array.from(arguments).join(' ');
}

joinArgs('one', 'two', 'three'); // returns 'one two three'

相关问题