在数组操作中,push()很常见,concat()却很少见,然而两者的用法很相似,可以理解为,push()是concat()的简化版,先看下面的例子:
/*push()方法*/
var array=[1,2,3,4,5];
console.log(array); //[1, 2, 3, 4, 5]
array.push(6); //一个参数
console.log(array); //[1, 2, 3, 4, 5, 6]
array.push(6,7); //两个参数
console.log(array); //[1, 2, 3, 4, 5, 6, 7]
array.push([6,7]); //参数为数组
console.log(array); //[1, 2, 3, 4, 5, 6, Array(2)]
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
/*concat()方法*/
var array=[1,2,3,4,5];
console.log(array); //[1, 2, 3, 4, 5]
var array2=array.concat(6); //一个参数
console.log(array); //[1, 2, 3, 4, 5]
console.log(array2); //[1, 2, 3, 4, 5, 6]
var array2=array.concat(6,7); //两个参数
console.log(array); //[1, 2, 3, 4, 5]
console.log(array2); //[1, 2, 3, 4, 5, 6,7]
var array2=array.concat([6,7]); //参数为数组
console.log(array); //[1, 2, 3, 4, 5]
console.log(array2); //[1, 2, 3, 4, 5, 6, 7]
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
通过代码可以看出一下几点差别:
1,push()是在原数组的基础上修改的,执行push()方法后原数组的值也会变;concat()是先把原数组复制到一个新的数组,然后在新数组上进行操作,所以不会改变原数组的值。
2,如果参数不是数组,不管参数个数有多少个,push()和concat()都会直接把参数添加到数组后;如果参数是一个数组,push()就会直接把数组添加到原数组后,而concat()会把数组里的值取出来添加到原数组后。
<li class="tool-item tool-active is-like "><a href="javascript:;"><svg class="icon" aria-hidden="true"> <use xlink:href="#csdnc-thumbsup"></use> </svg><span class="name">点赞</span> <span class="count">2</span> </a></li> <li class="tool-item tool-active is-collection "><a href="javascript:;" data-report-click="{"mod":"popu_824"}"><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-csdnc-Collection-G"></use> </svg><span class="name">收藏</span></a></li> <li class="tool-item tool-active is-share"><a href="javascript:;"><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-csdnc-fenxiang"></use> </svg>分享</a></li> <!--打赏开始--> <!--打赏结束--> <li class="tool-item tool-more"> <a> <svg t="1575545411852" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5717" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M179.176 499.222m-113.245 0a113.245 113.245 0 1 0 226.49 0 113.245 113.245 0 1 0-226.49 0Z" p-id="5718"></path><path d="M509.684 499.222m-113.245 0a113.245 113.245 0 1 0 226.49 0 113.245 113.245 0 1 0-226.49 0Z" p-id="5719"></path><path d="M846.175 499.222m-113.245 0a113.245 113.245 0 1 0 226.49 0 113.245 113.245 0 1 0-226.49 0Z" p-id="5720"></path></svg> </a> <ul class="more-box"> <li class="item"><a class="article-report">文章举报</a></li> </ul> </li> </ul> </div> </div> <div class="person-messagebox"> <div class="left-message"><a href="https://blog.csdn.net/Steven_2669"> <img src="https://profile.csdnimg.cn/D/4/9/3_steven_2669" class="avatar_pic" username="Steven_2669"> <img src="https://g.csdnimg.cn/static/user-reg-year/1x/2.png" class="user-years"> </a></div> <div class="middle-message"> <div class="title"><span class="tit"><a href="https://blog.csdn.net/Steven_2669" data-report-click="{"mod":"popu_379"}" target="_blank">小屁踢</a></span> </div> <div class="text"><span>发布了12 篇原创文章</span> · <span>获赞 5</span> · <span>访问量 2万+</span></div> </div> <div class="right-message"> <a href="https://im.csdn.net/im/main.html?userName=Steven_2669" target="_blank" class="btn btn-sm btn-red-hollow bt-button personal-letter">私信 </a> <a class="btn btn-sm bt-button personal-watch" data-report-click="{"mod":"popu_379"}">关注</a> </div> </div> </div> </article>