js 数组 fill() 填充方法

 更新时间:2021年10月29日 09:44:32   投稿:hqx  
这篇文章主要介绍了js 数组 fill() 的填充方法,初始化数组的方法,但是初始化数组之后,数组中的每一项元素默认为 empty 空位占位,如何对数组这些空位添加默认的元素,ES6提供了 fill() 方法实现这一操作。本文总结数组 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()填充内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • JS数组去重详情

    JS数组去重详情

    这篇文章主要介绍JS数组去重,关于去重实际应用中,最常用的方法就是使用Set,也可以使用第三方库lodash来处理,下面一起来看看文章是怎么介绍JS数组去重的
    2021-11-11
  • js作用域及作用域链工作引擎

    js作用域及作用域链工作引擎

    这篇文章主要为大家介绍了js作用域及作用域链工作引擎,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • 微信小程序富文本渲染引擎的详解

    微信小程序富文本渲染引擎的详解

    这篇文章主要介绍了微信小程序富文本渲染引擎的详解的相关资料,希望通过本文能帮助到大家,让大家理解掌握这部分内容,需要的朋友可以参考下
    2017-09-09
  • 深入内存原理谈JS中变量存储在堆中还是栈中

    深入内存原理谈JS中变量存储在堆中还是栈中

    JavaScript中基本类型存储在堆中还是栈中,百度一下有很多不同的答案,本篇文章就来给大家为此做个详细的介绍,需要的朋友可以参考一下
    2021-09-09
  • JS前端常见的竞态问题解决方法详解

    JS前端常见的竞态问题解决方法详解

    这篇文章主要为大家介绍了JS前端常见的竞态问题解决方法详解,阅读完本文,你将会知道:什么是竞态问题;通常出现在哪些场景;解决竞态问题有哪些方法,希望能够有所帮助,祝大家多多进步,早日升职加薪的相关资料
    2022-08-08
  • JavaScript中使用toLocaleString数字格式化处理详解

    JavaScript中使用toLocaleString数字格式化处理详解

    这篇文章主要为大家介绍了JavaScript中使用toLocaleString数字格式化处理详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-08-08
  • 微信小程序 图片上传实例详解

    微信小程序 图片上传实例详解

    这篇文章主要介绍了微信小程序 图片上传实例详解的相关资料,需要的朋友可以参考下
    2017-05-05
  • JavaScript实现一键复制内容剪贴板

    JavaScript实现一键复制内容剪贴板

    这篇文章主要为大家介绍了JavaScript实现一键复制内容,document.execCommand原生JS设置剪贴板的实现示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • 微信小程序 vidao实现视频播放和弹幕的功能

    微信小程序 vidao实现视频播放和弹幕的功能

    这篇文章主要介绍了微信小程序 vidao实现视频播放和弹幕的功能的相关资料,这里提供实现代码及实现效果图,需要的朋友可以参考下
    2016-11-11
  • 动态引入DynamicImport实现原理

    动态引入DynamicImport实现原理

    这篇文章主要为大家介绍了动态引入DynamicImport实现原理详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-01-01

最新评论