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 相关文章推荐
基础的prototype.js常用函数及其用法
Mar 10 Javascript
JQuery为textarea添加maxlength属性的代码
Apr 07 Javascript
js页面跳转常用的几种方式
Nov 25 Javascript
关于include标签导致js路径找不到的问题分析及解决
Jul 09 Javascript
js中substring和substr的定义和用法
May 05 Javascript
jQuery validate插件实现ajax验证重复的2种方法
Jan 22 Javascript
javascript计时器编写过程与实现方法
Feb 29 Javascript
理解AngularJs篇:30分钟快速掌握AngularJs
Dec 23 Javascript
layui表格实现代码
May 20 Javascript
vue-router传参用法详解
Jan 19 Javascript
Vue实现商品分类菜单数量提示功能
Jul 26 Javascript
javascript执行上下文、变量对象实例分析
Apr 25 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设计模式 Singleton(单例模式)
2011/06/26 PHP
CI框架出现mysql数据库连接资源无法释放的解决方法
2016/05/17 PHP
浅谈PHP5.6 与 PHP7.0 区别
2019/10/09 PHP
jquery 事件对象属性小结
2010/04/27 Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
2011/07/08 Javascript
html组件不可输入(只读)同时任何组件都有效
2013/04/01 Javascript
jQuery删除节点的三个方法即remove()detach()和empty()
2013/12/27 Javascript
详解React Native网络请求fetch简单封装
2017/08/10 Javascript
jfinal与bootstrap的登出实战详解
2017/11/27 Javascript
详解刷新页面vuex数据不消失和不跳转页面的解决
2018/01/30 Javascript
浅谈js获取ModelAndView值的问题
2018/03/28 Javascript
vue实现底部菜单功能
2018/07/24 Javascript
[原创]微信小程序获取网络类型的方法示例
2019/03/01 Javascript
vue如何截取字符串
2019/05/06 Javascript
vue内置组件keep-alive事件动态缓存实例
2020/10/30 Javascript
python socket多线程通讯实例分析(聊天室)
2016/04/06 Python
使用Python3制作TCP端口扫描器
2017/04/17 Python
Python实现输入二叉树的先序和中序遍历,再输出后序遍历操作示例
2018/07/27 Python
对python中Json与object转化的方法详解
2018/12/31 Python
详解PyCharm+QTDesigner+PyUIC使用教程
2019/06/13 Python
使用Python画股票的K线图的方法步骤
2019/06/28 Python
Python.append()与Python.expand()用法详解
2019/12/18 Python
解析Python 偏函数用法全方位实现
2020/06/26 Python
CSS3制作漂亮的照片墙的实现代码
2016/06/08 HTML / CSS
优秀学生自我鉴定范例
2013/12/18 职场文书
咖啡蛋糕店创业计划书
2014/01/28 职场文书
高三体育教学反思
2014/01/29 职场文书
公务员综合考察材料
2014/02/01 职场文书
餐厅周年庆活动方案
2014/08/25 职场文书
2015教师个人师德工作总结
2015/10/23 职场文书
python 如何用map()函数创建多线程任务
2021/04/07 Python
python3.7.2 tkinter entry框限定输入数字的操作
2021/05/22 Python
详解非极大值抑制算法之Python实现
2021/06/28 Python
Spring Security中用JWT退出登录时遇到的坑
2021/10/16 Java/Android
vue使用echarts实现折线图
2022/03/21 Vue.js
MySQL数据库表约束讲解
2022/06/21 MySQL