Array类型及其常用的方法

  Array类型可以说算是 js 中最常用的类型了,在ECMScript中的数组和其他类型语言中的数组有着很大的区别。ECMScript中的数组的每一项可以保存任何类型的数据,也就是数组的第一项可以是字符串,第二项可以是数字。而且ECMScript中的数组是可以进行动态调整的,可以随着数据的增加自动调整数组的大小来容纳新的数据。

  创建数组的基本方式

  1. var names = new Array(); 如果事先知道数组要保存的数量,也可以使  var names = new Array(20); 来创建一个长度20的数组。

  2.  var names = Array(3); Array的构造函数也可以省略new,但是需要注意的是想 Ayyay() 中传递的是数值,则会按照这个数值长度进行创建对应长度的数组,如果传递的是其他类型参数,则会创建一个只包含这个值的数组。

     如:var names = Array('LiHua') ; // 创建一个字符串 ['LiHua'] 数组。

  3. var namse = []; 直接使用数字字面量表示,多个元素之间用 ,进行分隔。 例如 var names = [1,2]会创建一个两项的数组,var names = [,,,,,]这样会创建一个包含6或7项的数组,一版不要这样去写,在不同的浏览器中可以会创建不同的项数,在元素的结束后不需要在跟, 。

  数组的length属性

    比较有特点,他不是一个只读的属性,可以通过设置这个属性,可以从数组的末尾移除属性,或者向数组中新增项

    如:var colors = ['ble', 'green', 'red']; colors.length = 2; console.log(colors[2]) // undefined

  数组的检测方法

  1. if(value instanceof Array)

    instanceof 用于检测一个对象是不是某个类的实例,数组也是一种对象所以也可以利用 instaceof 来进行判断。

    instanceof操作符的问题在于,它假定只有一个全局执行环境。如果在网页中包含多个框架,那么实际上就存在两个以上不同的全局执行环境,从而构造两个不同版本的 Array 构造函数。如果你从一个框架向另外一个框架传入一个数组,那么传入的数组和第二个框架中原生创建的数组分别具有各自不同的构造函数。

  2. Array.isArray(value)

    ES5 新增的方法,也是比较常用的判断数组的方法,不管它是哪个全局环境中创建的。

  3. constructor处理

    if(value.constructor === Array) 因数组中可以通过new Array的方式进行创建,因此也可以通过value.constructor来获取他的构造函数判断是不是数组,但是此方法和 1 有同样问题

  4. Object.prototype.toString.call()

    if(Object.prototype.toString.call(arr) === "[object Array]")), 任何一个值调用原型上的toString()方法都会返回一个[object NativeConstrctorName]格式的字符串,由于原生数组的构造函数名和作用域无关,因此使用toString()方法就能保证输出一样的值。Array的tostring()方法被重写了(很多原生对象均如此),所以它会调用自己构造函数上的toString()方法,返回其他的字符串。

  转换方法

   所有的对象都具有 toLocaleString() 、 toString() 和 valueOf() 方法,调用数组的toString 放啊,会返回由数组每个值的字符串形式,中间用 , 隔开的字符串,而valueOf 返回的还是数组

var names = ['xiao', 'ming', 'hong']

alert(names.toString()) // 'xiao', 'ming', 'hong'
alert(names.valueOf()) //'xiao', 'ming', 'hong'
alert(names)// 'xiao', 'ming', 'hong'

  这里我们显式的调用了 toString() 方法,返回的是拼接的字符串,调用 valueOf() 方法,是直接将数组传给了alert(). 由于alert会在后台调用toString()方法,所以会得到相同的结果。

在控制台则可以明显看出效果

 

   toLocaleString() 方法也经常返回与toString() valueOf()方法 返回相同的值,但不总是如此,当调用toLocaleString() 方法的时候,它会创建一个数组值的 以,分割的字符串。与之不同的是 它是取得每一项的值,调用的每一项的 toLocaleString() 方法。

var person1 = {
  toLocaleString: function() {
    return 'ming'
  },
  toString: function() {
    return 'hei'
  }
}
var person2 = {
  toLocaleString: function() {
    return 'Li'
  },
  toString: function() {
    return 'Liu'
  }
}

var people = [
  person1,
  person2
]

alert(people) //hei, Liu
alert(people.toString())  //hei, Liu
alert(people.toLocaleString())  //ming, Li

   数组继承的 toLocaleString() 和 toStrig()、 valueOf() 方法,在默认情况下都会以,进行分隔。如果想使用其他分隔符号,可以使用数组的join() 方法,该方法接收一个参数,然后然会所有数组项的字符串。不传值,或者传入undefined默认使用 ,进行分割。

  栈方法

  ECMAScript 数组也提供了一种数组类似于其他数据结构的方法, 可以让数组表现的像栈一样。栈是(LIFO)后进先出的结构,最早项被移除。而栈中项的插入和移除叫做(推入、弹出)。ECMAScript为数组提供了两个方法。push() 和 pop()。

  push(): 可以接收任意数量的参数,把他们逐个添加到数组的末尾,并返回修改数组后的长度。

  pop(): 从数组末尾移除最后一项,减少数组的length,然后返回移除的项。

  队列方法

  队列的数据结构访问规则是(FIFO),先进先出。 队列在列表的末端添加数据,从列表的前端进行移除。push方法是向末尾添加元素,所以模拟队列需要从数组前端去除数据。可以使用 shift() 方法

  shift(): 能移除数组的第一项,返回被移除值。

  unshift(): 和 shift方法相反,能在数组的前端添加任意个数的数据,并返回新的数组长度。

  重排序方法

  数组提供了两个用来重排序的方法: reverse() 和 sort()

  reverse(): 反转数组项的顺序。 如: var values = [1,2,3] ;  console.log(value.reverse())// [3,2,1]

  sort(): sort() 方法默认升序排列数组项,但是sort()方法会调用数组每一项的toString() 方法,然后比较得到字符串,即使数组的每一项都是数值,,也是比较的字符串。如 var values = [0, 1, 5, 10, 15]; console.log(values.sort()); // [0,1,10,15,5]。为了解决这种问题, sort() 方法可以接收一个比较函数,比较函数接收两个参数, 入股哟第一个参数应该位于第二个参数之前,返回一个负数,反之则返回一个正数,相等则返回0。

  如:

function compare(val1, val2) {
  if (val1 < val2) {
    return -1      
  }  else if (val1 > val2) {
    return 1
  } else {
    return 0
  }
}
var values = [0, 1, 5, 10, 15];
console.log(values.sort(compare)) // [0,1,5,10,15]

// 也可以简写成
console.log(values.sort((val1, val2) => return val2 - val1))

 操作方法

  ECMAScript 提供了很多数组的操作方法:

  concat(): 基于当前数组创建一个副本,然后将接收到的参数添加到这个副本的末尾,并返回这个新的数组。在没有给cancat传参的时候,它只是复制一下当前数组并返回。如果向concat中传入的是一个或者多个数组, 它会将数组的每一项都添加到结果数组,如果不是数组,就会被简单的添加到末尾。 如: var nums1 = [1,2,3]; var nums2 = nums1.concat([4,5,6],7,8); //nums2 = [1,2,3,4,5,6,7,8]

  slice(): 它能够基于当前数组中的一个或者多个项创建一个新的数组。 slice()方法接收一个或者两个参数, 即返回位置和结束位置。在只有一个参数的情况下是从该位置到当前数组的结束位置,如果是两个参数,则返回从开始位置,到结束位置(不包含结束位置)的项, slice方法不会影响原始数组。

  slpice(): 最强大的数组方法,有多种用法:

    删除:可以删除任意数量的项,需要指定两个参数: 要删除第一项的位置 和 要删除的项数,例如: slice(0, 2) 会删除数组的前两项

    插入:可以向指定位置插入任意数量的项,需要三个参数, 起始位置,0(删除的项数),要插入的任意数量的项

    替换:可以替换指定位置项数,并插入任意的项。 和插入传参类似, 起始位置,1(删除的项数),要插入的任意数量的项, 插入的项不必和删除的项相等。

  splice() 方法始终会返回一个数组,该数组中包含从原始数组中删除的项,如果没有删除任何项,则返回一个空数组。

  

  

 

posted @ 2022-02-15 09:25  梦为湘子  阅读(668)  评论(0编辑  收藏  举报