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 IE 浏览器判定代码
Mar 21 Javascript
分享20款好玩的jQuery游戏
Apr 17 Javascript
封装了一个支持匿名函数的Javascript事件监听器
Jun 05 Javascript
node中socket.io的事件使用详解
Dec 15 Javascript
javascript实现表格排序 编辑 拖拽 缩放
Jan 02 Javascript
javascript弹性运动效果简单实现方法
Jan 08 Javascript
轻松实现JavaScript图片切换
Jan 12 Javascript
AngularJS基础 ng-value 指令简单示例
Aug 03 Javascript
js实现各种复制到剪贴板的方法(分享)
Oct 27 Javascript
JavaScript 值类型和引用类型的初次研究(推荐)
Jul 19 Javascript
Javascript将图片的绝对路径转换为base64编码的方法
Jan 11 Javascript
JS设计模式之访问者模式定义与用法分析
Feb 05 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数据结构与算法(PHP描述) 快速排序 quick sort
2012/06/21 PHP
PHP中的print_r 与 var_dump 输出数组
2016/06/13 PHP
php安装扩展mysqli的实现步骤及报错解决办法
2017/09/23 PHP
PHP设计模式之抽象工厂模式实例分析
2019/03/25 PHP
文本链接逐个出现的js脚本
2007/12/12 Javascript
JQuery的read函数与js的onload不同方式实现
2013/03/18 Javascript
JavaScript实现存储HTML字符串示例
2014/04/21 Javascript
jquery.mousewheel实现整屏翻屏效果
2015/08/30 Javascript
JS中Json数据的处理和解析JSON数据的方法详解
2016/06/29 Javascript
简单分析javascript中的函数
2016/09/10 Javascript
angular forEach方法遍历源码解读
2017/01/25 Javascript
详解vue-cli 构建Vue项目遇到的坑
2017/08/30 Javascript
vue源码学习之Object.defineProperty 对数组监听
2018/05/30 Javascript
vue+mousemove实现鼠标拖动功能(拖动过快失效问题解决方法)
2018/08/24 Javascript
layui数据表格实现重载数据表格功能(搜索功能)
2019/07/27 Javascript
浅谈laytpl 模板空值显示null的解决方法及简单的js表达式
2019/09/19 Javascript
在Python的web框架中配置app的教程
2015/04/30 Python
Python实现多进程共享数据的方法分析
2017/12/04 Python
python3爬虫学习之数据存储txt的案例详解
2019/04/24 Python
Python3之手动创建迭代器的实例代码
2019/05/22 Python
Python 多个图同时在不同窗口显示的实现方法
2019/07/07 Python
Python turtle画图库&&画姓名实例
2020/01/19 Python
Python图片处理模块PIL操作方法(pillow)
2020/04/07 Python
python字典的值可以修改吗
2020/06/29 Python
英国第一豪华护肤品牌:Elemis
2017/10/12 全球购物
美国香薰蜡烛品牌:PADDYWAX
2018/10/06 全球购物
美国最佳在线航班预订网站:LookupFare
2019/03/26 全球购物
设计总监岗位职责
2013/12/07 职场文书
各营销点岗位职责范本
2014/03/05 职场文书
老公保证书范文
2014/04/29 职场文书
反对四风自我剖析材料
2014/10/07 职场文书
超市员工辞职信范文
2015/05/12 职场文书
遗失证明范文
2015/06/19 职场文书
人力资源部工作计划
2019/05/14 职场文书
vue+iview实现手机号分段输入框
2022/03/25 Vue.js
MySQL事务的隔离级别详情
2022/07/15 MySQL