es6学习笔记数组(中)

Posted 爱喝酸奶的吃货

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了es6学习笔记数组(中)相关的知识,希望对你有一定的参考价值。

接着上一篇,给大家再分享一些数组的其他方法.大家也可以去点击这里学习数组更多的方法

concat方法:

概述:    concat() 方法将传入的数组或非数组值与原数组合并,组成一个新的数组并返回.

参数:

           valueN:需要与原数组合并的数组或非数组值。

描述:

concat 方法将创建一个新的数组,然后将调用它的对象(this 指向的对象)中的元素以及所有参数中的数组类型的参数中的元素以及非数组类型的参数本身按照顺序放入这个新数组,并返回该数组.

concat方法并不修改调用它的对象(this 指向的对象) 和参数中的各个数组本身的值,而是将他们的每个元素拷贝一份放在组合成的新数组中.原数组中的元素有两种被拷贝的方式:

  • 对象引用(非对象直接量):concat 方法会复制对象引用放到组合的新数组里,原数组和新数组中的对象引用都指向同一个实际的对象,所以,当实际的对象被修改时,两个数组也同时会被修改.
  • 字符串和数字(是原始值,而不是包装原始值的 String 和Number 对象): concat 方法会复制字符串和数字的值放到新数组里.

示例:

      var num1 = [1, 2, 3];
      var num2 = [4, 5, 6];
      var num3 = [7, 8, 9];
      console.log(num1.concat(num2, num3));//组成新数组[1, 2, 3, 4, 5, 6, 7, 8, 9]; 原数组 num1, num2, num3 未被修改
      console.log(num1);//[1, 2, 3]
      console.log(num2);//[4, 5, 6]
      console.log(num3);//[7, 8, 9]
      console.log(num1.concat(null, [1,‘a‘,‘b‘,,‘f‘])+‘concat方法‘);//1,2,3,,1,a,b,,fconcat方法

通过以上代码,大家会发现concat不会改变调用该方法的数组,并且会被没有值的索引调用.

splice()方法:

概述:    splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。

参数:

          start?:从数组的哪一位开始修改内容。如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位

          deleteCount:整数,表示要移除的数组元素的个数。如果 deleteCount 是 0,则不移除元素。这种情况下,至少应添加一个新元素。如果 deleteCount大于start 之后的元素的总数,则从 start 后面的元素都将被删除(含第 start 位)。

    itemN:要添加进数组的元素。如果不指定,则 splice() 只删除数组元素。

描述:

如果添加进数组的元素个数不等于被删除的元素个数,数组的长度会发生相应的改变。

示例:

示例1:

      var num1 = [1, 2, 3];
      var num2 = [4, 5, 6];
      var num3 = [7,,9,10,11];
      console.log(num1.splice(1,0,‘4‘));//[]
      console.log(num1);//[1, "4", 2, 3]
      console.log(num2.splice(1,1,‘y‘));//[5]
      console.log(num2);//[4, "y", 6]
      console.log(num3.splice(1,0,8));//[]
      console.log(num3);//[7, 8, 3: 9, 4: 10, 5: 11]

示例2:

      var num1 = [1, 2, 3];
      var num2 = [4, 5, 6];
      var num3 = [7,,9,10,11];
      console.log(num1.splice(-1,0,‘4‘));//[]
      console.log(num1);//[1, 2, "4", 3]
      console.log(num2.splice(-1,1,‘y‘));//[5]
      console.log(num2);//[4, "y", 6]
      console.log(num3.splice(-1,0,8));//[]
      console.log(num3);//[7, 8, 3: 9, 4: 10, 5: 11]

unshift方法:

概述:    unshift() 方法在数组的开头添加一个或者多个元素,并返回数组新的 length 值。

参数:

           element1, ..., elementN:要添加到数组开头的元素。

描述:

unshift 方法会在调用它的类数组(array-like)对象的开始位置插入给定的参数。

示例:

      var num1 = [1, 2, 3];
      var num2 = [4, 5, 6];
      console.log(num1.unshift(1,‘4‘));//5
      console.log(num1);//[1, "4", 1, 2, 3]
      console.log(num2.unshift(1,1,‘4‘));//6
      console.log(num2);//[1, 1, "4", 4, 5, 6]

copyWithin方法:

概述:    copyWithin() 方法会浅拷贝数组的部分元素到同一数组的不同位置,且不改变数组的大小,返回该数组。

参数:

           target:0 为基底的索引,复制序列到该位置。如果是负数,target 将从末尾开始计算。如果 target 大于等于 arr.length,将会不发生拷贝。如果 target 在 start 之后,复制的序列将被修改以符合 arr.length

    start:0 为基底的索引,开始复制元素的起始位置。如果是负数,start 将从末尾开始计算。如果 start 被忽略,copyWithin 将会从0开始复制。

          end:0 为基底的索引,开始复制元素的结束位置。copyWithin 将会拷贝到该位置,但不包括 end 这个位置的元素。如果是负数, end 将从末尾开始计算。如果 end 被忽略,copyWithin 将会复制到 arr.length

描述:

参数target,start和end 必须为整数。

如果start为负,则其指定的索引位置等同于length+start,length为数组的长度。end也是如此。

copyWithin方法不要求其this值必须是一个数组对象;除此之外,copyWithin是一个可变方法,它可以改变this对象本身,并且返回它,而不仅仅是它的拷贝。

copyWithin 就像 C 和 C++ 的 memcpy 函数一样,且它是用来移动 Array 或者 TypedArray 数据的一个高性能的方法。复制以及粘贴序列这两者是为一体的操作;即使复制和粘贴区域重叠,粘贴的序列也会有拷贝来的值。

copyWithin 函数是设计为通用的,其不要求其 this 值必须是一个数组对象。

The copyWithin 是一个可变方法,它不会改变 this 的 length,但是会改变 this 本身的内容,且需要时会创建新的属性。

示例:

      console.log([‘a‘,‘b‘,‘d‘,‘f‘].copyWithin(-1));//["a", "b", "d", "a"]
      console.log([‘a‘,‘b‘,‘d‘,‘f‘].copyWithin(-2));//["a", "b", "a", "b"]
      console.log([‘a‘,‘b‘,‘d‘,‘f‘].copyWithin(-3));//["a", "a", "b", "d"]
      console.log(‘俩参数‘);
      console.log([‘a‘,‘b‘,‘d‘,‘f‘,‘g‘].copyWithin(0,-1));//["g", "b", "d", "f", "g"]
      console.log([‘a‘,‘b‘,‘d‘,‘f‘,‘g‘].copyWithin(0,-2,-1));//["f", "b", "d", "f", "g"]
      console.log([‘a‘,‘b‘,‘d‘,‘f‘,‘g‘].copyWithin(0,-3,-1));//["d", "f", "d", "f", "g"]
      console.log([‘a‘,‘b‘,‘d‘,‘f‘,‘g‘,‘e‘].copyWithin(0,-5,-1));//["b", "d", "f", "g", "g", "e"]
      //总结每当copy后的数组大于本数组的长度时,该数组的值=copy-1,原数据删除中间多余的
      //例如  [‘a‘,‘b‘,‘d‘,‘f‘,‘g‘,‘e‘].copyWithin(0,-5,-1)   执行本应是(-5,-1) :b,d,f,g,e,原来的数:b,d,f,g,e
      //由于超出原来数组的长度,所以删除一部分则  删除  b,d,f,g,e  中的 e,则为 b,d,f,g   ,b,d,f,g,e,还多再删除 b,d,f,
      //所以最终结果为:b,d,f,g,g,e
      console.log(‘参数为正整数‘);
      console.log([‘a‘,‘b‘,‘d‘,‘f‘,‘g‘,‘e‘].copyWithin(1,1,3));//["a", "b", "d", "f", "g", "e"]
      console.log([‘a‘,‘b‘,‘d‘,‘f‘,‘g‘,‘e‘].copyWithin(2,1,5));//["a", "b", "b", "d", "f", "g"]
      console.log([‘a‘,‘b‘,‘d‘,‘f‘,‘g‘,‘e‘].copyWithin(2,1,5));//["a", "b", "b", "d", "f", "g"]
      console.log(‘哈哈哈222‘);
      console.log([‘a‘,‘b‘,‘d‘,‘f‘].copyWithin(1,-1,-3));//["a", "b", "d", "f"]

pop方法:

概述:   pop() 方法删除一个数组中的最后的一个元素,并且返回这个元素。

描述:

pop 方法删除一个数组中的最后一个元素,并且把这个删除掉的元素返回给调用者。

pop 被有意设计成具有通用性,该方法可以通过 call 或 apply 方法应用于一个类数组(array-like)对象上。

示例:

      var num1 = [1, 2, 3];
      console.log(num1.pop());//3
      console.log(num1);//[1, 2]

shift方法:

概述:   shift() 方法删除数组的 第一个 元素,并返回这个元素。该方法会改变数组的长度。

描述:

shift 方法移除索引为 0 的元素(即第一个元素),并返回被移除的元素,其他元素的索引值随之减 1。如果length 属性的值为 0 (长度为 0),则返回 undefined

shift 方法并不局限于数组:该方法亦可通过 call 或 apply 作用于对象上。对于不包含 length 属性的对象,将添加一个值为 0 的 length 属性。

示例:

      var num1 = [1, 2, 3];
      console.log(num1.shift());//1
      console.log(num1);//[2, 3]

push方法:

概述:   push() 方法添加一个或多个元素到数组的末尾,并返回数组新的长度(length 属性值)。

描述:

elementN:被添加到数组末尾的元素。

示例:

示例1:

      var num1 = [1, 2, 3];
      var num2 = [4, 5, 6];
      var num3 = [7, 8, 9,,11];
      console.log(num1.push(num2));//4
      console.log(num1+‘push方法‘);//1,2,3,4,5,6push方法
      console.log(num2);//[4, 5, 6]
      console.log(num2.push(num3));//4
      console.log(num2+‘push方法‘);//4,5,6,7,8,9,,11push方法
      console.log(num3);//[7, 8, 9, 4: 11]

示例2:

      var num1 = [1, 2, 3];
      var num2 = [4, 5, 6];
      var num3 = [7, 8, 9,,11];
      console.log(num3.push(num2));//6
      console.log(num3+‘push方法‘);//7,8,9,,11,4,5,6push方法

 

以上是关于es6学习笔记数组(中)的主要内容,如果未能解决你的问题,请参考以下文章

学习笔记—前端基础之ES6的数组

Es6 学习笔记数组扩展

ES6学习笔记之数组的解构赋值

ES6学习笔记之数组的解构赋值

ES6-个人学习笔记二--解构赋值

ES6学习笔记之数组扩展