JavaScript数组方法--concat、push
利用了两天的时间,使用typescript和原生js重构了一下JavaScript中数组对象的主要方法,可以移步github查看。
这里,按照MDN上的文档顺序,再重新学习一下数组方法吧。
- concat:
concat()方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
给出的示例是:var array1 = ['a', 'b', 'c'];
var array2 = ['d', 'e', 'f']; console.log(array1.concat(array2));期望输出:["a", "b", "c", "d", "e", "f"]。这也符合我们正常的使用方式。那么还有没有特殊的地方呢?
1、由于concat()方法返回一个新数组,那么如果不传参数,会怎样呢?var array1 = ['a', 'b', 'c'];
var arr3 = array1.concat()
console.log(array1==arr3); // false很明显,可以实现数组的浅拷贝。
2、如果参数不是数组呢?var array1 = ['a', 'b', 'c'];
var arr3 = array1.concat("3", true, null, undefined, {key: "value"})
console.log(arr3);输出结果:

把所有参数都当做数组元素拼接到array1后面,并返回一个新的数组实例。
想到了什么?这种情况是不是与push方法很像。区别在于push是修改原数组,concat是返回新数组。
到这里,我们是不是可以尝试重构一下concat的方法呢?function concat() {
if (!(arguments[0] instanceof Array)) throw new Error("请确保第一个参数类型为数组")
var results = []
for (var i = 0; i < arguments.length; i++) {
if (!(arguments[i] instanceof Array)) {
results[results.length] = arguments[i]
break;
}
for (var j = 0; j < arguments[i].length; j++) {
results[results.length] = arguments[i][j]
}
}
return results
}稍作解释的是,没有在数组原型上重构各种方法,仅仅是封装为一个个的函数,所以函数的第一个参数,都要求是需要操作的数组。
push:
push()方法将一个或多个元素添加到数组的末尾,并返回该数组的新长度。
按照顺序而言,这里不应该是push的,但是既然在谈concat的时候,提到push了,那么就先来push吧!
惯例,先看MDN给出的示例:var animals = ['pigs', 'goats', 'sheep']; console.log(animals.push('cows'));
// expected output: 4 console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows"] animals.push('chickens'); console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows", "chickens"]看结果:

很容易理解,push修改的是原数组,并返回修改后的数组长度。
同理,我们分别测试:
1、不传参数var animals = ['pigs', 'goats', 'sheep'];
var b = animals.push()
console.log(b );输出值为3,那么3是哪里来的呢?很明显就是animals.length,突然美滋滋的,下次再获取数组长度,是不是可以装X一下!!!
2、传递多个不同类型的参数var animals = [];
animals.push(['dogs', []],"3", true, null, undefined, {key: "value"})
console.log(animals);查看结果:

就是说不管什么类型的参数,一个参数都将作为一个元素,插入到原数组当中。
那就重构一下push吧!第一个参数也是需要操作的数组!function push(arr) {
if (!(arr instanceof Array)) throw new Error("请确保参数类型为数组")
for (var i = 1; i < arguments.length; i++) {
arr[arr.length] = arguments[i]
}
return arr.length
}
剩余的方法,期待后续了!
JavaScript数组方法--concat、push的更多相关文章
- JavaScript数组方法--every、some、fill
接上一篇,JavaScript数组方法--concat.push,继续其他的数组方法. every:every() 方法测试数组的所有元素是否都通过了指定函数的测试. 先看其使用方法: functio ...
- 【译】你应该了解的JavaScript数组方法
让我们来做一个大胆的声明:for循环通常是无用的,而且还导致代码难以理解.当涉及迭代数组.查找元素.或对其排序或者你想到的任何东西,都可能有一个你可以使用的数组方法. 然而,尽管这些方法很有用,但是其 ...
- JavaScript数组方法大全(推荐)
原网址:http://www.jb51.net/article/87930.htm 数组在笔试中经常会出现的面试题,javascript中的数组与其他语言中的数组有些不同,为了方便之后数组的方法学习, ...
- JavaScript数组方法详解
JavaScript数组方法详解 JavaScript中数组的方法种类众多,在ES3-ES7不同版本时期都有新方法:并且数组的方法还有原型方法和从object继承的方法,这里我们只介绍数组在每个版本中 ...
- JavaScript数组方法大集合
JavaScript数组方法集合 本文总结一下js数组处理用到的所有的方法.自己做个笔记. 数组方法 concat() 合并两个或多个数组 concat()能合并两个或者多个数组,不会更改当前数组,而 ...
- 一站式超全JavaScript数组方法大全
一站式JavaScript数组方法大全(建议收藏) 方法一览表 详细操作 本人总结了JavaScript中有关数组的几乎所有方法(包含ES6之后新增的),并逐一用代码进行演示使用,希望可以帮助大家! ...
- 2018.2.27 JavaScript数组方法应用
JavaScript数组方法应用 1.找出元素item在给定数组arr中的位置 function indexOf(arr,item){ return arr.indexOf(item); } func ...
- JavaScript 数组方法处理字符串 prototype
js中数组有许多方法,如join.map,reverse.字符串没有这些方法,可以“借用”数组的方法来处理字符串. <!doctype html> <html lang=" ...
- JavaScript数组方法速查,32个数组的常用方法和属性
JavaScript数组方法速查手册极简版 http://30ke.cn/doc/js-array-method JavaScript数组方法速查手册极简版中共收了32个数组的常用方法和属性,并根据方 ...
随机推荐
- 测试那些事儿—LR脚本插入DOS命令
1.基础命令 dir 查看当前目录下的文件和文件夹 cd 目录名:进入特定的目录. md 路径名:建立特定的文件夹. rd 路径名:删除特定的文件夹. cls:清除屏幕. copy 路径\文件名 ...
- Python:从入门到实践--第四章--列表操作--练习
#1.想出至少三种你喜欢的水果,将其名称存储在一个列表中,再使用for循环将每种水果的名称都打印出来. #要求:(1)修改这个for循环,使其打印包含名称的句子,而不是仅仅是水果的名称.对于每种水果, ...
- maven各个属性参数详解
<project xmlns="http://maven.apache.org/POM/4.0.0 " xmlns:xsi="http://www.w3.org/2 ...
- SimpleDateFormat将月/日/年 时分秒转换为年-月-日 时:分:秒
String expirTime = ”12 / 27 / 2018 12: 00: 00 AM”;SimpleDateFormat in = new SimpleDateFormat("M ...
- L1-046 整除光棍
这里所谓的“光棍”,并不是指单身汪啦~ 说的是全部由1组成的数字,比如1.11.111.1111等.传说任何一个光棍都能被一个不以5结尾的奇数整除.比如,111111就可以被13整除. 现在,你的程序 ...
- loj#2720. 「NOI2018」你的名字
链接大合集: loj uoj luogu bzoj 单纯地纪念一下写的第一份5K代码.../躺尸 因为ZJOI都不会所以只好写NOI的题了... 总之字符串题肯定一上来就拼个大字符串跑后缀数组啦! ( ...
- anaconda的python版本与本地python版本不同时的问题
在用anaconda,尤其是win下的时候,本地的python版本可能和虚拟环境中需要的python版本不同,而在虚拟环境中使用pip3安装包的时候,仍会出现版本是本地的python版本的情况,虽然并 ...
- 采用CAS算法 实现高性能的Disruptor 完成多线程下并发、等待、先后等操作
来源:https://blog.csdn.net/tianyaleixiaowu/article/details/79787377 拓展: https://www.jianshu.com/p/d24b ...
- 加载Excel时,如何过滤空行空列
巨硬为Excel提供了丰富的C#接口,基本上可以将Excel当做一个微型数据库来用,奈何前端的我们,sql也只会写两句select * from table: 目前工作中遇到了一个问题,在需要读取的E ...
- mac上遇到的坑
mac上有两个python版本 当我执行命令时提示 command not found 但是我已经安装了包了 但是由于有两个python版本 当前项目用的时python3所以需要使用pip3 ...