python数组拼接concat_【JavaScript】重写数组的concat()方法
1. 先看文档:
阅读文档,从中归纳关键信息:1.用于连接两个或多个数组
2.返回一个新数组
3.参数可以是任意多个具体的值或数组对象
4.如果传入数组则添加的是数组的每个元素
所以按照这个思路,我们大概能猜到它是如何实现的:1.首先有一个等待拼接的数组对象,
2.然后可以将要拼接的具体的值或数组对象传入,
3.如果传入的是具体的值则直接推到等待拼接的数组;如果传入的是数组则遍历该数组将其每一个元素都推到等待拼接的数组中,
4.如果传入的是两个及以上的值或数组则重复第三步。
举例:let arr = [1, 2, 3]
// 传入一个具体的值
console.log(arr.concat(4)) // [1, 2, 3, 4]
// 传入一个数组对象
console.log(arr.concat([4, 5])) // [1, 2, 3, 4, 5]
// 传入两个及以上具体的值
console.log(arr.concat(4, 5, 6)) // [1, 2, 3, 4, 5, 6]
// 传入两个及以上数组对象
console.log(arr.concat([4, 5], [6, 7])) // [1, 2, 3, 4, 5, 6, 7, 8, 9]
2. 开始实操:
第一步,拼接一个或多个具体的值,并返回新数组:let arr = [1, 2, 3]
/**
* @description: 重写数组concat()
* @return {object array} waitingArr - 拼接后的数组对象
*/
Array.prototype.myConcat = function () {
/**
* 被返回的数组
* 1.不能简单的让waitingArr = this,会修改原数组
* 2.将this中的每一个元素推入新数组
*/
let waitingArr = this.filter(item => new Array(item))
/**
* 处理传入的参数:
* 1.arguments是类数组需要先转换成数组
* 2.遍历转换后的数组并将每一个元素推入到原来的数组
*/
Array.prototype.slice.call(arguments).forEach(ele => {
waitingArr.push(ele)
})
// 返回拼接后的新数组
return waitingArr
}
console.log(arr.myConcat(4), arr) // [1, 2, 3, 4] [1, 2, 3]
console.log(arr.myConcat(4, 5, 6), arr) // [1, 2, 3, 4, 5, 6] [1, 2, 3]
第二步,拼接一个或多个具体的值或数组对象,并返回新数组:Array.prototype.myConcat = function () {
let waitingArr = this.filter(item => new Array(item))
/**
* 处理传入的参数:
* 3.判断参数中是否包含数组,如果包含则拼接其每一个元素
*/
Array.prototype.slice.call(arguments).forEach(ele => {
if (Array.isArray(ele)) {
ele.forEach(item => {
waitingArr.push(item)
})
} else {
waitingArr.push(ele)
}
})
return waitingArr
}
console.log(arr.myConcat([4, 5]), arr) // [1,2,3,4,5] [1,2,3]
console.log(arr.myConcat([4, 5], [6, 7]), arr) // [1,2,3,4,5,6,7] [1,2,3]
console.log(arr.myConcat([4, 5], [6, 7], 123, 333), arr) // [1,2,3,4,5,6,7,123,333] [1,2,3]
代码整理:/**
* @description: 重写数组concat()
* @return {object array} waitingArr - 拼接后的数组对象
*/
Array.prototype.myConcat = function () {
let waitingArr = this.filter(item => new Array(item))
Array.prototype.slice.call(arguments).forEach(ele => {
Array.isArray(ele) ? ele.filter(item => waitingArr.push(item)) : waitingArr.push(ele)
})
return waitingArr
}
好了重写结束,但是在重写的过程中发现了一些东西很有意思。原本的concat()直观表现是我们在拼接具体的值得时候好像只是把这些值一个一个推进去,但是在原理上它还是在处理数组。因为arguments对象本身是一个类数组。
所以原本的arr.concat(4, 5, 6)这种形式,实质上是在处理一维数组;而arr.concat([4,5])这种形式,实质上是在处理二维数组。
那么继续向下思考,如果我们拼接的是一个或多个多维数组,又该怎么去处理呢?很显然按照上面的这种方式。。。细思极恐,那肯定是要向下处理很多层的。
由于我也没使用concat拼接过多维数组,所以先来看看原本的结果:let arr = [1, 2, 3]
console.log(arr.concat([4, [5, 6, [7, 8, [9, 10, ['哈哈', '哈哈哈']]]]]))
// 结果:[ 1, 2, 3, 4, [ 5, 6, [ 7, 8, [Array] ] ] ]
原本我以为它会最终返回一维数组,万万没想到啊,哈哈哈哈哈哈哈!!!!拼接到很多层的时候编辑器更是不往下处理了,就直接[Array]了,哈哈哈哈哈哈哈!!!!。
然后再拿到浏览器看看:
所以得到一个结论,我们经常使用的concat最多只能拼接一维数组。所以上面封装好的方法就是正确的。
3. 总结
其实偶尔回顾一下基础,尝试着重写基础方法,真的能够带来很多收获。能够对一些底层的东西更加熟悉,而熟悉这些东西的收益就是写出更完美更高效的方法。也能够在面对不同的需求时,最快速的做出解决方案。也能在未来的工作中独挡一面,不断的造轮子,造好轮子,提高自己甚至是整个团队的工作效率。
后面会做一个concat方法的延伸,"实现多维数组拼接成一维数组"。也许!没什么卵用,但凡是都有个万一。而且多研究研究原理对技术的提升是有极大帮助的。
Keep foolish, keep hungry.
python数组拼接concat_【JavaScript】重写数组的concat()方法相关推荐
- html数组拼接js,javascript合并两个数组最简单的实现方法
在开发的过程中,我们很多时候会遇到需要将两个数组合并成一个数组的情况出现. var arr1 = [1, 2, 3]; var arr2 = [4, 5, 6]; // 将arr1和arr2合并成为[ ...
- 数组拼接html js,js数组合并的几种方法
JS合并数组的几种方法及优劣比较 var datas = [ ['红色', '蓝色'], ['XL'], ['图片', '文字'] ]; 如何 将let datas = [[1, 2], [3,0,5 ...
- html中数组的定义,javascript中数组定义的几种方式是什么?
javascript中怎么定义数组?下面本篇文章给大家介绍一下javascript数组定义的几种方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 1.什么是数组 数组就是一组数据 ...
- linux数组拼接_Linux中Shell数组的笔记
Shell数组的介绍 数组算是一种特殊的数据结构,数据项可以成为数组的元素,可以通过数组的索引获取每一个数组的元素值. 数组的典型的使用场景是把相同类型的元素汇总在一起.由于Shell变量属于弱类型, ...
- python数组拼接字符串_Python练习题——数组拼接
# # 输入一个正整数数组,把数组里所有数字拼接起来排成一个数,打印能拼接出的所有数字中最小的一个. # # 示例 1: # 输入: [10,2] # 输出: "102" # # ...
- linux数组删除数据,JavaScript在数组的循环中删除元素
在开发JavaScript应用的过程中,经常会遇到在循环中移除指定元素的需求. 按照常规的思路,就是对数组进行一个for循环,然后在循环里面进行if判断,在判断中删除掉指定元素即可. 但是实际情况往往 ...
- java 数组拼接_打印Java数组最优雅的方式是什么?这波操作闪瞎我
在 Java 中,数组虽然是一个对象,但并未明确的定义这样一个类,因此也就没有覆盖 toString() 方法的机会.如果尝试直接打印数组的话,输出的结果并不是我们预期的结果.那有没有一些简单可行的方 ...
- php 一维数组值 拼接,php 一维数组拼接到二维数组后面
$list = [ ? ? ['name'=>'thinkphp','email'=>'thinkphp@qq.com','color'=>'thinkphp@qq.com'], ? ...
- mybatis mysql concat_在MyBatis中使用concat()方法
concat介绍 CONCAT(字串1, 字串2, 字串3, ...): 将字串1.字串2.字串3,等字串连在一起. 示例 SELECT CONCAT(region_name,store_name) ...
- JavaScript数组拼接方法
JavaScript中,可以使用concat()方法将两个或多个数组合并为一个数组.这个方法返回一个新的数组,其中包含合并的数组元素.例如: const arr1 = [1, 2, 3]; const ...
最新文章
- 图解wordpress3.5.1最简单实现伪静态的方法
- DCASE 2020权威声学比赛:腾讯多媒体实验室斩获双项指标国内第一
- 【Spring注解系列08】@PostConstruct与@PreDestroy
- C语言32个关键字与C++62个关键字详解
- c与python 数据传递-详解python如何调用C/C++底层库与互相传值
- 乘风破浪的迁移学习!四字成语讲明白这个大热研究方向
- 静态页中利用AJAX.NET实现无刷新页面
- 【排序算法】快速排序-迭代方法
- Redis高并发1-redis环境搭建
- 辩证的看DIV+CSS与TABLE
- Android 学习笔记(十五):Activity-GalleryView
- MCMC 改进粒子滤波算法及其在目标跟踪中的应用
- centos7.4配置nginx php,centos7.4下安装配置PHP服务(源码安装)并配置nginx支持php
- php 没有后缀名下载,javascript - 没有后缀名的链接?
- Giscus,由 GitHub Discussions驱动的评论系统
- 【C语言习题】有3个学生,上4门课程,要求输入全部学生的各门课成绩,并分别求出每门课的平均成绩(用二维数组编程)
- 独孤思维:简单轻松日赚100+,项目不赚钱就是耍流氓
- 2020高压电工模拟考试及高压电工实操考试视频
- SSM二手车交易系统设计/二手交易系统,
- 如何有效理解记忆宫殿方法?