JS面试题之面试官问:数组slice和splice怎么使用?有何区别?(二)_前端面试题slice splice-程序员宅基地

技术标签: 面试  小帅的编程笔记  javascript  

我是傲夫靠斯,欢迎关注我的公众号【前端工程师的自我修养】,每天更新。

今天要分享的题也是非常基础的题,在平时的日常开发中肯定是用过数组的slice和splice方法,那么你能准确的说出slice和splice数怎么使用的吗?以及它们有什么区别?

今日题目:

  • 知道数组的slice方法吗?怎么使用?
  • 知道数组的splice方法吗?怎么使用?
  • slice方法和splice方法有什么区别?

1. 知道数组的slice方法吗?怎么使用?

slice方法用来截取数组的元素,返回一个新的数组。slice方法有两个参数,第一个参数为截取的开始位置,为数组下标;第二个参数为截取的结束位置。但不包含结束位置的元素。这个一定要注意,有很多人都记错了,错误率极高。

下面的一些例子:

const array = [1, 2, 3, 4, 5];
const array1 = array.slice(0,2); //输出: [1,2]
const array2 = array.slice(2,3); //输出: [3]
const array3 = array.slice(4); 	 //输出: [5]

注意: slice方法不会改变原数组,而是将数组中的一部分作为新数组返回。

2. 知道数组的splice方法吗?怎么使用?

splice方法用来向数组添加元素或者删除数组某个元素,然后删除的元素。第一个参数为插入元素或者删除元素的位置,第二个参数为要删除的元素数量。后面的每个参数都会依次添加到数组中(从删除的位置开始)。

具体请看下面的一些例子:

const array1 = [1, 2, 3, 4, 5];
const array2 = [1, 2, 3, 4, 5];
const array3 = [1, 2, 3, 4, 5];

const newArray1 = array1.splice(0,2);
//输出: [1, 2]; 原数组: [3, 4, 5]
const newArray2 = array2.splice(3);
//输出: [4, 5]; 原数组: [1, 2, 3]
const newArray3 = array3.splice(3, 1, "a", "b", "c");
//输出: [4]; 原数组: [1, 2, 3, "a", "b", "c", 5]

注意: splice方法会改变原数组,返回被删除的元素组成的新数组。

3. slice方法和splice方法有什么区别?

这题最坑的地方在于它俩长的实在太像了,很容记错,所以平时要多加使用和练习,这才是一名前端工程师的基本功。

我列出一些基本的区别:

slice splice
不会改变原数组 改变原数组
返回原数组中的部分元素 返回原数组中被删除的元素组成的新数组
用来选择数组中的元素 用于在数组中插入或者删除元素

唠叨

今天题目很基础,但很重要

感谢大家的阅读,您的点赞、评论、关注是对我最大的鼓励 O(∩_∩)O

我是傲夫靠斯,微信搜【前端工程师的自我修养】,让我们每天进步一点点,期待更好的自己。

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/cmdfas/article/details/120239267

智能推荐

Halcon缺陷检测之(Blob+差分法&&模板匹配+差分法)_工业视觉检测开发blob-程序员宅基地

文章浏览阅读8.9k次,点赞27次,收藏166次。一、缺陷检测概述  缺陷检测是机器视觉重要的应用方向之一,由于在制造产品的过程中,表面缺陷的产生往往是不可避免的,故机器视觉的缺陷检测有较大的市场需求。熟练掌握缺陷检测是视觉工程师的必要技能。  在工业视觉检测当中,常见的工业视觉检测表面缺陷有划伤、划痕、辊印、凹坑、粗糙、波纹等外观缺陷,此外还有像一些非金属产品表面的夹杂、破损、污点,以及纸张表面的色差、压痕等。  相比于人工检测,基于机器视觉的检测有如下优点:①能24小时不间断工作②检测速度快,准确率高③检测精度高④不受外界因素的干扰,检测_工业视觉检测开发blob

openGauss洗冤录 之 copy from_copy to or from a file is prohibited for security -程序员宅基地

文章浏览阅读634次。对于copy功能PostgreSQL从9.2.4到16devel是否有过优化?或者openGauss是否持续合并或优化PostgreSQL的copy功能,这方面我没有去考证过。单纯从测试结果上看,openGauss的copy性能要略逊于PostgreSQL。当然,可能是我水平有限,所以希望各位openGauss的专家、老师集思广益,还openGauss一个真实的COPY FROM文件导入性能。(大家可以回复优化方案,我这边去做验证)_copy to or from a file is prohibited for security concerns

基于springboot的体育馆使用预约系统_基于springboot的体育馆预约管理系统-程序员宅基地

文章浏览阅读1.1k次,点赞23次,收藏27次。基于springboot的体育馆使用预约系统_基于springboot的体育馆预约管理系统

Spring、SpringBoot常见面试题与答案_spring和springboot的常见面试题-程序员宅基地

文章浏览阅读390次。SpringSpring Bean 的作用域有哪些?它的注册方式有几种?Spring 容器中管理一个或多个 Bean,这些 Bean 的定义表示为 BeanDefinition 对象,具体包含以下重要信息:Bean 的实际实现类;Bean 的引用或者依赖项;Bean 的作用范围;singleton:单例(默认);prototype:原型,每次调用bean都会创建新实例;request:每次http请求都会创建新的bean;session:同一个http session共享一个bean_spring和springboot的常见面试题

openstack认证服务(认证组件)3_openstack 认证服务-程序员宅基地

文章浏览阅读1.9k次。Openstack认证服务(认证组件)3_openstack 认证服务

职场生存法则:一个外企女白领的日记...-程序员宅基地

文章浏览阅读4.5k次。第11节:人与人的相处(1)   2006-6-7 8∶40∶00  人与人的相处  一、有后台的下属。  我遇见过,也处理得很好。你不能得罪他背后的人,那么就通过他去利用他背后的人。比如说他是老板的亲戚,碰见别的部门有什么搞不定的人,你美言他几句叫他去搞,成功了自然是别人给老板面子,失败了你也可以多多积累他的错误,日后真到不得不踢人的时候也派得上..._外企重视documentation

随便推点

在vue中使用web3.js开发以太坊dapp_如何使用web3和vue.js创建你的第一个以太坊dapp-程序员宅基地

文章浏览阅读1.8w次,点赞2次,收藏65次。前端如何使用以太坊智能合约方法这里讲的是前端与MetaMask之间的交互文中涉及到的官方文档web3.js 1.0中文手册MetaMask官方文档web3.js文件链接:https://pan.baidu.com/s/1_mPT-ZcQ9GU_U1CVhBKpLA提取码:cbey//在vue中安装web3npm install web3 --save//在main.js引入import Web3 from 'web3'Vue.prototype.Web3 = Web3一、唤起Me_如何使用web3和vue.js创建你的第一个以太坊dapp

Python:太阳花的绘制_绘制一个直径随机的太阳花-程序员宅基地

文章浏览阅读701次。绘制一个太阳花的图形。from turtle import *color("red",'yellow')begin_fill()while True: forward(200) left(170) if abs(pos())<1: breakend_fill()done()_绘制一个直径随机的太阳花

Linux常用命令(1)_code=exited, status=0/success-程序员宅基地

文章浏览阅读348次。Linux常用命令(1)切换到ROOT用户(su - root)[liu@localhost ~]$ su - root密码:[root@localhost ~]查看IP地址(ifconfig)[root@localhost ~]# ifconfigens33: flags=4163<UP,BROADCAST,RUNNING,MULTICAST> mtu 1500 inet 192.168.100.47 netmask 255.255.255.0 broad_code=exited, status=0/success

调用百度地图画圈并标出属于圈内的点位信息_bmap.circle-程序员宅基地

文章浏览阅读1.3k次。直接上代码:fanweiss(){//画圈varaaa=this.gaojingDatadebuggervarmap=newBMap.Map("ydmap");//创建Map实例varmPoint=newBMap.Point(this.gaojingData.longitude,this.gaojingData.latitude);//中心点map.setMapStyle({style:"midni..._bmap.circle

VisualVM 插件地址_visualvm 插件中心地址-程序员宅基地

文章浏览阅读1.4k次。VisualVM原插件地址是oracle的打不开,已经移到github上了,具体如下:介绍:https://visualvm.github.io/plugins.html下载地址:https://visualvm.github.io/pluginscenters.html 选择对应JDK版本下载即可! 注意事项:在使用Visual VM进行heapdump分析的时候,发..._visualvm 插件中心地址

understand 代码解析工具的使用_understand代码-程序员宅基地

文章浏览阅读8.8k次,点赞15次,收藏80次。understand 常用操作文章目录understand 常用操作简单介绍软件下载常用基本操作新建工程并添加现有文件如何找到自己当前想要去编辑的文件?如何在当前文件中找到你要编辑的函数?如何跳转到定义?查看当前文件的函数列表如何查看函数都被谁调用了?查看函数的调用逻辑如何查找如何找到函数的被调用图除此之外可以分析出代码的各种结构文本的编辑格式设置双屏一边看代码,一遍看代码地图简单介绍understand对分析代码有非常强的能力,完全可以代替sourceinsight,并且可以在linux上mac上使_understand代码

推荐文章

热门文章

相关标签