24-数组的扩展

一、运算符

  1. rest参数 ...变量名,主要用于函数的调用
{
    function fn(...arg){  //类似于arguments对象
        console.log(arg)
    }
    fn(1,2,3)
}

二、方法

  1. Array.from()方法:

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

实际应用中,常见的类似数组的对象是DOM操作返回的NodeList集合,以及函数内部的arguments对象。Array.from都可以将它们转为真正的数组。

{
    let uls = document.getElementsByTagName("li");
    let ulArr = Array.from(uls);
    ulArr.push('a')
    console.log(ulArr)   // [li, li, "a"]
} 
function fn(){
    console.log(arguments)
    let arr = Array.from(arguments);
    arr.push(4)
    console.log(arr)
}
fn(1,2,3)
  1. Array.of()方法:把一组值转换成数组
{
    console.log( Array.of(1,2,3,4,"a")) //[1, 2, 3, 4, "a"]
}
  1. copyWithin():

将指定位置的成员复制到其他位置(会覆盖原有成员),然后返回当前数组。也就是说,使用这个方法,会修改当前数组。

Array.prototype.copyWithin(target, start = 0, end = this.length)

target(必需):从该位置开始替换数据。
start(可选) : 从该位置开始读取数据,默认为0。如果为负值,表示倒数。
end(可选) : 到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒数。
这三个参数都应该是数值,如果不是,会自动转为数值。

{ 
    //正数
    console.log(["a", "b", "c", 40, 50].copyWithin(0, 3, 5)) //[40, 50, "c", 40, 50]
    // 第一个参数是被替换数据的开始位置
    // 第二个参数是替换数据开始的位置,包含此位置数据,从0开始
    // 第三个参数是替换数据结束的位置,不包含此位置数据,从0开始

    //负数
    console.log([1, 2, 3, 4, 5].copyWithin(0, -3, -2))  // [3, 2, 3, 4, 5]
    // 第一个参数是被替换数据的开始位置
    // 第二个参数是替换数据开始的位置,包含此位置数据,倒数从1开始
    // 第三个参数是替换数据结束的位置,不包含此位置数据,倒数从1开始
    //注意:结束位置的值要比开始位置的值大,不然不起作用
}
  1. find(value,index,arr)和findIndex(value,index,arr):

find():用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。

findIndex():数组实例的findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。

这两个方法的回调函数可以接受三个参数,依次为当前的值、当前的位置和原数组。

{
    let arr = [1,2,3,5];
    let re = arr.find(item=>{
        return item > 2   
    })
    console.log(re);   //3
}
{
    let arr = [1,2,3,5];
    let re = arr.findIndex(item=>{
        return item > 2   
    })
    console.log(re);   //2  3在下标2的位置
}
  1. fill():fill方法使用给定值,填充一个数组。
//参数1:替换的内容;参数2:开始位置;参数3:结束位置
{
    let arr = ["a","b","c",'d'];  
    console.log(arr.fill('o',0,3));   //[o, o, o, d]
}
  1. keys() 、values()、entries()

ES6提供三个新的方法——entries(),keys()和values()——用于遍历数组。它们都返回一个遍历器对象,可以用for...of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。

{
    let arr = ["a","b","c",'d'];
    for(let k of arr.keys()){
        console.log(k)  
        //0 1 2 3 
    }
    for(let k of arr.values()){
        console.log(k)  
        //a b c d
    }
    for(let [k,v] of arr.entries()){
        console.log(k,v)  
        //0, "a"
        //1, "b"
        //2, "c"
        //3, "d"
    }
}
  1. includes()方法:表示某个数组是否包含给定的值,返回布尔值
{
    let arr = ["a","b","c",'d'];
    console.log(arr.indexOf("b"))    //1
    console.log(arr.indexOf("o"))    //-1
    console.log(arr.includes("c"))   //true
    console.log(arr.includes("o"))   //false
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,826评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,968评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,234评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,562评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,611评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,482评论 1 302
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,271评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,166评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,608评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,814评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,926评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,644评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,249评论 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,866评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,991评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,063评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,871评论 2 354

推荐阅读更多精彩内容