前言

  我们知道了很多了初始化数组的方法,但是初始化数组之后,数组中的每一项元素默认为 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]

写在最后

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

js--数组的 fill() 填充方法详解的更多相关文章

  1. 转载 JS组件Bootstrap Select2使用方法详解

    JS组件Bootstrap Select2使用方法详解 作者:懒得安分 字体:[增加 减小] 类型:转载 时间:2016-01-26我要评论 这篇文章主要为大家介绍了JS组件Bootstrap Sel ...

  2. JavaScript中数组Array.sort()排序方法详解

    JavaScript中数组的sort()方法主要用于对数组的元素进行排序.其中,sort()方法有一个可选参数.但是,此参数必须是函数. 数组在调用sort()方法时,如果没有传参将按字母顺序(字符编 ...

  3. JavaScript中数组Array方法详解

    ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...

  4. Bootstrap Table使用方法详解

    http://www.jb51.net/article/89573.htm bootstrap-table使用总结 bootstrap-table是在bootstrap-table的基础上写出来的,专 ...

  5. js数组方法详解

    Array对象的方法-25个 /*js数组方法详解 */ /* * 1 concat() 用于连接多个数组或者值-------------- * 2 copyWithin() 方法用于从数组的指定位置 ...

  6. JS reduce()方法详解,使用reduce数组去重

     壹 ❀ 引 稍微有了解JavaScript数组API的同学,对于reduce方法至少有过一面之缘,也许是for与forEach太强大,或者filter,find很实用,在实际开发中我至始至终没使用过 ...

  7. JavaScript数组方法详解

    JavaScript数组方法详解 JavaScript中数组的方法种类众多,在ES3-ES7不同版本时期都有新方法:并且数组的方法还有原型方法和从object继承的方法,这里我们只介绍数组在每个版本中 ...

  8. [荐]Js apply()和call()方法详解 - http://www.w3cfuns.com/article-5596443-1-1.html

    本帖最后由 默默DE人生 于 2013-3-19 13:22 编辑 Js apply方法详解我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文 ...

  9. Js apply 方法 详解

    Js apply方法详解 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

随机推荐

  1. java9的JShell小工具和编译器两种自动优化

    一.按顺序逐步执行的脚本程序: 二.编译器自动优化 1.不超数据类型范围编译器自动添加强转操作: 2.一但发生运算,byte/short/char都会自动提升为Int,当只有常量参与运算时,编译器会先 ...

  2. unity2021游戏引擎安装激活并汉化

    今天重新搭建了下unity的开发环境,也踩了不少坑,还有就是看了一些unity3d的教程,越看越不可思议,unity居然能做这么多好玩的东西,像枪战类,模拟类,角色扮演,动作冒险都很震撼. 但是震撼归 ...

  3. 使用python快速搭建http服务

    python2语法:python -m SimpleHTTPServer python3语法:python -m http.server 在局域网中使用web去访问http:/IP:8000即可 可以 ...

  4. 【PHP数据结构】栈和队列的应用

    通过栈和队列的学习,我们似乎会感觉到其实数据结构还是非常简单的嘛.当然,这只是一个开始,我们从顺序表.链表开始,到现在的栈和队列,其实都是为了将来在铺路.在树和图的遍历算法中,都可以见到栈和队列的身影 ...

  5. 使用metaweblog API实现通用博客发布 之 版本控制

    使用metaweblog API实现通用博客发布 之 版本控制 接上一篇本地图片自动上传以及替换路径,继续解决使用API发布博客的版本控制问题. 当本地文档修订更新以后,如何发现版本更新,并自动发布到 ...

  6. 判断手机浏览器还是微信浏览器(PHP)

    //判断是否 微信浏览器 function isWeixin1() { if (strpos($_SERVER['HTTP_USER_AGENT'], 'MicroMessenger') !== fa ...

  7. 一个完整的SEO优化方案

    一个完整的SEO优化方案主要由四个小组组成: 一.前端/页编人员 二.内容编辑人员 三.推广人员 四.数据分析人员 接下来,我们就对这四个小组分配工作. 首先,前端/页编人员主要负责站内优化,主要从四 ...

  8. 开源ASR服务器vosk

    概述 近几年由于AI的迅速发展,语音相关的自然语言处理NLP项目也变多了,新的技术也越来越成熟,其中TTS(语音生成)和ASR(语音识别)是NLP中非常重要的环节. 今天我们介绍一个开源的ASR项目v ...

  9. python刷题第三周

    以下是本周有所收获的题目 第一题: 第4章-4 验证"哥德巴赫猜想" (20 分) 数学领域著名的"哥德巴赫猜想"的大致意思是:任何一个大于2的偶数总能表示为两 ...

  10. 一文让你彻底理解having和where的区别

    having子句与where都是设定条件筛选的语句,有相似之处也有区别. having与where的区别: having是在分组后对数据进行过滤 where是在分组前对数据进行过滤 having后面可 ...