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 核心参考教程 内置对象
Oct 13 Javascript
浏览器页面区域大小的js获取方法
Sep 21 Javascript
JavaScript中实现依赖注入的思路分享
Jan 15 Javascript
WordPress中利用AJAX异步获取评论用户头像的方法
Jan 08 Javascript
AngularJS学习笔记(三)数据双向绑定的简单实例
Nov 08 Javascript
微信小程序--onShareAppMessage分享参数用处(页面分享)
Apr 18 Javascript
详解bootstrap用dropdown-menu实现上下文菜单
Sep 22 Javascript
微信小程序使用map组件实现解析经纬度功能示例
Jan 22 Javascript
浅谈vue加载优化策略
Mar 19 Javascript
jQuery AJAX应用实例总结
May 19 jQuery
vue 实现把路由单独分离出来
Aug 13 Javascript
nuxt.js服务端渲染中axios和proxy代理的配置操作
Nov 06 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
Yii2使用小技巧之通过 Composer 添加 FontAwesome 字体资源
2014/06/22 PHP
PHP函数in_array()使用详解
2014/08/20 PHP
PHP处理大量表单字段的便捷方法
2015/02/07 PHP
thinkphp3.2.0 setInc方法 源码全面解析
2018/01/29 PHP
JavaScript之appendChild、insertBefore和insertAfter使用说明
2010/12/30 Javascript
一个页面放2段图片滚动代码出现冲突的问题如何解决
2012/12/21 Javascript
用客户端js实现带省略号的分页
2013/04/27 Javascript
Javascript和Java获取各种form表单信息的简单实例
2014/02/14 Javascript
Node.js 制作实时多人游戏框架
2015/01/08 Javascript
跟我学习javascript的undefined与null
2015/11/17 Javascript
JavaScript的instanceof运算符学习教程
2016/06/08 Javascript
Angular2 (RC4) 路由与导航详解
2016/09/21 Javascript
js实现一个简单的数字时钟效果
2017/03/29 Javascript
使用vue和datatables进行表格的服务器端分页实例代码
2017/06/07 Javascript
JavaScript插入排序算法原理与实现方法示例
2018/08/06 Javascript
JS隐藏号码中间4位代码实例
2019/04/09 Javascript
js计算两个时间差 天 时 分 秒 毫秒的代码
2019/05/21 Javascript
python使用cookie库操保存cookie详解
2014/03/03 Python
Python实现telnet服务器的方法
2015/07/10 Python
python 读写文件,按行修改文件的方法
2018/07/12 Python
Python一个简单的通信程序(客户端 服务器)
2019/03/06 Python
全面了解django的缓存机制及使用方法
2019/07/22 Python
通过python调用adb命令对App进行性能测试方式
2020/04/23 Python
python从Oracle读取数据生成图表
2020/10/14 Python
matplotlib bar()实现多组数据并列柱状图通用简便创建方法
2021/02/24 Python
潘多拉意大利官方网上商城:网上选购PANDORA珠宝
2018/10/07 全球购物
美国NBA官方商店:NBA Store
2019/04/12 全球购物
CheapTickets泰国:廉价航班,查看促销价格并预订机票
2019/12/28 全球购物
继承时候类的执行顺序问题,一般都是选择题,问你将会打印出什么?
2015/11/18 面试题
会计岗位职责
2013/11/08 职场文书
企业管理毕业生求职信
2014/03/11 职场文书
给学校的建议书范文
2014/05/15 职场文书
化工见习报告范文
2014/10/31 职场文书
婚庆答谢词大全
2015/09/29 职场文书
班干部学习委员竞选稿
2015/11/20 职场文书
python爬虫--selenium模块
2021/03/31 Python