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 下[使用event很麻烦] 的问题.
Aug 22 Javascript
jQuery AJAX 调用WebService实现代码
Mar 24 Javascript
Jquery中对数组的操作代码
Aug 12 Javascript
基于jquery的跟随屏幕滚动代码
Jul 24 Javascript
JavaScript实现网页图片等比例缩放实现代码及调用方式
Feb 25 Javascript
Java/JS获取flash高宽的具体方法
Dec 27 Javascript
动态加载iframe时get请求传递中文参数乱码解决方法
May 07 Javascript
JavaScript jQuery 中定义数组与操作及jquery数组操作
Dec 18 Javascript
jQuery动态移除和添加背景图片的方法详解
Mar 07 Javascript
Vue表单及表单绑定方法
Sep 04 Javascript
详解JavaScript 浮点数运算的精度问题
Jul 23 Javascript
深入解读VUE中的异步渲染的实现
Jun 19 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学习教程之第2天
2008/06/15 PHP
PHP实现把数字ID转字母ID
2013/08/12 PHP
php接口数据加密、解密、验证签名
2015/03/12 PHP
PHP生成唯一订单号
2015/07/05 PHP
php脚本守护进程原理与实现方法详解
2017/07/20 PHP
详解PHP中curl_multi并发的实现
2020/06/08 PHP
JavaScript bold方法入门实例(把指定文字显示为粗体)
2014/10/17 Javascript
jQuery中:only-child选择器用法实例
2015/01/03 Javascript
jQuery中$this和$(this)的区别介绍(一看就懂)
2015/07/06 Javascript
利用jQuery实现漂亮的圆形进度条倒计时插件
2015/09/30 Javascript
JS实现CheckBox复选框全选、不选或全不选功能
2020/07/28 Javascript
对js eval()函数的一些见解
2016/08/15 Javascript
JavaScript仿支付宝6位数字密码输入框
2016/12/29 Javascript
Vue.js仿Metronic高级表格(一)静态设计
2017/04/17 Javascript
详解node中创建服务进程
2017/05/09 Javascript
利用jquery去掉时光轴头尾部线条的方法实例
2017/06/16 jQuery
JavaScript实现微信号随机切换代码
2018/03/09 Javascript
VUE Error: getaddrinfo ENOTFOUND localhost
2018/05/03 Javascript
vue组件实践之可搜索下拉框功能
2018/11/25 Javascript
layui实现数据表格自定义数据项
2019/10/26 Javascript
JS XMLHttpRequest原理与使用方法深入详解
2020/04/30 Javascript
jQuery 移除事件的方法
2020/06/20 jQuery
react-intl实现React国际化多语言的方法
2020/09/27 Javascript
微信小程序淘宝首页双排图片布局排版代码(推荐)
2020/10/29 Javascript
Vue+Bootstrap实现简易学生管理系统
2021/02/09 Vue.js
python连接oracle数据库实例
2014/10/17 Python
python中lambda()的用法
2017/11/16 Python
PyQt编程之如何在屏幕中央显示窗体的实例
2019/06/18 Python
python使用原始套接字发送二层包(链路层帧)的方法
2019/07/22 Python
详解python 利用echarts画地图(热力图)(世界地图,省市地图,区县地图)
2019/08/06 Python
技术总监岗位职责
2013/12/05 职场文书
计算机毕业生求职信
2014/06/10 职场文书
2016年小学端午节活动总结
2016/04/01 职场文书
导游词之海南天涯海角
2019/12/05 职场文书
Python OpenCV实现传统图片格式与base64转换
2021/06/13 Python
python读取并查看npz/npy文件数据以及数据显示方法
2022/04/14 Python