JavaScript数组知多少

阅读量：5836 次

发布时间：2019-06-18

本文共 5076 字，大约阅读时间需要 16 分钟。

数组的维基百科定义是：

在中，数组数据结构（英语：array data structure），简称数组（英语：Array），是一种，是数据元素（elements）的集合。元素可以通过索引来任意存取，索引通常是数字，用来计算元素之间存储位置的偏移量。

不幸的是JavaScript没有像此类数组一样的数据结构，但提供了一种拥有一些类数组特性的对象，它把数组下标转变成字符串，用其作为属性。

使用数组

1.创建数组

var numbers = [];    //[]操作符声明了一个空的数组，长度为0。var numbers = new Array();    //与上等价var numbers = [1,2,3,4,5];var numbers = new Array(1,2,3,4,5);    //构造函数传入初始值var numbers = new Array(5);     //只传入一个参数，用来指定数组的长度var objects = [1,"Joe",true, null];    //在 JavaScript 里数组中的元素不必是同一种数据类型。

推荐使用 [ ] 操作符创建数组，这种方式效率更高。

JavaScript允许数组包含任意混合类型的值

var obj = ['string', 21, true, null, undefined, ['hzzly', 21], {object: true}, NaN];

2.数组长度

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

JavaScript数组的 length 是没有上界的

如果你用大于或等于当前 length 的数字作为下标来存储一个元素，那么 length 值会被增大以容纳新元素，不会发生数组越界错误。

var arr = [];arr.length       //0arr[1000] = true;arr.length      //1001//但 arr 只包含一个属性

3.由字符串生成数组

split() 方法用于把一个字符串分割成字符串数组。

var str = 'hzzly';var arr  = str.split('');console.log(arr);   // ["h", "z", "z", "l", "y"]

4.对数组的整体性操作

当把一个数组赋给另外一个数组时，只是为被赋值的数组增加了一个新的引用。当你通过原引用修改了数组的值，另外一个引用也会感知这个变化（浅复制）。而深复制是指将原数组中的每一个元素都复制一份到新数组中。

存取函数

1.indexOf()

indexOf() 用来查找进来的参数在目标数组中是否存在。如果目标数组包含该参数，就返回该元素在数组中的索引；如果不包含，就返回-1。如果数组中包含多个相同的元素，indexOf()
函数总是返回第一个与参数相同的元素的索引。lastIndexOf()，该函数返回相同元素中最后一个元素的索引，如果没找到相同元素，则返回-1。

var arr = ["h", "z", "z", "l", "y"];arr.indexOf('h');  //0arr.indexOf('l')   //3arr.indexOf('z')   //1arr.lastIndexOf('z')   //2

2.数组的字符串表示

join() 和 toString() 方法都返回一个包含数组所有元素的字符串，默认各元素之间用逗号分开。当直接对一个数组使用 print()
函数时，系统会自动调用数那个数组的tostring()方法。

var arr = ["h", "z", "z", "l", "y"];arr.join()   //"h,z,z,l,y"arr.toString()   //"h,z,z,l,y"

3.由已有数组创建新数组

concat() 方法可以合并多个数组创建一个新数，concat() 方法发起者是一个数组，参数是另一个数组。作为参数的数组，其中的所有元素都被连接到调用 concat() 方法的数组后面；
splice() 方法截取一个数组的子集创建一个新数组；splice() 方法从现有数组里截取一个新数组，该方法的第一个参数是截取的起始索引，第二个参数是截取的长度。

var a = ['h','z'];var b = ['z','l','y'];var c = a.concat(b)   //["h", "z", "z", "l", "y"]var myFish = ['angel', 'clown', 'mandarin', 'surgeon'];// 移除 0 个元素从下标 2, 插入 'drum'var removed = myFish.splice(2, 0, 'drum');// myFish is ['angel', 'clown', 'drum', 'mandarin', 'surgeon']// removed is [], 没有元素被移除// 移除下标为 3 的元素removed = myFish.splice(3, 1);// myFish is ['angel', 'clown', 'drum', 'surgeon']// removed is ['mandarin']// 移除下标为 2 的元素, 然后插入 'trumpet' 到下标 2 removed = myFish.splice(2, 1, 'trumpet');// myFish is ['angel', 'clown', 'trumpet', 'surgeon']// removed is ['drum']// 从下标为 0 开始移除两个元素, 然后插入 'parrot', 'anemone' and 'blue'removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');// myFish is ['parrot', 'anemone', 'blue', 'trumpet', 'surgeon']// removed is ['angel', 'clown']// removes 2 elements from index 3removed = myFish.splice(3, Number.MAX_VALUE);// myFish is ['parrot', 'anemone', 'blue']// removed is ['trumpet', 'surgeon']

可变数组

1.添加元素

push()方法会将一个元素添加到数组末尾，返回数组新长度值，也可以使用数组的length属性为数组添加元素，但push()方法看起来更直观。
unshift() 方法可以将元素添加在数组的开头，也可以通过一次调用，为数组添加多个元素。
splice()方法可以为数组添加元素，需提供如下参数：起始索引（亦即你希望添加元素的地方）,需要删除的元素个数（添加元素时该参数设为0）,想要添加数组的元素(栗子可以看上面的)。

var arr=['h'];arr.push('z');   //2   arr的值为["h","z"]arr.unshift('y')   //3   arr的值为["y","h","z"]

2.删除元素

pop() 方法可以删除数组末尾的元素，返回被删除的值。
shift() 方法可以删除数组的第一个元素，返回被删除的值。数组中的元素自动前移，比pop慢的多。
splice() 方法可以指定要删除的下标和个数，第一个参数是下标，第一个参数是要删除元素的个数，返回值为所删除的元素。

var arr = ["h", "z", "z", "l", "y"];arr.pop()  //返回y     arr的值为["h", "z", "z", "l"]arr.shift()  //返回h     arr的值为["z", "z", "l"]arr.splice(1,2)  //返回["z", "l"]     arr的值为["z"]

3.排序

reverse()方法将数组中元素的以中间位置进行翻转。
sort() 会对数组按照字典顺序进行排序。

使用sort()对数字排序，需要传入一个大小比较函数：function compare(num1,num2) {    return num1 - num2;}var nums = [3,1,2,100,4,200];nums.sort(compare);   //[1, 2, 3, 4, 100, 200]

迭代器方法

1.不生成新数组的迭代器方法

forEach() 该方法接受一个函数使用参数，对数组中的每个元素使用该函数。
every() 该方法接受一个返回值为布尔类型的函数，对数组中得每个元素使用该函数，如果对于所有的元素，该函数都返回 true, 则该方法返回 true。
some() 该方法也接受一个返回值为布尔类型的函数，只要有一个元素使得该函数返回true，该方法就返回 true。
reduce() 该方法接受一个函数，返回一个值。该方法会从一个累加值开始，不断对累加值和数组中的后续元素调用该函数，直到数组中的最后一个元素，最后返回得到的累加值；也可以用来将数组中的元素连接成一个长的字符串。

var arr = [1,2,3,4,5]arr.forEach(function(item,index){   //让数组中的每一项做一件事情    console.log(item,index)})var result = arr.every(function(item,index){   //检测数组中的每一项是否符合条件    return item > 0 })var result = arr.some(function(item,index){   //检测数组中是否有某些项符合条件（只有满足一个即为true）    return item > 1 })var result = arr.every(function(pre,next){   //让数组中的前项和后项做某种计算，并累计最终值    return pre + next})

2.生成新数组的迭代器方法

map() ，和 forEach() 相似，对数组中的每个元素使用某个函数，区别在于返回一个新的数组，该数组的元素是对原有元素应用某个函数得到的结果。
filter() ，和 every() 类似，传入一个返回值为布尔类型的函数，不同的是当对数组中红所有元素应用该函数时，结果均为 true 时，该方法不返回
true，二十返回一个新数组，该数组包含应用该函数后结果为true 的元素。

var arr = [1,2,3,4,5]var newArr = arr.map(function(item,index){   //让数组通过某种计算产生一个新数组    return item * 2})newArr => [2,4,6,8,10]var newArr2 = arr.filter(function(item,index){   //筛选出数组中符合条件的项，组成新数组    return item > 3 })newArr2 => [4,5]

二维数组和多维数组

1.创建二维数组

Array.matrix = function(numrows,numcols,initial) {    var arr = [];    for (var i = 0; i < numrows; ++i) {        var columns = [];         for (var j = 0; j < numcols; ++j) {            columns[j] = initial;        }    arr[i] = columns;    }    return arr;}

数组完

以上皆为个人观点如若有误还望指正