• 技术文章 >web前端 >前端问答

    es6怎么删除数组中的某一项

    青灯夜游青灯夜游2023-01-16 16:40:49原创99

    删除方法:1、用splice()根据下标删除任意一个元素,语法“arr.splice(index,1)”;2、用delete关键字根据下标删除任意一个元素,语法“delete arr[index];”;3、用shift()删除第一个元素,语法“数组.shift()”;4、用pop()删除最后一个元素,语法“数组.pop()”;5、用length删除最后一个元素。

    本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

    在es6中,想要删除数组中的任意一项(一个元素),可以利用数组的splice()方法或delete关键字。

    方法1、splice:删除后,后面的元素自动填补到前面

    arr.splice(index, 1) 

    举例:现在有数组 arr=['a','b','c','d']

    arr.splice(1, 1); //结果arr=['a','c','d'](下标1开始,删除1个)

    注意:

    上面的代码中,我们要注意,如果想修改 arr 的值,直接这样操作 arr 直接就变了,而不要写作 arr= arr.splice(1,1),因为 splice() 方法的返回值为删除掉的元素。

    补充:

    arr.splice(1,0,'str'); //结果arr=['a','str','b','c','d']
    arr.splice(1,1,'str'); //结果arr=['a','str','c','d']
    arr.splice(1,2,'str'); //结果arr=['a','str','d'](就是说:下标1开始2个换成1个“str”)
    arr.splice(1,2); //结果arr=['a','d']

    方法2、delete:删除后,该下标位置元素为undefined

    delete arr[index];

    例:

    delete arr[1];

    1.png

    空位元素可以读写,length 属性不排斥空位,空元素位返回值为 undefined

    console.log(arr[1]);

    2.png

    而如果只是想要删除第一个或最后一个元素,也可以利用shift()、pop()、length方法。

    方法3:使用shift()函数删除第一个数组元素

    array.shift()函数可以把数组的第一个元素从其中删除,并返回第一个元素的值;然后将余下所有元素前移 1 位,以填补数组头部的空缺。

    var a = [1,2,3,4,5,6,7,8];  //定义数组
    a.shift();
    console.log(a);

    输出结果为:

    1.png

    注:shift()方法会改变原数组,修改数组的长度!

    方法4:使用pop()删除最后一个数组元素

    array.pop()方法可以删除数组 array 中最后一个元素,并返回被删除的元素。

    var a = [1,2,3,4,5,6,7,8];  //定义数组
    a.pop();
    console.log(a)

    输出结果为:

    2.png

    注:pop()方法也会改变原数组,修改数组的长度!

    方法5:利用length属性删除最后一个数组元素

    数组的length属性一般是用来设置或返回数组中元素的数目,即设置或返回数组长度。

    我们可以利用设置数组长度的特性,将length属性的设置的比原长度小,即可从数组尾部删除一个或多个元素;如果值设置为0,就会删除全部数组,即清空数组!

    语法:数组对象.length=原数组长度-1;

    示例:

    var a = [1,2,3,4,5,6,7,8];  //定义数组
    console.log(a)
    a.length=7;
    console.log(a)

    3.png

    【推荐学习:javascript高级教程

    以上就是es6怎么删除数组中的某一项的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:ES6 es6数组
    上一篇:vue插槽解决什么问题 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • es6中includes返回的是什么• es6 map是引用类型吗• es6箭头函数是函数式编程吗• es6的set集合怎么增加元素• es6怎么声明只读常量• vue中用到es6特性有哪些• es6中let怎么用
    1/1

    PHP中文网