ES6中Array.copyWithin()函数的用法实例详解


Posted in Javascript onSeptember 16, 2017

ES6为Array增加了copyWithin函数,用于操作当前数组自身,用来把某些个位置的元素复制并覆盖到其他位置上去。

Array.prototype.copyWithin(target, start = 0, end = this.length)

该函数有三个参数。

target:目的起始位置。

start:复制源的起始位置,可以省略,可以是负数。

end:复制源的结束位置,可以省略,可以是负数,实际结束位置是end-1。

例:

把第3个元素(从0开始)到第5个元素,复制并覆盖到以第1个位置开始的地方。

下面的红色块是复制目标的起始位置,黄色块为复制的源。

const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
arr1.copyWithin(1, 3, 6)
console.log('%s', JSON.stringify(arr1))

结果:

[1,4,5,6,5,6,7,8,9,10,11]

start和end都是可以省略。

start省略表示从0开始,end省略表示数组的长度值。

目标的位置不够的,能覆盖多少就覆盖多少。

const arr2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
arr2.copyWithin(3)
console.log('%s', JSON.stringify(arr2))

结果:

[1,2,3,1,2,3,4,5,6,7,8]

start和end都可以是负数,负数表示从右边数过来第几个。

const arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
arr3.copyWithin(3, -3, -2)
console.log('%s', JSON.stringify(arr3))

结果:

[1,2,3,9,5,6,7,8,9,10,11]

总结

以上所述是小编给大家介绍的ES6中Array.copyWithin()函数的用法实例详解,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
firefox浏览器下javascript 拖动层效果与原理分析代码
Dec 04 Javascript
jquery给图片添加鼠标经过时的边框效果
Nov 12 Javascript
jquery 漂亮的删除确认和提交无刷新删除示例
Nov 13 Javascript
Eclipse去除js(JavaScript)验证错误
Feb 11 Javascript
javascript获取浏览器类型和版本的方法(js获取浏览器版本)
Mar 13 Javascript
基于MVC4+EasyUI的Web开发框架形成之旅之界面控件的使用
Dec 16 Javascript
jQuery中的ready函数与window.onload谁先执行
Jun 21 Javascript
JavaScript表单验证的两种实现方法
Feb 11 Javascript
input 标签实现输入框带提示文字效果(两种方法)
Oct 09 Javascript
使用async await 封装 axios的方法
Jul 09 Javascript
微信小程序 轮播图实现原理及优化详解
Sep 29 Javascript
简单了解前端渐进式框架VUE
Jul 20 Javascript
JS闭包的几种常见形式实例详解
Sep 16 #Javascript
ES6中Array.find()和findIndex()函数的用法详解
Sep 16 #Javascript
详解JS构造函数中this和return
Sep 16 #Javascript
Angular使用Md5加密的解决方法
Sep 16 #Javascript
使用JS实现气泡跟随鼠标移动的动画效果
Sep 16 #Javascript
EasyUI创建人员树的实例代码
Sep 15 #Javascript
webpack构建react多页面应用详解
Sep 15 #Javascript
You might like
php中操作memcached缓存进行增删改查数据的实现代码
2014/08/15 PHP
PHP 模拟登陆功能实例详解
2019/09/10 PHP
jQuery学习笔记[1] jQuery中的DOM操作
2010/12/03 Javascript
js函数排序的实例代码
2013/07/01 Javascript
JavaScript中奇葩的假值示例应用
2014/03/11 Javascript
基于insertBefore制作简单的循环插空效果
2015/09/21 Javascript
javaScript知识点总结(必看篇)
2016/06/10 Javascript
输入框点击时边框变色效果的实现方法
2016/12/26 Javascript
Web开发使用Angular实现用户密码强度判别的方法
2017/09/27 Javascript
浅谈vue项目可以从哪些方面进行优化
2018/05/05 Javascript
VUE+Element环境搭建与安装的方法步骤
2019/01/24 Javascript
vue实现全屏滚动效果(非fullpage.js)
2020/03/07 Javascript
解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题
2020/09/02 Javascript
vue实现动态给id赋值,点击事件获取当前点击的元素的id操作
2020/11/09 Javascript
python 根据正则表达式提取指定的内容实例详解
2016/12/04 Python
Flask框架信号用法实例分析
2018/07/24 Python
对python过滤器和lambda函数的用法详解
2019/01/21 Python
python基于FTP实现文件传输相关功能代码实例
2019/09/28 Python
学python安装的软件总结
2019/10/12 Python
vim自动补全插件YouCompleteMe(YCM)安装过程解析
2019/10/21 Python
Python csv文件的读写操作实例详解
2019/11/19 Python
Pandas时间序列:时期(period)及其算术运算详解
2020/02/25 Python
Django执行源生mysql语句实现过程解析
2020/11/12 Python
django中cookiecutter的使用教程
2020/12/03 Python
Python操作PostgreSql数据库的方法(基本的增删改查)
2020/12/29 Python
Python中lru_cache的使用和实现详解
2021/01/25 Python
纽约著名的服装辅料来源:M&J Trimming
2017/07/26 全球购物
广州一家公司的.NET面试题
2016/06/11 面试题
新郎父亲婚宴答谢词
2014/01/11 职场文书
见习期自我鉴定
2014/01/31 职场文书
公司授权委托书范本
2014/09/18 职场文书
领导参观欢迎词
2015/01/26 职场文书
学雷锋团日活动总结
2015/05/06 职场文书
python-for x in range的用法(注意要点、细节)
2021/05/10 Python
总结高并发下Nginx性能如何优化
2021/11/01 Servers
Python 的演示平台支持 WSGI 接口的应用
2022/04/20 Python