数组知识点总结--JS

目录

一、数组的介绍

二、数组的创建

三、数组的方法

四、数组的遍历

五、数组的空位

六、总结

---

一、数组的介绍

数组（Array）

数组也是一个对象，它和我们普通对象功能类似，也是用来存储一些值的，不同的是普通对象是使用字符串作为属性名的，而数组时使用数字来作为索引操作元素

索引：

从0开始的整数就是索引

数组的存储性能比普通对象要好，在开发中我们经常使用数组来存储一些数据

二、数组的创建

数组的创建主要有两种方法

方法一：创建数组对象

 创建一个空的数组：

var arr = new Array();

创建一个包含元素的数组：

var arr = new Array(10,20,30);

创建一个确定长度但内容为空的数组：

var arr = new Array(10);

方法二：利用字面创建数组

 创建一个空的数组：

var arr = [];

创建一个包含元素的数组：

var arr = [1,2,3,4,5,10];

创建一个确定长度但内容为空的数组：

var arr=[10];

三、数组的方法

1.length

length属性是来获取数组的长度(元素的个数)

语法：数组.length

var arr=[10];
console.log(arr.length)//10

2.push()

该方法可以向数组的末尾添加一个或多个元素，并返回数组的新的长度

var arr=[1,2,3]
var result = arr.push(4,5,6);
console.log(arr);//[1,2,3,4,5,6]
console.log("result = "+result);//6

3.pop()

该方法可以删除数组的最后一个元素,并将被删除的元素作为返回值返回

result = arr.pop();
console.log(arr);//[1,2,3,4,5]
console.log("result = "+result);//5

4.unshift()

向数组开头添加一个或多个元素，并返回新的数组长度

向前边插入元素以后，其他的元素索引会依次调整

arr.unshift(0,1);
			
console.log(arr);//[0,1,1,2,3,4,5]

5.shift()

可以删除数组的第一个元素，并将被删除的元素作为返回值返回

result = arr.shift();
result = arr.shift();
			
console.log(arr);//[1,2,3,4,5]

6.slice()

可以用来从数组提取指定元素

该方法不会改变元素数组，而是将截取到的元素封装到一个新数组中返回

参数：

       1.截取开始的位置的索引,包含开始索引

       2.截取结束的位置的索引,不包含结束索引

 第二个参数可以省略不写,此时会截取从开始索引往后的所有元素

索引可以传递一个负值，如果传递一个负值，则从后往前计算

 -1 倒数第一个

 -2 倒数第二个

var result = arr.slice(1,4);
console.log(result);//[2,3,4]
			
result = arr.slice(3);
console.log(result);//[4,5]	
		
result = arr.slice(1,-2);
console.log(result);//[2,3]	

7.splice()

可以用于删除数组中的指定元素

使用splice()会影响到原数组，会将指定元素从原数组中删除

并将被删除的元素作为返回值返回

 - 参数：

          第一个，表示开始位置的索引

          第二个，表示删除的数量

          第三个及以后。。

          可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边

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

var result = arr.splice(3,0,8,9,10);
console.log(arr);//[1, 2, 3, 8, 9, 10, 4, 5]

8.concat()

可以连接两个或多个数组，并将新的数组返回

该方法不会对原数组产生影响

var arr1=[1,2,3];
var arr2=[4,5]
var result=arr1.concat(arr2);
console.log(result);//[1,2,3,4,5]

9.join()

 该方法可以将数组转换为一个字符串

该方法不会对原数组产生影响，而是将转换后的字符串作为结果返回

在join()中可以指定一个字符串作为参数，这个字符串将会成为数组中元素的连接符

 如果不指定连接符，则默认使用,作为连接符

var arr1=[1,2,3];
var result=arr1.join("*")
console.log(result);//1*2*3

10. reverse()

该方法用来反转数组（前边的去后边，后边的去前边）会直接修改原数组

var arr1=[1,2,3];
arr1.reverse();
console.log(arr1);//[3,2,1]

11.sort()

可以用来对数组中的元素进行排序 也会影响原数组，

默认会按照Unicode编码进行排序，所以对于数字排序需要加入回调函数

 var arr3=[11,3,2]
        arr3.sort(function(a,b){ //a是后面的值
            console.log("a"+a)
            console.log("b"+b)
            if(a>=b){
                return 1;//大于等于零位置不变
            }else {
                return -1;//小于零交换位置
            }

        })
 console.log(arr3)//[2,3,11]

12.filter()

filter()方法用于过滤数组成员，满足条件的成员组成一个新数组返回。

[1, 2, 3, 4, 5].filter(function (elem) {
  return (elem > 3);
})
// [4, 5]

13.some() every() 

some方法是只要一个成员的返回值是true，则整个some方法的返回值就是true，否则返回false。

every方法是所有成员的返回值都是true，整个every方法才返回true，否则返回false。

var arr = [1, 2, 3, 4, 5];
arr.some(function (elem, index, arr) {
  return elem >= 3;
});
// true
arr.every(function (elem, index, arr) {
  return elem >= 3;
});
// false

14.indexOf() indexOf()

indexOf方法返回给定元素在数组中第一次出现的位置，如果没有出现则返回-1。

var a = ['a', 'b', 'c'];

a.indexOf('b') // 1
a.indexOf('y') // -1

indexOf方法还可以接受第二个参数，表示搜索的开始位置。

['a', 'b', 'c'].indexOf('a', 1) // -1

上面代码从1号位置开始搜索字符a，结果为-1，表示没有搜索到。

lastIndexOf方法返回给定元素在数组中最后一次出现的位置，如果没有出现则返回-1。

var a = [2, 5, 9, 2];
a.lastIndexOf(2) // 3
a.lastIndexOf(7) // -1

四、数组的遍历

1.利用for循环

var arr=[1,2,3];
for(var i=0;i<arr.lengthl;i++){
        console.log(arr[i]);

}
//1
//2
//3

2.利用for in

var a = [1, 2, 3];

for (var i in a) {
  console.log(a[i]);
}
// 1
// 2
// 3

3.利用foreach

第一个参数，就是当前正在遍历的元素

第二个参数，就是当前正在遍历的元素的索引

第三个参数，就是正在遍历的数组

var arr=[1,2,3];
arr.forEach(function(value , index , obj){
				console.log(value);
});
//1 
//2 
//3			

五、数组的空位

下方是网道对数组的空位的解释，较为详细。需要重点注意的地方我已经加粗。

当数组的某个位置是空元素，即两个逗号之间没有任何值，我们称该数组存在空位（hole）。

var a = [1, , 1];
a.length // 3

上面代码表明，数组的空位不影响length属性。虽然这个位置没有值，引擎依然认为这个位置是有效的。

需要注意的是，如果最后一个元素后面有逗号，并不会产生空位。也就是说，有没有这个逗号，结果都是一样的。

var a = [1, 2, 3,];

a.length // 3
a // [1, 2, 3]

上面代码中，数组最后一个成员后面有一个逗号，这不影响length属性的值，与没有这个逗号时效果一样。

数组的空位是可以读取的，返回undefined。

var a = [, , ,];
a[1] // undefined

使用delete命令删除一个数组成员，会形成空位，并且不会影响length属性。

var a = [1, 2, 3];
delete a[1];

a[1] // undefined
a.length // 3

上面代码用delete命令删除了数组的第二个元素，这个位置就形成了空位，但是对length属性没有影响。也就是说，length属性不过滤空位。所以，使用length属性进行数组遍历，一定要非常小心。

数组的某个位置是空位，与某个位置是undefined，是不一样的。如果是空位，使用数组的forEach方法、for...in结构、以及Object.keys方法进行遍历，空位都会被跳过。

var a = [, , ,];

a.forEach(function (x, i) {
  console.log(i + '. ' + x);
})
// 不产生任何输出

for (var i in a) {
  console.log(i);
}
// 不产生任何输出

Object.keys(a)
// []

如果某个位置是undefined，遍历的时候就不会被跳过。

var a = [undefined, undefined, undefined];

a.forEach(function (x, i) {
  console.log(i + '. ' + x);
});
// 0. undefined
// 1. undefined
// 2. undefined

for (var i in a) {
  console.log(i);
}
// 0
// 1
// 2

Object.keys(a)
// ['0', '1', '2']

这就是说，空位就是数组没有这个元素，所以不会被遍历到，而undefined则表示数组有这个元素，值是undefined，所以遍历不会跳过。

六、总结

这次我初次接触js,跟着视频做了简单的学习，为了防止遗忘做了初步总结，把数组做了一个大致的疏通，不足之处还请包涵，后续经过深层次的学习也会对其进行补充。