es6 数组扩展方法

时间:2022-09-07 20:42:34
1.扩展运算符
    含义: 扩展运算符,三个点(...),将一个数组转为用逗号分隔的参数顺序。
      例如:
        console.log([1,2,3]);
        console.log(...[1,2,3]);
 
        结果: [1,2,3]
            1,2,3
        用法: 作为函数参数
          function f(x,y,z) {
            console.log(y);
            // 1
          }
          let args = [0,1,2];
            f(...args);
        用法:求数组的最大值
          Math.max(..[14,4,44]) //44
        应用:复制数组
          const a1 = [1,2];
          const a2 = a1;
          a2[0] = 2;
          a1 // [2,2]
        应用: 合并数组
          [1,2,...more]
        应用:与解构赋值结合
          [a,...reast] = list
        应用: 可以将字符串转为真正的数组
          console.log([...'hello'])
          [ "h", "e", "l", "l", "o" ]
2.Array.from()
    方法用于将两个类对象转为真正的数组。
      应用:类数组对象转为真正的数组
        let arrayLike = {
          '0':'a',
          '1':'b',
          '2':'c',
          length:3
        }
        let arr = Array.from(arrayLike);
        console.log(arr);
          //["a", "b", "c"]
    
      应用:将字符串转为数组
        var arr = Array.from('hello');
        console.log(arr);
        ["h", "e", "l", "l", "o"]
      如果是一个真正的数组那么返回原数组
        Array.from 还可以接受第二个参数。
        let arr = Array.from([1,2,3],(x)=> x*x);
          console.log(arr);
          // [1, 4, 9]
3.Array.of 方法用于将一组数值,转为数组
    例如:
      var arr = Array.of(3,11,8);
        console.log(arr);
        // [3, 11, 8]
4.数组实例的 copyWithin()
    数组实例的copyWithin 方法,在当前数组内部,将指定位置的成员复制到其他位置,
  (会覆盖原来成员),然后返回当前数组,也就是说,使用这个方法,会修改当前数组。
 
    它接受三个参数。
      target(必需):从该位置开始替换数据。
      start(可选):从该位置开始读取数据,默认为 0。如果为负值,表示倒数。
      end(可选):到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒。
5.数组的实例的 find() 和findIndex()
    数组实例的find 方法,用于找出第一个符合条件的数组成员,它的参数是一个回调函
    数,所有出租成员一次执行该回调函数,直到找到的哥返回值为true的成员,然后
    返回该成员,如果没有符合条件的返回aundefined
 
    let a = [1,4,-5,10].find((n)=> n <0)
      console.log(a); // -5
    let b = [1,5,10,15].find(function (value,index,arr) {
      return value > 9;
    })
    console.log(b); // 10
    findIndex 方法的用法与find 方法返回非常类似,返回第一个符合条件的数组
      成员的位置,如果所有成员不符合条件返回-1。
      例如[1,5,10,15].findIndex(function(value,index,arr){
        return value > 9;
      })
6.数组实例的fill()
    fill 方法使用给定值,填充一个数组;
    var arr = ['a','b','c'].fill(7);
    console.log(arr); // [7,7,7]
7.数组实例的 entries(), keys() 和 values()用于遍历数组,他们都是返回一个遍历器对象。
    keys() 是对键名的遍历,values() 是对键值的变量,entries() 是对键值对的遍历。
    for (let index of ['a','b'].keys()){
      console.log(index);
    }
8.数组实例的includes()
    Array.prototype.includes 方法返回一个布尔值,表示某个数组是否包含给定的值。
    [1,2,3].includes(2) // true
    [1,2,3,4].includes(4) //false

es6 数组扩展方法的更多相关文章

  1. ES6数组扩展

    前面的话 数组是一种基础的JS对象,随着时间推进,JS中的其他部分一直在演进,而直到ES5标准才为数组对象引入一些新方法来简化使用.ES6标准继续改进数组,添加了很多新功能.本文将详细介绍ES6数组扩 ...

  2. JavaScript ES6 数组新方法 学习随笔

    JavaScript ES6 数组新方法 学习随笔 新建数组 var arr = [1, 2, 2, 3, 4] includes 方法 includes 查找数组有无该参数 有返回true var ...

  3. ES6之数组扩展方法【一】(相当好用)

    form 转化为真正的数组 先说一下使用场景,在Js中,我们要经常操作DOM,比如获取全部页面的input标签,并且找到类型为button的元素,然后给这个按钮注册一个点击事件,我们可能会这样操作: ...

  4. ES6 数组遍历方法的实战用法总结(forEach,every,some,map,filter,reduce,reduceRight,indexOf,lastIndexOf)

    目录 forEach every some map filter reduce && reduceRight indexOf lastIndexOf 前言 ES6原生语法中提供了非常多 ...

  5. es6数组的方法

    1.复习的函数 函数是由关键字function声明的,他是一个引用数据类型,是Function的实例,在调用的时候会开辟一个私有空间 2.函数的成员 arguments:null  (是实参构成的数组 ...

  6. ES6 - 数组扩展(扩展运算符)

    扩展运算符 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算(函数),将一个数组转为用逗号分隔的参数序列. rest: 变量将多余的参数放入数组中. spread(扩展): ...

  7. ES6数组去重方法

    Set实例的方法分为两大类:操作方法(用于操作数据)和遍历方法(用于遍历成员),操作方法有:add(value).delete(value).has(value).clear():遍历方法有:keys ...

  8. ES6 数组的方法

     数组的类 数组的类是Array 数组的定义 var arr=[元素] var arr=new Array(3) 数字3,代表有三个元素或者三个空位 如果数组定义采用 new 实例,类中跟的是一个数字 ...

  9. ES6 数组扩展

    1....扩展运算符 该运算符将一个数组,变为参数序列. 作用:(1)代替aplly 'use strict'; Math.max(...[2,5,8]) (2)将字符串转为数组 2.Array.fr ...

随机推荐

  1. 利用H5和ChromiumWebBrowser构建应用

    chromium是google chrome浏览器所采用的内核,最开始由苹果的webkit发展而出,由于webkit在发展上存在分歧,而google希望在开发上有更大的*度,2013年google决 ...

  2. 【Solr】数据库数据导入索引库

    目录 分析框图 配置数据库与solrconfig.xml 回到顶部 分析框图 框图画的粗糙!勿喷啊!勿喷啊! 回到顶部 配置数据库与solrconfig.xml Dataimport插件 可以批量把数 ...

  3. CSS Sticky Footer&colon; 完美的CSS绝对底部

    CSS的简单在于它易学,CSS的困难在于寻找更好的解决方案.在CSS的世界里,似乎没有完美这种说法.所以,现在介绍的CSS绝对底部,只是目前个人见过的方案中比较完美的吧. 先说我们为什么会使用到这个C ...

  4. ASP&period;NET Web API路由规

    默认的规则 在ASP.NET MVC4中 global.asax.cs代码中并无注册默认路由规则的代码 代码如下: public class WebApiApplication : System.We ...

  5. iOS开发——设备篇&amp&semi;ios8文件路径

    ios8文件路径 1,之前版本的(比如iOS7)的文件路径如下:  app路径  /var/mobile/Applications/59C84B75-0900-43D6-AD6F-AB9731F064 ...

  6. 【ZZ】常用推荐算法

    http://liyonghui160com.iteye.com/blog/2082450 在推荐系统简介中,我们给出了推荐系统的一般框架.很明显,推荐方法是整个推荐系统中最核心.最关键的部分,很大程 ...

  7. 佛山Uber优步司机奖励政策(1月25日~1月31日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  8. reflact中GetMethod方法的使用

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.R ...

  9. typeconfig&period;json配置说明

    如果一个目录下存在一个tsconfig.json文件,那么它意味着这个目录是TypeScript项目的根目录. 不带任何输入文件的情况下调用tsc,编译器会从当前目录开始去查找tsconfig.jso ...

  10. luogu P3172 &lbrack;CQOI2015&rsqb;选数

    传送门 颓了一小时柿子orz 首先题目要求的是\[\sum_{x_1=l}^{r}\sum_{x_2=l}^{r}...\sum_{x_n=l}^{r}[gcd(x_1,x_2...x_n)=k]\] ...