美文网首页ES6 新特性
ES6 数组的拓展

ES6 数组的拓展

作者: 生命里那束光 | 来源:发表于2022-05-13 14:51 被阅读0次

一、ES6新增创建数组的方式

1.Array.of创建数组(ES6新增)

Array.of()方法用于将一组值,转换为数组。

Array.of()总是返回参数值组成的数组。如果没有参数,就返回一个空数组。

Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1

2.Array.from创建数组(ES6新增)

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

let arrayLike = {   //类似数组的对象
    0: 'tom', 
    1: '65',
    2: '男',
    3: ['jane','john','Mary'],
    'length': 4
}
//转化为真正的数组
let arr = Array.from(arrayLike)
console.log(arr) // ['tom','65','男',['jane','john','Mary']]

Array.from的三个参数:

Array.from(arrayLike[, mapFn[, thisArg]] )
1 参数一是被转换的对象
2 参数二是一个map函数方法
3 参数三是map里面this的指向

注意:数组中如果不添加元素,那打印出来的元素的值默认就是undefined

二、ES6新增的数组方法

ES6新增JS数组方法 作用 返回值 用法
find() 查找符合条件的元素 元素orubdefined arr.find()
findIndex() 查找符合条件的元素的索引 对应的索引 arr.findIndex()
includes() 判断一个数组是否包含一个指定的值 true或false arr.includes(value)
Array.isArray() 判断一个对象是否为数组 true或false Array.isArray([])
fill() 使用给定值,填充一个数组 新数组 Array(conut).fill(value)

1、find()

  • find 在数组中查找符合条件的元素,找到就返回 并且终止循环 找不到就是ubdefined
  • 书写格式:arr.find()
    let arr = [{id:1,name:'dee'},{id:2,name:'dee'},{id:3,name:'dee'},
    {id:4,name:'dee'},{id:5,name:'dee'}];
    // let obj = arr.find(function(item){
    //    return item == 3;
    // })
    // console.log(obj);
    // ubdefined
    let obj = arr.find(item => item.id > 1)
    console.log(obj);
    ({id:2,name:'dee'})  

2、findIndex()

  • findIndex 在数组中查找符合条件的元素,找到就返回对应的索引 并且终止循环 -1
  • 书写格式:arr.findIndex()
    let arr = [1, 2, 3, 4, 5];
    let obj = arr.findIndex(function(item) {
        return item > 6;
    })
    console.log(obj);  // -1

3、includes()

  • includes()方法,判断一个数组是否包含一个指定的值,返回一个布尔值。 参数是一个value,一般用于简单数组。
  • 对于复杂数组,则可以使用some()方法替代includes()方法
  • 书写格式:arr.includes(value)
var a = [1,2,3]
console.log(a.includes(1))  // true

4、Array.isArray()方法

  • 用来判断一个对象是否为数组
Array.isArray([])  // true
Array.isArray({})  // false

5、fill()方法

  • fill方法使用给定值,填充一个数组。
['a', 'b', 'c'].fill(7)
// [7, 7, 7]

new Array(3).fill(7)
// [7, 7, 7]

上面代码表明,fill方法用于空数组的初始化非常方便。数组中已有的元素,会被全部抹去。

  • fill方法还可以接受第二个和第三个参数,用于指定填充的起始位置和结束位置。
['a', 'b', 'c'].fill(7, 1, 2)
// ['a', 7, 'c']

相关文章

  • 【JavaScript高程总结】ES6 数组拓展

    ES6 数组拓展 ES6为Array新增的扩展 ...**(拓展运算符)---三个点将一个数组转为用逗号分隔的参数...

  • js 取数组中最大值

    es6拓展运算符 es5 apply(与方法1原理相同) for循环 数组sort() 数组reduce

  • es6数组拓展

    Array.from()该方法用于将类数组或者可遍历对象转化成数组 分析:对象里必须是连续的key值,并且需要le...

  • es6数组拓展

    Array.of方法 es6之前数组有个怪异的行为: array.of可以解决这个问题: Array.from 定...

  • ES6 数组的拓展

    一、ES6新增创建数组[https://so.csdn.net/so/search?q=%E6%95%B0%E7%...

  • 一些js小知识

    一、数组去重 ES6写法:1、set 、Array.from 2、...(拓展运算符) + set ES5写法: ...

  • es6之数组拓展

    本文目录: 1.扩展运算符 2.Array.from 3.Array.of 4.copyWithin 5.find...

  • es6数组拓展运算符应用于Vue实战---添加

    拓展运算符 剩余/拓展运算符也是ES6中一个非常重要的语法,使用3个点(...),后面跟着一个数组,它可以‘...

  • ES6学习笔记

    es6学习 一、in用法 : 二、数组处理方法: 三、数字操作 四、模板字符串 五、拓展运算符 六、 Object...

  • js数组扁平化和数组去重处理(对比)

    数组扁平化(多维数组)(es6) 数组去重 (es6) 数组去重(es5)

网友评论

    本文标题:ES6 数组的拓展

    本文链接:https://www.haomeiwen.com/subject/wxveurtx.html