数组练习

没有格式的代码就用div表示了

aButton[0].onclick = function () {
        var btnName = this.innerHTML;
        if (btnName.indexOf('删除') != -1) {
            var text = aPre[0].innerText.split(',');
            item = text.shift();
            aPre[0].innerText = text;
            this.innerText = '添加January(1)'
        } else {
            var text = aPre[0].innerText.split(',');
            text.unshift(item);
            aPre[0].innerText = text;
            this.innerText = '删除January(1)'
        }

    }
  • indexOf()检测字符串索引, 如果不存在, 返回-1
  • split()将字符串按split的参数分隔为数组
  • shift()从数组前端取得项的方法, 移除数组中第一个项并返回该项,同时数组长度减一
  • unshift()在数组前端添加任意个项并返回新数组的长度
    删除December(12) 同理

复制还原

aButton[2].onclick = function () {
        var text = aPre[1].innerText;
        aPre[1].innerText = aPre[1].innerText + ',' + text;
    };
    aButton[3].onclick = function () {
        aPre[1].innerText = aPre[1].innerText.slice(0, 19);
    };
  • slice() 接收一或两个参数, 即返回想的起始和结束位置, 只有一个参数的情况下, slice()方法返回从该参数指定位置开始到当前数组末尾的所有项,如果两个参数, 返回起始和结束位置之间的项,但不包括结束位置的项, slice()方法不会影响原数组,如果结束位置小于起始位置, 则返回空数组

删除,插入,替换

aButton[5].onclick = function () {
      arr = aPre[2].innerText.split(',');
      arr.splice(0,3);
      console.log(arr);
      aPre[2].innerText = arr;
    };
    aButton[6].onclick = function () {
        arr = aPre[2].innerText.split(',');
        arr.splice(1,2);
        aPre[2].innerText = arr;
    };
    aButton[7].onclick = function () {
        arr = aPre[2].innerText.split(',');
        arr.splice(2,0,['orange', 'purple']);
        aPre[2].innerText = arr;
    };
    aButton[8].onclick = function () {
        arr = aPre[2].innerText.split(',');
        var ar3 = arr.splice(2,1);
        var ar2 = arr.splice(1,1);
        arr.splice(1, 0, ar3);
        arr.splice(2, 0, ar2);
        aPre[2].innerText = arr;
    };
  • splice()
    splice方法始终返回一个数组, 该数组包含从原始数组中删除的项, 会改变原数组
    • 删除: 可删除任意数量的项, 指定两个参数, 要删除的第一项的位置和要删除的项数
    • 插入: 可向指定位置插入任意数量的项, 3个参数: 起始位置, 0(要删除的项数), 要插入的项
    • 替换: 可向指定位置插入任意数量的项,同时删除任意数量的项, 3个参数: 起始位置, 要删除的项数, 要插入的任意数量的项
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,281评论 0 4
  •   引用类型的值(对象)是引用类型的一个实例。   在 ECMAscript 中,引用类型是一种数据结构,用于将数...
    霜天晓阅读 1,141评论 0 1
  • 由于最近都在freecodecamp上刷代码,运用了很多JavaScript数组的方法,因此做了一份关于JavaS...
    2bc5f46e925b阅读 2,055评论 0 16
  • 数组是值的有序集合。每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引。 JavaScript...
    劼哥stone阅读 1,168评论 6 20
  • 昨天被人突然拉进一个微信群,这个群还挺大,有300多人。但是我完全不知道这个群是干嘛的,因为从群里的聊天来看,做什...
    元兵阅读 282评论 0 0