js 数组 fill() 填充方法


Posted in Javascript onNovember 02, 2021

js 数组 fill() 填充方法

前言:

  我们知道了很多了初始化数组的方法,但是初始化数组之后,数组中的每一项元素默认为 empty 空位占位,如何对数组这些空位添加默认的元素,ES6提供了 fill() 方法实现这一操作。本文总结数组 fill() 方法的详细使用。

1、fill()  语法

  fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。返回修改后的原始数组,不创建新数组。

  使用语法:array.fill( value [,start [,end]]),其中 :

  • value 用来填充数组元素的值,必填。
  • start 可选起始索引,默认值为0。
  • end 可选终止索引,默认值为 this.length

2、fill() 的使用

 

// 当传入单个参数的时候,该方法会用该参数的值填充整个数组
    var arr1 = new Array(5)
    console.log(arr1.fill(1)); //[1,1,1,1,1]
    var arr2 = [1, 2, 3, 4]
    console.log(arr2.fill(0)); //[0,0,0,0]

    // 当传入两个参数的时候,第一个参数为填充的元素,第二个为填充元素的起始位置
    var arr3 = [0, 1, 2, 3, 4, 5, 6]
    console.log(arr3.fill(1, 3)); //[0,1,2,1,1,1,1]

    // 当传入三个参数的时候,第一个参数为填充的元素,第二个参数和第三个参数分别指填充元素的起始和终止位置,不修改终止位置元素
    var arr4 = [0, 1, 2, 3, 4, 5]
    console.log(arr4.fill(1, 3, 5)); //[0,1,2,1,1,5]
    
    //如果提供的起始位置或结束位置为负数,则他们会被加上数组的长度来算出最终的位置,例如 起始位置为-1 就相当于array.length-1
    var arr5 = [0, 1, 2, 3, 4, 5]
    console.log(arr5.fill(1, -3));//[0,1,2,1,1,1]
    var arr6 = [0, 1, 2, 3, 4, 5]
    console.log(arr6.fill(1, 3, -2));//[0,1,2,1,4,5]

3、总结

以上就是本文的全部内容,希望给读者带来些许的帮助和进步,方便的话点个关注,小白的成长之路会持续更新一些工作中常见的问题和技术点。

到此这篇关于js 数组 fill() 填充方法的文章就介绍到这了,更多相关js 数组 fill()填充内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
javascript 关闭IE6、IE7
Jun 01 Javascript
ASP.NET中AJAX 调用实例代码
May 03 Javascript
jQuery动态地获取系统时间实现代码
May 24 Javascript
微信分享的标题、缩略图、连接及描述设置方法
Oct 14 Javascript
根据配置文件加载js依赖模块
Dec 29 Javascript
js+flash实现的5图变换效果广告代码(附演示与demo源码下载)
Apr 01 Javascript
微信小程序之小豆瓣图书实例
Nov 30 Javascript
xmlplus组件设计系列之网格(DataGrid)(10)
May 05 Javascript
vue draggable resizable gorkys与v-chart使用与总结
Sep 05 Javascript
vue 中固定导航栏的实例代码
Nov 01 Javascript
详解Webpack抽离第三方类库以及common解决方案
Mar 30 Javascript
基于JavaScript获取url参数2种方法
Apr 17 Javascript
浅谈 JavaScript 沙箱Sandbox
详解 TypeScript 枚举类型
Nov 02 #Javascript
前端JavaScript大管家 package.json
JavaScript 原型与原型链详情
javascript实现计算器功能详解流程
JS创建或填充任意长度数组的小技巧汇总
Oct 24 #Javascript
一文彻底理解js原生语法prototype,__proto__和constructor
Oct 24 #Javascript
You might like
PHP下使用CURL方式POST数据至API接口的代码
2013/02/14 PHP
php简单构造json多维数组的方法示例
2017/06/08 PHP
CI框架附属类用法分析
2018/12/26 PHP
HTTP头隐藏PHP版本号实现过程解析
2020/12/09 PHP
ThinkPHP5.1的权限控制怎么写?分享一个AUTH权限控制
2021/03/09 PHP
jQuery 扩展对input的一些操作方法
2009/10/30 Javascript
js 动态选中下拉框
2009/11/26 Javascript
javascript 密码强度验证规则、打分、验证(给出前端代码,后端代码可根据强度规则翻译)
2010/05/18 Javascript
javascript获取xml节点的最大值(实现代码)
2013/12/11 Javascript
元素绑定click点击事件方法
2015/06/08 Javascript
jQuery基于ajax实现带动画效果无刷新柱状图投票代码
2015/08/10 Javascript
jquery采用oop模式class类的使用示例
2016/01/22 Javascript
详解jQuery中的empty、remove和detach
2016/04/11 Javascript
令按钮悬浮在(手机)页面底部的实现方法
2017/05/02 Javascript
nodejs body-parser 解析post数据实例
2017/07/26 NodeJs
关于echarts在节点显示动态数据及添加提示文本所遇到的问题
2018/04/20 Javascript
Vue项目移动端滚动穿透问题的实现
2020/05/19 Javascript
vue中watch和computed的区别与使用方法
2020/08/23 Javascript
JS如何实现在弹出窗口中加载页面
2020/12/03 Javascript
Python操作MongoDB数据库PyMongo库使用方法
2015/04/27 Python
浅谈Scrapy框架普通反爬虫机制的应对策略
2017/12/28 Python
python如何派生内置不可变类型并修改实例化行为
2018/03/21 Python
python中字符串数组逆序排列方法总结
2019/06/23 Python
使用python求解二次规划的问题
2020/02/29 Python
Python如何读写CSV文件
2020/08/13 Python
PyChon中关于Jekins的详细安装(推荐)
2020/12/28 Python
STP协议的主要用途是什么?为什么要用STP
2012/12/20 面试题
金属材料工程毕业生个人的自我评价
2013/11/28 职场文书
二手房购房协议书范本
2014/10/05 职场文书
爱心募捐感谢信
2015/01/22 职场文书
观看《信仰》心得体会
2016/01/15 职场文书
高三语文教学反思
2016/02/16 职场文书
《圆的面积》教学反思
2016/02/19 职场文书
Spring Boot两种全局配置和两种注解的操作方法
2021/06/29 Java/Android
OpenCV图像变换之傅里叶变换的一些应用
2021/07/26 Python
九大龙王魂骨,山龙王留下躯干骨,榜首死的最憋屈(被捏碎)
2022/03/18 国漫