【问题标题】:Push multiple elements to array将多个元素推送到数组
【发布时间】:2013-01-21 08:13:53
【问题描述】:

我正在尝试将多个元素作为一个数组推送,但出现错误:

> a = []
[]
> a.push.apply(null, [1,2])
TypeError: Array.prototype.push called on null or undefined

我正在尝试做与 ruby​​ 类似的事情,我认为 apply 类似于 *。

>> a = []
=> []
>> a.push(*[1,2])
=> [1, 2]

【问题讨论】:

    标签: javascript


    【解决方案1】:

    您可以通过以下方式将多个元素推送到数组中

    var a = [];
        
    a.push(1, 2, 3);
    
    console.log(a);

    【讨论】:

    • 这个答案和选择的答案产生了不同的,也许是意想不到的结果。 a.push(1) 与 a.push([1])
    • 谁能解释一下,为什么这比接受的答案多得多?它可能更容易,但不太灵活。如果你想合并 2 个数组,这是行不通的。
    • @BluE 如果你想合并两个数组,只需使用 array.concat()
    • @FlorentArlandis array.concat 无法将第二个数组添加到第一个数组。它将创建一个新的。我知道这是相似的。扩展运算符是我正在寻找的。只需查看那里的其他答案和 cmets 即可了解详细信息。
    • @BluE ES6 现在允许您执行类似array1.push(...array2) 的操作,其工作方式与array1.push(array2[0], array2[1], array2[2]) 完全相同,只是数组2 中的元素数量有限制(约100,000)
    【解决方案2】:

    现在在 ECMAScript2015(又名 ES6)中,您可以使用 spread operator 一次附加多个项目:

    var arr = [1];
    var newItems = [2, 3];
    arr.push(...newItems);
    console.log(arr);

    查看Kangax's ES6 compatibility 表以了解兼容的浏览器

    【讨论】:

    • whaaaaaaat 这太棒了,另外,如果你在 typescript 中这样做,它会编译为 push.apply,所以你有向后兼容性
    • 这有数组大小限制。尝试使用大数组。你会得到异常。
    【解决方案3】:

    当使用apply 或call 的对象的大多数功能时,context 参数必须是您正在处理的对象。

    在这种情况下,您需要a.push.apply(a, [1,2])(或更准确地说是Array.prototype.push.apply(a, [1,2]))

    【讨论】:

    • 这个方法可以推送多少元素有限制吗?我知道 JavaScript 有参数限制,在使用“应用”函数时是这样吗?
    • 我相信在旧浏览器中是 65,535,在现代浏览器中几乎是无限的 (4B)。
    【解决方案4】:

    你可以使用Array.concat:

    var result = a.concat(b);
    

    【讨论】:

    • Array.prototype.concat 返回新数组。
    • 他想推送到现有数组,所以Array.prototype.push.apply(arr1, arr2) 是正确答案,因为使用arr1.concat(arr2) 您正在创建一个新数组。
    • @suricactus arr1 = arr1.concat(arr2) 没什么大不了的,看起来更干净。推送到旧阵列或用新阵列替换旧阵列取决于您的需要。如果你处理 10m+ 个元素,推送到旧数组会更快,如果你管理小块,你几乎找不到速度上的任何差异。这两种选择都是完全合法的。
    • @YuvalA。 prototype.push.apply 只调用一次push。上面的区别不是关于速度的必要,而是就地操作与创建新数组。如果我有一个采用数组并应该就地修改它的方法怎么办? concat 方法不可能工作,即使使用 VisionN 的代码,因为它不会修改函数调用者的变量。
    • a = a.concat(b) 的语法仍然比 Array.prototype.push.apply(arr1, arr2) 短
    【解决方案5】:

    如果要添加多个项目,则必须使用扩展运算符

    a = [1,2]
    b = [3,4,5,6]
    a.push(...b)
    

    输出将是

    a = [1,2,3,4,5,6]
    

    【讨论】:

    • 这个方法可以推送多少元素有限制吗?
    【解决方案6】:

    如果您想要在 ECMAScript 2015(又名 ES6、ES2015)中替代 Array.concat,它不会修改数组而是返回一个新数组,您可以像这样使用 spread operator:

    var arr = [1];
    var newItems = [2, 3];
    var newerItems = [4, 5];
    var newArr = [...arr, ...newItems, ...newerItems];
    console.log(newArr);

    请注意,这与 push 方法不同,因为 push 方法会改变/修改数组。

    如果您想查看某些 ES2015 功能是否在您的浏览器中运行,请查看Kangax's compatibility table。

    如果您不想等待浏览器支持并希望在生产中使用 ES2015,也可以使用 Babel 或类似的转译器。

    【讨论】:

      【解决方案7】:

      有很多答案推荐使用:Array.prototype.push(a, b)。这是个好方法,但是如果你有很大的 b,你会遇到堆栈溢出错误(因为 args 太多)。这里要小心。

      更多详情请见What is the most efficient way to concatenate N arrays?。

      【讨论】:

      • 这并没有提供问题的答案。要批评或要求作者澄清,请在他们的帖子下方留下评论。 【如何写出好的答案? ](stackoverflow.com/help/how-to-answer)
      • 抱歉,由于声誉不足,我无法将 cmets 置于答案之下(我自己的除外) :)。但似乎应该在这里提到这一点以获得完整的概述。你能帮我做吗?然后我会删除我的答案。
      【解决方案8】:

      更简单的方法是

      a = []
      a.push(1,2,3)
      

      另一种方法是

      a = [...a, 4,5,6]
      

      如果你想创建另一个数组

      const b = a.concat(7,8,9)
      

      【讨论】:

        【解决方案9】:

        一次推送多个对象通常取决于您如何声明array。

        我就是这样做的

        //declaration
        productList= [] as  any;
        

        现在push记录

        this.productList.push(obj.lenght, obj2.lenght, items);
        

        【讨论】:

        • "类型断言表达式只能在 TypeScript 文件中使用。" VS Code 在这里对关键字any 所说的话
        【解决方案10】:

        请使用 ES6 spread operator:

        let a = [1,2,3];
        let b = [4,5,6];
        a = [...a,...b];
        // [1,2,3,4,5,6]
        

        【讨论】:

        • 不,这会创建一个新数组,因此与push 不同,因此不是问题的答案。
        【解决方案11】:
        var a=[];
        a.push({
         name_a:"abc",
         b:[]
        });
        
        a.b.push({
          name_b:"xyz"
        });
        

        【讨论】:

        • 虽然这个代码块可能会回答这个问题,但最好能稍微解释一下为什么会这样。
        猜你喜欢
        • 2020-08-02
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多