1. 认识数组

  1. 内置对象是JS语言自带的对象,提供了一些基本的功能供开发者使用。常用的内置对象有MathStringArrayDate等。<br /> 对象<br /> 属性(变量)和方法(函数)的集合<br /> **数组就是对象**<br />** 可以存储多个不同类型的数据**

2.创建数组

2.1 内存

2.1.1 栈区

  基本数据类型保存在栈区,会根据函数的结束而自动释放

2.1.2 堆区

  需要手动开辟,并且需要手动释放

2.2 new

2.2.1 在堆区开辟内存空间来存储对象

2.2.2 返回堆区对象的引用

通过栈区的引用,访问堆区的对象

df268ff17bf440e4168df81926ad41f264edfa3104f9751913ca350c35559ac7.png

2.3 构造函数法创建数组

2.3.1 创建空数组

var arr = new Array();

2.3.2 创建确定容量的数组

var arr = new Array(10);

2.3.3 创建一个拥有一些数据的数组

var arr = new Array(1,2,"Tom",true);

2.4 字面量法创建数组

2.4.1 创建空数组

var array = [];

2.4.2 创建一个拥有一些数据的数组

var array = [1,2,"Tom",true];

3. 数组的访问(赋值与取值)

3.1 数组元素的访问

直接通过数组下标访问

3.2 赋值与取值

通过数组下标取值,并可以对其进行赋值
0695a25c02cdc7734cf26566d828dc8a15237917152eef3c8a8f70f368a86b5f.PNG

4. 数组的遍历

4.1 快速遍历:for-in

in的前面针对于数组来说是数组下标
2b3a8edbaaccacf29bf59e9acceae0b58a5664534005aa232845316d1e702e83.png

4.2 for循环遍历

for循环按顺序遍历
9a6175944496afd7400d00ad12ba6c6bbc2509ed1b6a28361e2cb8346f4ba9a3.png

4.3 forEach()遍历

ECMAScript5.0加入的新方法,低版本IE中不支持
a752bbc4b6cd01dcc3674e3405a15bca7a2f8f4456dece24dbd6b57bdfe13199.png

5. 数组的长度,元素的更新,增加和删除

5.1 数组长度

5.1.1 数组元素的个数

5.1.2 length不计算非正规(数字)下标

5.1.3 数组最多可以包含4294967295个项,基本上可以满足任何编程要求

5.2 数组长度的增加

数组长度的增加,默认赋值为undefined

var array = [1,2,3];
array.length = 5;
console.log(array);    //[1,2,3,undefined,undefined]

5.3 数组长度的减少

数组长度的减少,多余的删除

var array = [1,2,3,4,5];
array.length = 3;
console.log(array);    //[1,2,3]

5.4 添加数组元素

var array = [1,2,3];
// 添加元素的位置小于数组长度,数组元素替换
array[2] = 10;
console.log(array);  // [1,2,10]
//添加的元素位置大于数组疮毒,则数组长度自动补齐,默认赋值undefined
array[5] = 20;
console.log(array);  //[1,2,10,undefined,undefined,20]

5.5 删除数组元素

用delete操作符来删除指定的元素

注意:数组长度不会改变,只是对应的值删除为undefined

var array = [1,2,3,4,5];
delete array[2];
console.log(array);   //[1,2,undifined,4,5]

6. 数组中常用的方法

6.1 push(item1, item2, …)

6.1.1 功能

  在数组的末尾添加一个或者多个元素

6.1.2 参数

  要添加的元素

6.1.3 返回值

  添加数据后数组的长度
var array = [1,2,3];
var ret = array.push(4,5,6);
console.log(ret);  //6
console.log(array);   //[1,2,3,4,5,6]

6.2 unshift(item1, item2, …)

6.2.1 功能

  在数组的开头添加一个或多个元素

6.2.2 参数

  要添加的元素

6.2.3 返回值

  添加数据后数组的长度
var array = [1,2,3];
var ret = array.unshift(4,5,6);
console.log(ret);    //6
console.log(array);   // [4,5,6,1,2,3]

6.3 pop()

6.3.1 功能

  删除数组末尾的一个元素

6.3.2 参数

6.3.3 返回值

  被删除的元素
var array = [1,2,3,4,5];
var ret = array.pop();
console.log(array);   //[1,2,3,4]
console.log(ret);    // 5

6.4 shift()

6.4.1 功能

  在数组的开头删除一个元素

6.4.2 参数

6.4.3 返回值

  被删除的元素
var array = [1,2,3,4,5];
var ret = array.shift();
console.log(array);   //[2,3,4,5]
console.log(ret);   //1

6.5 join(str)

6.5.1 功能

  将数组的元素用参数字符串拼接成一个新的字符串

6.5.2 参数

  一个字符串

6.5.3 返回值

  拼接的结果

注意:并不会改变原数组

var array = [1,2,3,4,5];
var ret = array.join("-");
console.log(array);   //[1,2,3,4,5]
console.log(ret); //1-2-3-4-5

6.6 reverse()

6.6.1 功能

  倒置数组元素

6.6.2 参数

6.6.3 返回值

  倒置以后的数组

注意:将会改变原数组

var array = [1,2,3,4,5];
var ret = array.reverse();
console.log(array);  //[5,4,3,2,1]
console.log(ret);    //[5,4,3,2,1]

6.7 slice(startIndex, endIndex)

6.7.1 功能

  在数组中,从startIndex下标开始一直截取到endIndex下标之前

6.7.2 参数

  开始和结束下标

6.7.3 返回值

  截取的数据数组

注意:不包含endIndex下标处的元素 注意:不会改变原数组

var array = [1,2,3,4,5];
var ret = array.slice(1,3);
console.log(array);  //[1,2,3,4,5]
console.log(ret);    //[2,3]

6.8 splice(下标,个数,item1, item2, …)

6.8.1 功能

  在数组的中间添加或者删除一些元素

添加

    从下标为1的位置删除0个元素,并添加两个元素8, 9
    注意:如果下标大于原数组最大的下标,都是在数组最后添加元素
var array = [1,2,3,4,5];
var ret = array.splice(1,2,8,9);
console.log(array);  //[1,8,9,4,5]
console.log(ret);    //[2,3]

// 如果下表大于原数组最大的下表,都是再数组最后添加元素
var ret1 = array.splice(8,2,8,9);
console.log(array); [1,2,8,9,4,5,8,9]
console.log(ret1);  []

删除

    从下标为1的位置删除两个元素(2, 3),并添加两个元素8, 9,返回含有被删除元素的数组
    注意:如果省略可选参数,则从下标开始删除对应个数的元素,返回删除的元素数组
var array = [1,2,3,4,5];
var ret = array.splice(1,2);
console.log(array);  //[1,4,5]
console.log(ret);    //[2,3]

//如果省略可选参数,则从下标开始删除对应个数的元素,返回删除元素数组
var ret1 = array.splice(1,1);
console.log(array);  //[1,5]
console.log(ret1);   // [4]

6.8.2 参数

下标:必需。

规定从何处添加/删除元素
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。

个数:必需。

规定应该删除多少元素。必须是数字,但可以是 “0”。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。

item1, item2, …:可选。

要添加到数组的新元素

6.8.3 返回值

  含有被删除的元素的数组

注意:将会改变原数组

6.9 concat()

6.9.1 功能

  将多个数组拼接成一个数组

6.9.2 参数

  一个或多个数组或者元素

6.9.3 返回值

  拼接之后新的数组

注意:拼接后数组的元素将按照传入参数的顺序排列 注意:不改变原数组

var array = [1,2];
var newArray = array.concat([3,4]),"a",true);
console.log(array); //[1,2]
console.log(newArray); //[1,2,3,4,"a",ture]

6.10 indexOf(item)

6.10.1 功能

  从数组的左侧开始查找对应第一次出现的参数元素的下标

6.10.2 参数

  要查找的元素值

6.10.3 返回值

  如果找到了对应的元素则返回该元素的下标值,否则返回-1
var array = [1,2,3,4,5];
var ret = array.indexOf(4);
console.log(array); //[1,2,3,4,5]
console.log(ret); //3
console.log(Array.indexOf(6)); // -1

6.11 lastIndexOf(item)

6.11.1 功能

  从数组的右侧开始查找对应第一次出现的参数元素的下标

6.11.2 参数

  要查找的元素值

6.11.3 返回值

  如果找到了对应的元素则返回该元素的下标值,否则返回-1
var array = [1,2,3,4,5];
var ret = array.lastIndexOf(4);
console.log(array); //[1,2,3,4,5]
console.log(ret); //3
console.log(Array.lastIndexOf(6)); // -1

7. 数组排序

7.1 冒泡排序

7.1.1 原理

冒泡排序的基本思想是,对相邻的元素进行两两比较,顺序相反则进行交换,这样,每一趟会将最小或者最大的元素浮到顶端,最终达到完全有序

7.1.2 公式

var array = [4,5,2,8,6];
for (var i = 0, len1 = array.length; i < len1; i++){
    for(var j = 0, len2 = array.length; j < len2; j++){
        if(array[j]) <= array[j+1]{
        var temp = array[j];
      array[j] = array[j+1];
      array[j+1] = temp;
          };
  };
};
console.log(array); //[8,6,5,4,2]

7.2 sort()

7.2.1 默认升序排序

var array = [4,5,2,3,1];
//默认升序排序
array.sort();
console.log(array);   //[1,2,3,4,5]

7.2.2 sort()调用每一项的toString()方法,然后比较得到的字符串,确定如何排序

排降序,需要给出排序的标准,排序的标准是一个函数
var array = [4,5,2,3,1];
//降序排序
array.sort(function(v1,v2){
if (v1 < v2 ){
    return 1;
    };
 return -1 ;
});
console.log(array); //[5,4,3,2,1]

8. 迭代方法

8.1 every()

对数组中的每一项运行给定函数,如果该数组中每一项都返回true,则返回true
ECMAScript5为数组定义了5个迭代方法,每个方法接收2个参数,一个是每一项运行的函数,一个是运行该函数的作用域对象,传入这些方法的函数会接收三个参数:数组项的值,该项在数组中的位置,数组对象本身。

var array = [1,2,3,4,5];
var retVal = array.every(function(item,index,array){
    return item > 2;  //false
  //return item < 6; //true
});
console.log(retVal);

8.2 filter()

对数组中的每一项运行给定函数,返回该函数返回true的项组成的数组

var array = [1,2,3,4,5];
var retVal = array.filter(function(item,index,array){
    return item > 2;  //false
  //return item < 6; //true
});
console.log(retVal); //[3,4,5]

8.3 forEach()

对数组中的每一项运行给定函数,这个方法没有返回值

var array = [1,2,3,4,5];
var retVal = array.foreach(function(item,index,array){
     //执行某些操作
});
console.log(retVal); //[3,4,5]

8.4 map()

对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组

var array = [1,2,3,4,5];
var retVal = array.map(function(item,index,array){
    return item * 2; 
});
console.log(retVal); //[2,4,6,8,10]

8.5 some()

对数组中的每一项运行给定函数,只要其中有一项返回true, 则返回true。与every()相反

var array = [1,2,3,4,5];
var retVal = array.some(function(item,index,array){
    return item > 2; 
});
console.log(retVal); //ture

9. 归并方法

归并方法
ECMAScript5还新增了2个归并方法,这两个方法都会迭代数组的所有项,然后构建成一个最终返回的值

9.1 reduce()

9.1.1 语法arr.reduce([callback, initialValue])

callback(previousValue, currentValue, currentIndex, array)

  • 这个函数返回的任何值都会作为第一个参数自动传递给下一项
  • previousValue:上一次调用回调函数返回的值,或者是提供的初始值(initialValue)
  • currentValue:数组中当前被处理的元素
  • currentIndex:当前被处理元素在数组中的索引,即currentValue的索引。如果有initialValue初始值,从0开始,否则从1开始
  • array:调用reduce()的数组

    initialValue

    可选参数, 作为第一次调用 callback 的第一个参数。
    例子
    var array = [1,2,3,4,5];
    var retVal = array.reduce(function(prev,cur,index,array){
    //实现数组元素累加求和
    return prev + cur; 
    });
    console.log(retVal); //15
    

    9.2 reduceRight()

    从数组的最后一项开始,向前遍历到第一项
    eg: 与reduce()一样,方向相反