精华内容
下载资源
问答
  • es6删除数组某一项_JS中数组的入门知识点
    2020-11-20 09:54:56
    7925d7a69298e98d74bde8488c9cfff3.png

    数组:数组用于存放多个数据。

    组数的创建方式

    1、var arr = new Array(长度);

    长度为数组内数据的总数,长度一定是非负整数。

    也可以在创建数组的同时,初始化数组的每一项值:

    var arr = new Array(1,2,3,4,5);

    此方法一般不常用。

    2、var arr = [1,2,3,4,5];这是创建数组的常用方法。

    注意:数组里可以存放任何数据,并非只有数字。数组的本质是对象。

    数组中的属性

    length属性:

    数组的长度,会自动变化,值为最大的下标。

    length是可以赋值的,但会改变组数,一般不会给length赋值。

    下标

    数字字符串属性:

    叫做下标,也可以叫做索引,相当于数组中的每一项数据的编号,下标从0开始排列。

    注意:通常情况下,数组的下标是连续的。下标不连续的数组叫做稀松数组。

    数组中常见的操作

    1、添加数据

    (1)、直接下标添加

    arr[length] = " abc ";向数组的末尾添加一项值为“abc“;

    (2)、数组.push()方法。向数组末尾添加一项数据

    var arr = [1,2,3,4,5];

    arr.push(6);

    console.log(arr);// [1,2,3,4,5,6];

    (3)、数组.unshift()方法。向数组开头添加一项,数组的下标会依次后移。

    push()和unshift()方法是可以同时添加多个数据的。

    (4)、数组.splice()方法。

    splice(下标,删除个数,添加个数);从指定下标为开始,删除几个,然后在该位置添加几个数据。

    var arr = [ 1,2,3,4];

    arr.splice(2,0,“abc”,“abc”);

    解析:从下标2开始,删除0位,依次添加“abc”,“abc”,两个数据。

    如果下标超出范围,则按照范围边界进行处理。

    2、删除数据

    (1)、delete

    (2)、数组.pop()方法。删除数组的最后一位,并返回最后一项的数据。

    (3)、数组.shift()方法。删除数组的第一位,并返回第一项的数据。

    (4)、数组.slice()方法。

    数组.slice(起始位置的下标,结束位置的下标),将起始位置和结束位置之间的数据截取出来,然后并返回一个新数组,但不会改变原数组。

    注意:结束下标取不到,下标是负数,则从数据的末尾开始截取,如果不写结束下标,则直接截取到末尾。

    3、数组清空

    数组.splice(0,arr.length);从0位开始,删除数组的长度,数组也会被清空。

    数组.length = 0;改变数组的长度为0,这样,数组就会被清空。

    4、查找数组的每一项下标

    数组.indexOf(下标)方法。

    从数组中依次查找对应的数据,查找时使用严格相等进行比较,找到第一个数据的下标,并返回;如果没有招到,则返回-1.

    数组.lastindexOf(下标)方法。

    数组最后一个匹配下标。

    以上,就是数组的常见的应用和方法,希望对大家有所帮助。

    更多相关内容
  • 对于JS中的数组(Array)我们经常使用,今天总结了一下常见的Array方法。1. length数组长度 let arr = ['a', 'b', 'c', 'd']; console.log(arr.length);2. join()以指定的字符将数组连接起来,变成字符串通常和String...

    对于JS中的数组(Array)我们经常使用,今天总结了一下常见的Array方法。

    1. length

    数组长度

    let arr = ['a', 'b', 'c', 'd'];

    console.log(arr.length);

    a4a5dcea1f06a6ab2c36c04450df959b.png

    2. join()

    以指定的字符将数组连接起来,变成字符串

    通常和String中的split连用,splint 是以指定字符分割成数组

    参数:指定的字符, 如果未传参则是以逗号(,)分割

    let arr = ['a', 'b', 'c', 'd'];

    console.log(arr.join('1'));

    console.log(arr.join());

    console.log(arr.join(''));

    3928bdb22fd6c73d4a7b2e437a3f083f.png

    3. slice()

    按传入的下标截取数组

    参数1:开始截取的位置即下标

    参数2:可选 若不传则默认截取到末尾。若传入则截取到该下标的前一位,不包括当前下标的一位。

    返回值:返回按指定下标截取后的数组(前包后不包),不会影响原数组 (若想删除一个数组中的某几项则用splice())

    若传入负数则从数组的末尾往前数

    let arr = ['a', 'b', 'c', 'd', 'e', 'f'];

    console.log(arr);

    console.log(arr.slice(1, 3));

    console.log(arr.slice(1));

    console.log(arr.slice(-3));

    console.log(arr.slice(-3, -1));

    1e5d509c75ddece509e9f94817beccdc.png

    4. splice() 删除或添加数组

    参数1:开始删除的位置即下标

    参数2:可选 删除元素个数长度。若不传则默认删除到最后

    参数3,4,5...: 添加的项数

    返回值:返回删除后的数组,会改变原数组

    let arr = ['a', 'b', 'c', 'd', 'e', 'f'];

    console.log(arr);

    console.log(arr.splice(2, 3));

    console.log(arr);

    let arr1 = ['a', 'b', 'c', 'd', 'e', 'f'];

    console.log(arr1);

    console.log(arr1.splice(2, 2, 'xx', 'aa'));

    console.log(arr1);

    b9f857efccadfbba1657b8fe28ce3b30.png

    5. pop()和push()

    pop() 移除数组的最后一项

    返回值:返回删除的项,会改变数组长度

    push() 向一个数组后面添加项数

    返回值:返回添加后的数组长度, 会改变原来数组

    let arr = ['a', 'b', 'c'];

    console.log(arr);

    console.log(arr.pop());

    console.log(arr);

    let arr1 = ['a', 'b', 'c'];

    console.log(arr1);

    console.log(arr1.push('z'));

    console.log(arr1);

    ab37baae6adb7d1c363d100333159384.png

    6. shift()和unshift()

    shift() 删除数组中的第一项

    返回值:返回删除的项 会改变原数组

    unshift() 向数组的最前面添加项

    返回值:返回新的数组长度, 会改变原数组

    let arr = ['a', 'b'];

    console.log(arr);

    console.log(arr.shift());

    console.log(arr);

    let arr1 = ['a', 'b'];

    console.log(arr1);

    console.log(arr1.unshift('x', 'z'));

    console.log(arr1);

    3f624942535f4c20acf4f70975135aca.png

    7. sort()

    排序从小到大

    返回值: 返回新数组 会改变原数组

    let arr = [1, 3, 5, 3, 2, 4];

    console.log(arr);

    console.log(arr.sort());

    console.log(arr);

    9898e14298e9dca50771043a715d8fb2.png

    8. reverse()

    数组反转

    返回值:返回新数组,会改变原数组

    let arr = [1, 3, 5, 3, 2, 4];

    console.log(arr);

    console.log(arr.reverse());

    console.log(arr);

    d6e27ea55bb751f25fc0d37051e0784d.png

    9. concat()

    两个数组连接

    返回值:返回新数组,不会改变原数组

    let arr = ['a', 'b'];

    let arr1 = ['x', 'z'];

    console.log(arr.concat(arr1));

    console.log(arr);

    console.log(arr1);

    c310f53634ea2667189ea72270a93758.png

    10. indexOf()和lastIndexOf()

    查找一个数组(从首位开始查询)中是否存在某个值,若存在返回当前的下标(只能匹配第一次出现),否则返回-1

    参数1:要查找的某个值

    参数2:可选 传入指定的下标,指定从哪个位置开始查询

    lastIndexOf() 查找一个数组(从末尾开始倒着查询)中是否存在某个值(最后出现的值),若存在返回当前的下标(只能匹配第一次出现),否则返回-1

    参数1:要查找的某个值

    参数2:可选 传入指定的下标,指定从哪个位置之前查询

    let arr = ['a', 'b', 'c', 'd', 'b', 'e'];

    console.log(arr);

    console.log(arr.indexOf('b'));

    console.log(arr.indexOf('f'));

    console.log(arr.indexOf('d', 2));

    let arr1 = ['a', 'b', 'c', 'd', 'b', 'e'];

    console.log(arr1);

    console.log(arr1.lastIndexOf('b'));

    console.log(arr1.lastIndexOf('f'));

    console.log(arr1.lastIndexOf('d', 3)); // 这里就是从数组['a', 'b', 'c', 'd'] 查询是否有'd'

    c8a1e70c3f90b1ff69ab522ff563c533.png

    11. every()

    检测数组的每一项是否都符合条件,符合返回true,若有一项不符合则停止检测返回false

    参数:函数,有三个参数分别为,当前的项,当前项的下标,检测的数组

    注意:不用改变原数组

    let arr = [1, 2, 3, 4, 5];

    let arr1 = arr.every((item, x, y) => {

    console.log(item, x, y)

    return item >= 1

    })

    console.log(arr1);

    66e557853c65b47719634d55cc8f2437.png

    12. some()

    检测数组中是否存在符合指定的条件,若有符合条件的则停止检测返回true,否则false

    参数:函数, 有三个参数分别为,当前的项,当前项的下标,检测的数组

    注意:不用改变原数组

    let arr = [1, 2, 3, 4, 5];

    let arr2 = arr.some((x, y, z) => {

    console.log(x, y, z);

    return x > 2

    })

    console.log(arr2);

    42e8bf5269b13e1aa973e5dab74c110b.png

    13. filter()

    过滤

    检测数组,返回符合条件的内容, 没有符合的则返回空数组

    参数:函数, 有三个参数分别为,当前的项,当前项的下标,检测的数组

    注意:不用改变原数组

    let arr = [1, 2, 3, 4, 5];

    let arr1 = arr.filter((x, y, z) => {

    console.log(x, y, z);

    return x > 2

    })

    console.log(arr1);

    30460e3f7b0fa18baa3254ef89d47ce3.png

    14. map()

    映射

    Array.map((item, index) => {})

    返回一个新的数组, 新数组中的元素是原数组调用函数后处理过的值

    let arr = [1, 2, 3, 4, 5];

    let arr1 = arr.map((item, index) => {

    return item * index

    })

    console.log(arr1);

    f1fe73b6f0ac6c6126c4c990b6dcbf0c.png

    ES6 新增

    15. includes()

    检测数组是否存在某个值,存在为true,否则为false

    参数1:传入的指定值

    参数2:可选,表示搜索的起始位置,默认为0。若为负数,则从数组倒着查询

    注意:

    1. 如果传入的值为整数,其长度大于数组长度则返回false

    2. 如果传入的值为负数,其长度大于数组长度则重置从0开始查询

    let arr = ['x', 'b', 'a', 'c', 'd', 'e'];

    console.log(arr.includes('b'));

    console.log(arr.includes('z'));

    console.log(arr.includes('a', 1));

    console.log(arr.includes('a', 3));

    console.log(arr.includes('e', -2)); // 这里其实是从['d', 'e']中查询值'e'是否存在

    console.log(arr.includes('e', 10));

    2e0b18f6acbcdb9286da18e40ad706e9.png

    16. Array.of()

    将一组值转为数组

    如果没有传入参数则返回一个空数组[]

    其实Array.of()可以代替Array()和new Array() 去创建和声明一个新数组

    console.log(Array.of());

    console.log(Array.of('a'));

    console.log(Array.of(1, 'a', 3, 'ab'));

    console.log(Array.of(1, [1, 'a'], 3, 'ab'));

    console.log(Array.of(1, 2, 3, 4, 5));

    bc0265cc7084fec661033eebde260ca3.png

    17. fill()

    使用定值去填充一个数组,数组中的元素会被全部抹除

    fill() 还会接受参数二和参数三,可以指定填充的起始位置和结束位置(前包后不包)

    let arr = ['a', 'b', 'c'];

    console.log(arr.fill(1));

    let arr1 = ['a', 'b', 'c', 'd', 'e'];

    console.log(arr1.fill(2, 2, 4));

    80b34aef33440333c10d1f52ab149082.png

    18. copyWithin()

    将数组中指定的成员项,复制到其他位置(会覆盖原来的成员),返回新数组会改变原数组。

    参数1:指定从那个位置开始替换数据

    参数2:可选,默认从0开始复制。若传入则从指定位置为复制的数据,若为负数则从尾部数

    参数3:可选,默认复制到最后。若传入则从指定位置结果复制的数据,若为负数则从尾部数

    注意:改变原数组的方法有splice()和copyWithin()

    let arr = [1, 2, 3, 4, 5, 6];

    let arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

    let arr2 = [1, 2, 3, 4, 5, 6, 7, 8];

    let arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

    let arr4 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

    let arr5 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];

    console.log(arr.copyWithin(4));

    console.log(arr);

    console.log(arr1.copyWithin(2));

    console.log(arr1);

    console.log(arr2.copyWithin(3, 4));

    console.log(arr3.copyWithin(3, 4, 6));

    console.log(arr5.copyWithin(3, -7, -5));

    617120e6d464baa24bf1b2a4dc465b80.png

    19. find()和findIndex()

    find() 用来找出第一个符合条件的成员

    参数是一个回调函数,依次查询每一项,直到查询到第一个符合条件的成员,并返回该项的值,若不存在则返回undefined

    findIndex()

    返回的是符合条件的位置,而find()是返回符合条件的项,如果所有成员都不满足则返回-1

    注意:

    1. every() 查询每一项,如果每一项都符合条件就返回true,如果有一项不符合就停止,返回false

    2. some() 查询每一项,只要有一项符合条件就返回true,停止查询,否则返回false

    let arr = [1, 2, 3, 4, 5, 6];

    let arr1 = arr.find((item, index, arr) => {

    console.log(item, index, arr)

    return item > 3

    })

    console.log(arr1);

    let arr2 = [1, 2, 3, 1, 3, 5, 4, 5, 6];

    let arr3 = arr2.findIndex((item, index, arr) => {

    return item > 3

    })

    console.log(arr3);

    f08038c1f6b726a761bbe5a1934178dc.png

    20. entries(), keys()和values

    keys() 键名遍历

    values() 键值遍历

    entries() 键值对的遍历

    let arr = ['a', 'b', 'c', 'd', 'e'];

    for(let i of arr.values()){

    console.log(i)

    }

    for(let i of arr.keys()){

    console.log(i)

    }

    for(let i of arr.entries()){

    console.log(i)

    }

    for(let i of arr){

    console.log(i)

    }

    fe3617329b2b71c1b8132c1c785c6414.png

    展开全文
  • ES2015的循环:1 for(){}2 while3 arr....正常配合return,返回个新数组。如果没有 return 则相当于foreach平时使用map,一定要有return,可以 重新整理解构5 arr.filter()过滤循环,循环过滤...

    ES2015的循环:

    1 for(){}

    2 while

    3 arr. forEach(function(val, index, arr){})

    // 其实就是用来代替for循环

    4 arr.map()

    做数据交互映射。正常配合return,返回一个新数组。如果没有 return 则相当于foreach
    平时使用map,一定要有return,可以 重新整理解构

    5 arr.filter()

    过滤循环,循环过滤掉一些没用的元素。return 返回符合判断条件的元素

    6 arr.some()

    类似比对,查找的循环。如果有符合判断条件的元素返回true,没有则返回false

    7 arr. every()

    跟some不同的是,这个必须要所有元素都符合判断条件,才会返回true,可以做数组之间的对比 3,4,5,6,7循环的用法是一致的,也就是说回调函数里的参数一样。val =当前循环的值,index =当前循环值的下标,arr =循环体

    8 arr. reduce(function(prev, cur, index, arr){}) //prev 前一个元素 cur 后一个元素 index 当前元素下标 arr 当前数组

    用的很少,求和&阶乘啊可以用到(穿插个ES2017的运算符 幂 Math.pow(2,3))2的3次方

    44d4990b20bdccc13ee14d604f9ab50c.png

    9 arr. reduceRight()

    和reduce一样,只是顺序不一样。

    ES6 新增循环

    for ...of...

    bb3fd0dcd22192a8cd2fcb5bccd80423.png

    e18bf02e5e469688f03d5320b3143ae9.png

    这里说一下,用数组循环的话,利用到数组的新特性

    arr.keys() // 循环获取数组下标

    arr.entries() // 获取某一项

    展开全文
  • 创建数组通常创建数组有两种方式,分别为构造函数方式与数组字面量方式,而构造函数方式创建数组有个缺陷,当参数为个数值的时候,会把这个数值当做数组的长度,创建这个个长度为数值的字符串,其每个元素的值都...

    文章开始前先唠叨两句,最近工作实在太忙了,天天干到深夜,实在没时间来做知识分享,今天带来这篇JS中数组常用的方法,也是平时工作中的一些总结的方法吧,熟练使用会大大提高开发效率,我们一起来看看这些方法。

    创建数组

    通常创建数组有两种方式,分别为构造函数方式与数组字面量方式,而构造函数方式创建数组有个缺陷,当参数为一个数值的时候,会把这个数值当做数组的长度,创建这个一个长度为数值的字符串,其每个元素的值都为空,ES6的扩展方法中可以解决该问题,我放到下文来介绍。

    检测数组

    数组可以使用instanceof和Array.isArray()这两种方式去检测,用instanceof检测数组时,它的左边为被检测数组,右边为需要检测的类型,即Array;而Aarry.isArray()来检测数组时,该方法接收一个参数,这个参数就是被检测的数组。这两个方法返回的都是一个boolean类型的值,true为数组类型,false为非数组类型,来看看例子:

    // 1.instanceof
    

    转换方法

    1. toString():该方法会返回数组中每个值的字符串形式以逗号隔开组成的字符串。
    2. valueOf():该方法返回数组本身
    3. toLocaleString():该方法返回一个数值以逗号隔开的字符串
    4. join():join方法是把数组转为字符串,其接收一个参数,这个参数即数组值之间的分隔符,如果参数为undefined或者不传,则默认逗号分隔。

    上面三个数组转字符串的方法均有个共同点,当数组中某一项为null或则undefined时,则这一项都以空字符的方式被转出。来看看下面的例子:

    // 1.toString()
    

    打印结果如下:

    a3b1a8009ed7a8a27efd1e2867c51ad9.png

    栈与队列

    1. push():push()方法是向数组的末尾添加项,只需把需要添加的项传入其参数中,就会添加到数组末尾,并返回数组的长度。
    2. pop():pop()方法用以移除数组末尾的项,并返回移除项的值。
    3. unshift():unshift()方法是向数组的首部添加项,与push()相似,同样把需添加的项传入参数,并返回数组的长度。
    4. shift():shift()方法与pop()类似,它是用以移除数组的首项,返回移除项的值。

    来看看下面的例子:

    // 1.push()
    

    打印结果如下:

    5d8eae025262375869f422c9be19189a.png

    观察打印结果,每一条数据的左边为方法的返回值,右边为原数组,这些方法都会改变原数组,所以在使用的时候一定要注意。

    数组操作

    1. concat():该方法用以合并数组,把需要合并的数组以参数传入,返回合并后的新数组,不改变原数组,来看例子:
    var 


    2. slice():该方法用以提取数组中的指定位置元素并将这些提取出的原数组成新数组返回,不改变原数组。看下面的例子:

    var 

    从这个例子看出,slice()接收一个参数时,表示从下标为该参数值开始一直到数组末尾的所有项都提取出来;而接收两个参数时,表示从下标为参数1的值开始一直到下标为参数2的值的前一项的所有项都提取出来。总的来说就是提取数组项时会包括开始位置,但不包括结束位置。

    3. splice():splice()方法我个人认为是数组中最强大的一个方法,它可以做到插入、删除以及替换数组中的项,来分别看看这三种操作如何实现。

    删除:splice()方法用以删除项时,其接收两个参数,第一个参数是删除的开始位置,第二个参数是要删除的个数,删除后会返回被删除的项组成的数组,且会改变原数组,请看下面这段代码:

    var 

    上面代码中,通过splice()方法删除数组a中的位置0开始的两个项,并返回了这两个项组成的新数组,且原数组发生了改变。

    插入:splice()方法用以插入时接至少接收3个参数,其中第一个参数为插入开始位置,第二个参数固定值为0,表示仅插入,第三个参数或后面的参数,即为需要插入的项,来看代码:

    var 

    上面例子中,依次在数组的下标4的位置添加了2个项,返回了空数组,空数组表示原数组中没有被替换或删除的项。插入操作也会改变原数组。

    替换:splice()方法用以替换时与用以插入时相似,唯一不同的就是第二个参数不能为0,此时第二个参数表示被替换项的个数,将上一个例子稍作修改:

    console

    此时splice()方法返回了一个数组,仔细看,这个数组的两个项都是原数组中下标为4与5的项,那么得出结论,此时的第二个参数就为替换的个数。

    位置查找

    1. indexOf():indexOf()方法用以找出数值中第一个匹配项的下标位置并返回,如果整个数组中都没有找到匹配项,则返回-1
    2. lastIndexOf():该方法与indexOf()方法的查询方向相反,它是从数组末尾向首部遍历查询,如果查找到第一项,就返回其下标位置,如果一直没找到则返回-1

    这两个方法还可以接收第二个参数,表示查询的起始位置,如果存在第二个参数,就会从该位置一直找到最后,当找到第一个匹配的时候停止。来看例子:

    // 1.indexOf()
    

    上面例子中分别输出4与-1,indexOf()方法中是从下标2的位置开始向末尾查找,找到下标为4的时候发现了第一个匹配项,返回该下标;而lastIndexOf()中是从下标为1的位置向首部查找,未查找到匹配项,返回-1。

    迭代方法

    迭代方法,说白了就是数组的遍历方法,而这些方法都有自己在遍历之后对数据的处理方式,下面来分别介绍这些方法。

    1. every():every()方法需数组项中每一项都满足指定条件才能返回true;
    2. filter():filter()方法用于过滤出数组中满足条件的项,并组成新的数组返回;
    3. forEach():forEach()是我个人比较喜欢用来遍历数组的方法,它遍历了数组之后,不会返回任何值;
    4. map():map()和forEach有些类似,但是map会返回参数函数操作后的结果组成的数组;
    5. some():some()方法只要数组项中有一个满足指定条件,就会返回true。

    来看看以下例子:

    // 1.every()
    

    打印结果如下:

    fc23a71c16891ceb5e071b9a3031def2.png

    归并方法

    1. reduce():reduce()方法接收1个参数函数,改参数函数又接收4个参数,第一个参数为上一次归并的值,第二个参数为当前值,第三个参数为当前下标,第四个参数为该数组本身。
    2. reduceRight():该方法与reduce的主要作用一样,其区别在于执行方向相反,reduceRight()是从右向左,而reduce()是从左向右。来看看下面这个例子:
    // reduce
    

    ok,以上E5及以前的数组方法就介绍这么多,接下来看看ES6中数组的一些常用扩展方法。

    数组扩展

    数组的扩展方法主要是ES6中的几个扩展方法,下面来分别看看这些方法。

    1. 扩展运算符:扩展运算符用3个点(…)表示,将一个数组转为用逗号分隔的参数序列,它的后面还可以放置表达式,如果扩展运算符后面是一个空数组,则没有任何值。

    扩展运算符有很多应用场景,下面来说说几个常用场景。

    合并数组:在ES5中,合并数组可以采用concat()方法,这个方法我在上面也进行了介绍,而如果用扩展运算符来合并数组的话,在写法上会更加灵活。

    解构赋值:解构赋值结合扩展运算符,是实际开发中经常用到的,用起来也是爽得飞起的。

    字符串转数组:将一个连续的字符串直接转为数组,字符串的每个字符对应数组中的项。

    作为函数返回值:在ES5及其之前,函数的返回值只能一个,如果想要返回多个值,则要把这些值保存在数组或则对象中来返回,而这里采用扩展运算符时,则可以一次性返回多个值

    下面来看一个例子:

    function 

    例子中我定义了一个函数,在函数中把这些场景都实现一遍,来看看打印结果:

    48a6a219ff193737748ebedee9b48eb5.png

    先看第一次打印,打印出了变量index和数组arg,正确的体现了解构赋值的特性,没问题;第二次打印了将变量index与数组arg合并后的的值,也就是原参数数组,没问题;第三次打印,将字符串str拆分为数组再与数组arg合并,并返回到外部作用域打印出来,结果没问题。

    2. Array.from():Array.from()方法用以将数组型对象转换为真正的数组,数组型对象的键名是从0开始递增的数值,且拥有length属性,length属性表示长度。Array.from()可接收两个参数,第一个参数为需要转换的对象,第二个参数为函数,这个函数中可以对被转换对象的每个属性进行操作,我们来看这个例子:

    var 

    这个例子通过Array.from()方法把对象的每一个属性值加了一个@字符之后,再返回了一个真正的数组。

    3. Array.of():Array.of()方法用以弥补Array()构造函数创建数组时的缺陷。当Array()构造函数创建数组时,参数传递单个数值时,它会创建长度为参数数值的每一项为空的数组,而Array.of()则解决了这个问题,它是将这个数值作为项创建一个数组,来看这段代码:

    var 

    这里打印结果中的empty *3表示3个连续的空项。

    4. find()与findIndex()

    这两个方法都是找出数组中的匹配项,它们都接收一个函数参数,该函数中可以自定义匹配条件,找出第一个匹配的项就返回。而它们的区别就在于返回值,find()方法返回的是匹配项的值,如果没找到就返回undefined,而findIndex()方法返回的是匹配项的下标,如果没找到就返回-1,是不是和indexOf()方法很像,来个例子:

    var 

    数组中存在两个相同值而位置不同的项,但是只找出了最近的那个,结果没问题

    5. fill()

    fill有填充的意思,在这里的fill()方法也正是这个意思,它可以向数组中填充自定义元素,它接收3个参数,第一个参数需要填充的项值,第二个参数为填充的起始位置,第3个参数为填充结束的后一个位置,也就是该位置的前一个位置就是结束位置,来段简单的代码:

    var 

    这段代码的意思是将“JS”这项填充到数组a的下标3的位置。

    6. entries()、keys()以及values()

    这三个方法是ES6中扩展的数组迭代方法,entries()是对键值对遍历,keys()是对键名遍历,而values()是对键值遍历。来看下面这个例子:

    for 

    我们直接看结果:

    43e32498d9292433185169e2c8aa1dd9.png

    以上打印结果从左到右依次为entries ()、values()和keys()方法的遍历结果,entries()方法的结果为键值对,values()的结果为每项的值,而keys()方法的结果为每项的键名,结果没问题。

    以上就是我今天分享给大家的常用的数组方法,平时比较少使用的我就没有写出来了,这篇文章没有过多的引导,可能看起来没有什么乐趣,望理解~~~

    展开全文
  • es6删除数组某一项

    千次阅读 2018-08-17 15:41:27
    先找到数组是否存在,再splice list.splice(list.findIndex(v => v.id === id), 1)
  • .Set它类似于数组,但是其成员的值都是唯一的,没有重复的值(甚至在Set内部,NaN和NaN是相等的)它在初始化的时候接受数组或者类数组作为参数,数组里的值将会做为set的成员:var 初始化之后我们就得到了个...
  • 在日常工作中我们经常会与数组打交道,因此需要熟练掌握数组操作的相关方法,ES6中关于数组的操作,又给我们带来了哪些惊喜呢,Array数组操作又添加了哪些新方法?本篇文章将从以下几个方面进行介绍:Array.from()...
  • 本篇文章主要讲述ES5中的数组,包括数组两种创建方式,属性,以及9大类,总共23个操作方法,非常全面,看完之后ES5数组部分基本都了解了,下篇文章,我会讲述ES6中对数组的加成,新增了哪些方法,以及定型数组...
  • 往期回顾「JavaScript 从入门到精通」1.语法和数据类型「JavaScript 从入门到精通」2.流程控制和错误处理「JavaScript 从入门到精通」3.循环和迭代「JavaScript 从入门到精通」4.函数「JavaScript 从入门到精通」5....
  • 现在老K为大家总结一下ES6数组的新方法。map方法:可以简单的理解为映射var arr = [1,2,3,4]console.log( arr.map((n)=>n*n) ); //[1,4,9,16]console.log( arr.map((n)=>n-1) );//[0,1,2,3]filter方法:var ...
  • 关于Set它类似于数组,但是其成员的值都是唯一的,没有重复的值(甚至在Set内部,NaN和NaN是相等的)它在初始化的时候接受数组或者类数组作为参数,数组里的值将会做为set的成员:初始化之后我们就得到了个set,...
  • 这是从数组中筛选出重复并仅返回唯一值的三种方法。我最喜欢使用Set,因为它最短,最简单;set Set是ES6中引入的新数据对象。因为Set仅允许您存储唯一值。传递数组时,它将删除所有重复值。这个和java基本一样让...
  • 、理解根据当前数组产生个去除重复元素后的新数组如: [6,9,8,7,2,5,6,5,4,5,6,4,5] ==> [6,9,8,7,2,5,4]二、实现代码1. forEach()和indexOf() 说明: 本质是双重遍历, 效率差些/* 2. 利用forEach() + 对象容器...
  • 在开发过程中,我们时常会遇到这样种情况:当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更新视图的。根据官方文档定义:如果在...
  • JavaScript 发展至今已经发展...各种数组遍历的方法for语句这是标准for循环的写法也是最传统的语句,字符串也支持,定义个变量i作为索引,以跟踪访问的位置,len是数组的长度,条件就是i不能超过len。forEach语句...
  • 数组删除重复个简便方法,就是将它转化为集合后再重新转化成数组。 const cards = [ 'Machop', 'Diglett', 'Charmeleon', 'Machop', 'Squirtle' ] const uniqueCards = [...new Set(cards)] console.log...
  • es6新增了Set、Map、WeekSet、WeekMap 四种数据结构。C#中有HashSet和Dictionary,HashSet和Dictionary都是范式集合,但是es6不支持接口开发,所以也就不存在范式。Set 是存唯一值的集合,Map是存键值对的集合。...
  • 1.ES5中新增的数组扩展方法//会改变原数组 push()和pop() shift() 和 unshift() sort() reverse() splice() //不会改变原数组 concat() slice() join() indexOf()和 lastIndexOf() (ES5新增) forEach() (ES5新增...
  • Javascript学习之数组(Array)方法论(二),不改变原数组的方法####不改变原数组的方法```ES5:arr.slice()//从某个已有的数组返回选定的元素arr.join()//把数组的所有元素放入个字符串,元素通过指定的分隔符进行...
  • 问题:vue更新数组时触发视图更新的方法变异方法:Vue 包含组观察...这些方法如下:push() 数组尾部添加pop() 数组尾部删除shift() 数组头部删除unshift() 数组头部添加splice() 数组万能增删sort() 数组排序rev...
  • 引子:这些日子在看es相关的新属性是有数组的方法 flat() 引起的我的注意。1 什么是扁平化?我去找了一下维基百科,上面并没有关于扁平化的直接解释,只有个扁平化组织释义。先来说一下,与扁平化对立的组织:...
  • JS里的"数组"不是数组,而是对象js里的数组和其他语言中的数组是不同的,实际它并不是数组,而是种array-like 特性的对象。它只是把索引转化成字符串,用作其属性(键)。例如:var 这也正是为什么 typeof arr = ...
  • ES6可以说是个泛指,指5.1版本以后的JavaScript的下一代标准,涵盖了ES2015,ES2016,ES2017等;亦指下一代JavaScript语言。背景嗯~ES6的语法有什么好谈的,无聊了吧?确实,语法糖的东西真的是学起来如嚼蜡 -- 淡...
  • 行代码扁平化n维数组数组去重、求数组最大值、数组求和、排序、对象和数组的转化等;上面这些应用场景你可以用行代码实现?1.扁平化n维数组1.终极篇[1,[2,3]].flat(2) //[1,2,3][1,[2,3,[4,5]].flat(3) //[1...
  • (给前端大全加星标,提升前端技能)作者:火狼https://segmentfault.com/a/1190000018549643前言本文主要从应用来讲数组api的一些骚操作,如行代码扁平化n维数组数组去重、求数组最大值、数组求和、排序、对象和...
  • 参考文章:面试官连环追问:数组拍平(扁平化) flat 方法实现编者荐语:在前端面试中,手写flat是非常基础的面试题,通常出现在笔试或者第轮面试中,主要考察面试者基本的手写代码能力和JavaScript的基本功。...
  • 在 JavaScript 中,数组个用于存储不同数据类型的变量。它将不同的元素存储在个盒子中,供以后使用。声明数组:let myBox = []; // JS中的初始化数组声明数组中可以包含多种数据类型let myBox = ['hello',...
  • 本篇文章给大家带来的内容是关于es6删除数组元素或者对象元素的方法介绍(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。,删除数组元素let arr = [{name:'黎明',id:21111},{name:'王小二...
  • es6 删除数组指定元素

    万次阅读 多人点赞 2018-12-14 14:46:14
    arr.splice(arr.findIndex(item => item.id === id), 1) //item 只是参数可以写成 i 或者 v 都可以 , ...//=== 后面的id是你想要删除的元素的id号,同理,如果你数组里面写的是num,那这里...
  • 数组删除重复个简便方法,就是将它转化为集合后再重新转化成数组。 const cards = [ 'Machop', 'Diglett', 'Charmeleon', 'Machop', 'Squirtle' ] const uniqueCards = [...new Set(cards)] console.log...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 12,145
精华内容 4,858
关键字:

es6删除数组某一项