Javascript Array Concat 不工作。为什么？答案

【问题标题】：Javascript Array Concat not working. Why?Javascript Array Concat 不工作。为什么？
【发布时间】：2012-09-29 23:53:08
【问题描述】：

所以我创建了这个 jqueryui 小部件。它创建了一个我可以将错误流式传输到的 div。小部件代码如下所示：

$.widget('ui.miniErrorLog', {
   logStart: "<ul>",   // these next 4 elements are actually a bunch more complicated.
   logEnd:   "</ul>",
   errStart: "<li>",
   errEnd:   "</li>",
   content:  "",
   refs:     [],

   _create: function() { $(this.element).addClass( "ui-state-error" ).hide(); },

   clear: function() { 
      this.content = ""; 
      for ( var i in this.refs )
         $( this.refs[i] ).removeClass( "ui-state-error" );
      this.refs = [];
      $(this.element).empty().hide(); 
   }, 

   addError: function( msg, ref ) {
      this.content += this.errStart + msg + this.errEnd; 
      if ( ref ) {
         if ( ref instanceof Array )
            this.refs.concat( ref );
         else
            this.refs.push( ref );
         for ( var i in this.refs )
            $( this.refs[i] ).addClass( "ui-state-error" );
      }
      $(this.element).html( this.logStart + this.content + this.logEnd ).show();
   }, 

   hasError: function()
   {
      if ( this.refs.length )
         return true;
      return false;
   },
});

我可以在其中添加错误消息，以及对将进入错误状态的页面元素的引用。我用它来验证对话框。在“addError”方法中，我可以传入一个 id 或一个 id 数组，如下所示：

$( "#registerDialogError" ).miniErrorLog( 
   'addError', 
   "Your passwords don't match.", 
   [ "#registerDialogPassword1", "#registerDialogPassword2" ] );

但是当我传入一个 id 数组时，它不起作用。问题出在以下几行（我认为）：

if ( ref instanceof Array )
   this.refs.concat( ref );
else
   this.refs.push( ref );

为什么那个 concat 不起作用。 this.refs 和 ref 都是数组。那么为什么 concat 不起作用呢？

奖励：我在这个小部件中还有其他愚蠢的事情吗？这是我的第一个。

【问题讨论】：

JavaScript: How to join / combine two arrays to concatenate into one array?
非常相似（用于数组而不是字符串）："concat" does not join JavaScript arrays together? - Stack Overflow

标签： javascript jquery jquery-ui

【解决方案1】：

concat方法不会改变原来的数组，需要重新赋值。

if ( ref instanceof Array )
   this.refs = this.refs.concat( ref );
else
   this.refs.push( ref );

【讨论】：

做到了。我原以为对象上的 concat 方法会附加到对象上。但我想这不是它的工作原理。
@Rafael：push 方法可以做到这一点，你可以做到[].push.apply(this.refs, ref)

【解决方案2】：

原因如下：

定义和用法

concat() 方法用于连接两个或多个数组。

这个方法不会改变已有的数组，而是返回一个新的数组，包含连接数组的值。

您需要将连接的结果分配回您拥有的数组中。

【讨论】：

为什么，哦，为什么，我必须总是忘记这个？

【解决方案3】：

扩展康斯坦丁·迪内夫：

.concat() 不会添加到当前对象，所以这将不工作：

foo.bar.concat(otherArray);

这将：

foo.bar = foo.bar.concat(otherArray);

【讨论】：

【解决方案4】：

你必须使用 = 重新分配值到数组，你想获得连接值

let array1=[1,2,3,4];
let array2=[5,6,7,8];

array1.concat(array2);
console.log('NOT WORK :  array1.concat(array2); =>',array1);

array1= array1.concat(array2);
console.log('WORKING :  array1 = array1.concat(array2); =>',array1);

【讨论】：

【解决方案5】：

dataArray = dataArray.concat(array2)

【讨论】：

【解决方案6】：

请注意，如果您真的想在使用 concat 函数时拥有一个可变数组（通过可变我的意思是它不会创建新数组而是改变现有数组），您可以为该数组实例重新分配 concat 函数.当我需要这个时，我做了什么。

let myArray = [];

myArray.concat= function(  toAdd){
     if(Array.isArray(toAdd)){
        for(let node of toAdd)
             this.push(node);
      }else
        this.push(toAdd);
}

【讨论】：