今天处理数据时用到了Array.from()和Array.fill()方法,平时用的不多,这里记一下。

我的需求是要把字符串'abc',处理为[{exaple: 'abc_001.bcd'}, {exaple: 'abc_002.bcd'}, {exaple: 'abc_003.bcd'}]

处理方法如下:

// 创建数组['abc', 'abc', 'abc']
let arr = new Array().fill('abc'); arr = Array.from(covers, (item, index) => { return { example: `${item}_00${index + }.bcd` } });

  

一、Array.fill()

Array.fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。

例子:

const array1 = [1, 2, 3, 4];

// fill with 0 from position 2 until position 4
console.log(array1.fill(0, 2, 4));
// expected output: [1, 2, 0, 0] // fill with 5 from position 1
console.log(array1.fill(5, 1));
// expected output: [1, 5, 5, 5] console.log(array1.fill(6));
// expected output: [6, 6, 6, 6]

参考:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/fill

二、Array.from()

Array.from() 方法从一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例。

例子:

console.log(Array.from('foo'));
// expected output: Array ["f", "o", "o"] console.log(Array.from([1, 2, 3], x => x + x));
// expected output: Array [2, 4, 6]

  参考:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/from

END--------------------------

你藏在我衣服的針線裡面,我藏在你口袋裡面。

ES6的Array.from()和Array.fill()方法的更多相关文章

  1. es6 --数组--Array.from() 、Array.isArray()、Array.of()、find()、findIndex()、fill()、entries() 、keys() ,values()

    将两类对象转为真正的数组 Array.from()方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Se ...

  2. ES6数组的扩展--Array.from()和Array.of()

    一. Array.from() : 将伪数组对象或可遍历对象转换为真数组 1.何为伪数组 如果一个对象的所有键名都是正整数或零,并且有length属性,那么这个对象就很像数组,语法上称为"类 ...

  3. js--数组的 Array.of() 和 Array.from() 方法的使用总结

    前言 JavaScript 中数组的本质是一个对象,它存在的 length 属性值随数组元素的长度变化,但是开发中经常会遇到拥有 length 属性和若干索引属性的对象,被称为类数组对象,类数组对象和 ...

  4. 修复浏览器不支持Array自带的indexOf方法的扩展

    JavaScript中Array的indexOf方法支持的浏览器有:IE9+.Firefox 2+.Safari 3+.Opera 9.5+和Chrome 如果想要在不支持的浏览器中使用indexOf ...

  5. 总结Array类型中常用的方法

    Array类型应该是 ECMAScript 中最常用的类型之一了,并且它定义的数组与其他语言有着相当大的区别.数组是数据的有序集合,我们可以通过下标对指定位置的数据进行读 写:特别的是,在 ECMAS ...

  6. Vue源码之----为什么Vue中Array的pop,push等方法可以reactive,而Array[0]='a'这样的方法不会reactive?

    这就要从reactive开始讲起了,粗略的说,js的操作能引起页面上显示的改变,是因为该操作引起了组件的重新渲染,渲染会生成新的虚拟节点,新节点和旧节点会对比,操作浏览器的node进行改变. vue实 ...

  7. js中Array数组的属性和方法

    这是我自己整理出来的一些关于Array数组的属性和方法,即查即用. 1.Array.length属性:数组的项数组,始终返回0或者更大的值. 2.instanceof操作符:value instanc ...

  8. JavaScript高级编程——引用类型、Array数组使用、栈方法

    JavaScript高级编程——引用类型.Array数组使用.栈方法 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999 ...

  9. javascript总结25:Array的5中迭代方法: every(), filter() , forEach() map() some()

    1 Array常用的操作方法: 1 操作方法 - concat() //把参数拼接到当前数组 -slice() //从当前数组中截取一个新的数组,不影响原来的数组,参数start从0开始,end从1开 ...

随机推荐

  1. 生死状:苹果VS他的供应商

    据知情人士透露,苹果已经组建了代号为Titan的汽车团队,并招募了数百名员工,准备进入汽车领域,iCar大有呼之欲出之势.事实上,苹果CEO蒂姆-库克早在去年就参观了宝马位于莱比锡的核心工厂,学习如何 ...

  2. 安装Redis内存分析工具rdbtools

    一.安装Python2.7 1. wget http://10.12.29.98:8090/tools/Python-2.7.11.tgz 2. ln -s /usr/local/python2.7/ ...

  3. gcc编译器常用选项的含义

    -w: 关闭编译时的警告, 也就是编译后不显示任何warning,因此有时编译中会出现一些诸如数据转换之类的可忽略警告, -Wall: 显示编译后所有警告 -W: 显示警告,但是只是显示编译器认为的会 ...

  4. CentOS7搭建FTP Server

    本文主要记录CentOS下FTP Server的安装和配置流程. 安装vsftpd yum install -y vsftpd 启动vsftpd service vsftpd start 运行下面的命 ...

  5. CSS中怎么设置元素水平垂直居中?

    记录怎么使用text-align与vertical-align属性设置元素在容器中垂直居中对齐.text-align与vertical-align虽然都是设置元素内部对齐方式的,但两者的用法还是有略微 ...

  6. JavaScript中如何给按钮设置隐藏与显示属性

    */ * Copyright (c) 2016,烟台大学计算机与控制工程学院 * All rights reserved. * 文件名:text.html * 作者:常轩 * 微信公众号:Worldh ...

  7. JavaScript 预解析机制

    首先我们来看一段代码: <script> console.log(a); var a = 10; </script> 此时运行结果为   为什么会显示undefined呢?这就 ...

  8. sublime 安装Anaconda插件 配置python开发环境

    我的sublime 3  python 3.6.6 安装Anaconda插件 由于Anaconda插件本身无法知道Python安装的路径,所以需要设置Python主程序的实际位置.选择Settings ...

  9. datatable某列不排序、和自定义搜索、给数据里面加属性

    datatable中如果不想对前几列进行排序,使用以下代码: $('#informationList').DataTable({ //对0,1,2列不排序 "columnDefs" ...

  10. TOMCAT封装DBCP

    ## 数据源 ## #Tomcat封装的DBCP: >> 基本知识: tomcat在默认情况下已经集成了DBCP: >> JNDI: |-- 基本概念: 在tomcat启动的时 ...