目录
- 创建数组的两种方式
- 1、字面量方式
- 2、new Array()
- 检测是否为数组
- instanceof 运算符
- Array.isArray()
- 添加删除数组元素的方法
- push(参数1,参数2,……)
- unshift(参数1,参数2,……)
- pop()
- shift()
- 数组排序
- reverse()
- sort()
- 数组索引方法
- indexOf()
- lastIndexOf()
- 数组转换为字符串
- 其他方法
- concat()
- slice()
- splice()
学习来源:https://www.bilibili.com/video/BV1HJ41147DG
数组:
创建数组的两种方式
1、字面量方式
例如
var arr = [1,"test",true];
2、new Array()
例如
var arr = new Array(); // 创建一个空数组
var arr = new Array(3); // 创建数组长度为3的一个空数组,里面有3个空的数组元素
var arr = new Array(2, 3); // 表示有2个数组元素,是2和3
注释
上面代码中arr创建出的是一个空数组,如果需要使用构造函数Array创建非空数组,可以在创建数组时传入参数
- 参数传递规则如下:
- 如果只传入一个参数,则参数规定了数组的长度
- 如果传入了多个参数,则参数称为数组的元素
检测是否为数组
instanceof 运算符
- instanceof 可以判断一个对象是否是某个构造函数的实例
语法
obj instanceof Array; // obj 需要检测的值
示例
var arr = [1, 23];
var obj = {};
console.log(arr instanceof Array); // true
console.log(obj instanceof Array); // false
Array.isArray()
- Array.isArray()用于判断一个对象是否为数组,isArray() 是 HTML5 中提供的方法,ie9以上版本支持
语法
Array.isArray(obj); // obj 需要检测的值
示例
var arr = [1, 23];
var obj = {};
console.log(Array.isArray(arr)); // true
console.log(Array.isArray(obj)); // false
示例
// 翻转数组
function reverse(arr) {
// if (arr instanceof Array) {
if (Array.isArray(arr)) {
var newArr = [];
for (var i = arr.length - 1; i >= 0; i--) {
newArr[newArr.length] = arr[i];
}
return newArr;
} else {
return 'error 参数要求必须是数组格式'
}
}
console.log(reverse([1, 2, 3])); // [3, 2, 1]
console.log(reverse(1, 2, 3)); // error 参数要求必须是数组格式
添加删除数组元素的方法
- 数组中有进行增加、删除元素的方法,部分方法如下表
注释 - push、unshift为增加元素方法;
- pop、shift为删除元素的方法
push(参数1,参数2,……)
- 在数组的末尾添加一个或者多个数组元素
var arr = [1, 2, 3];
// arr.push(4, 's');
console.log(arr.push(4, 's'));
console.log(arr);
注释
- push 是可以给数组追加新的元素,并返回新数组的长度
- push() 参数直接写数组元素就可以了
- 原数组会发生变化
unshift(参数1,参数2,……)
- 在数组的开头 添加一个或者多个数组元素
var arr = [1, 2, 3];
console.log(arr.unshift('red', 'blue'));
console.log(arr);
注释
- unshift是可以给数组前面追加新的元素,并返回新数组的长度
- unshift() 参数直接写数组元素就可以了
- 原数组会发生变化
pop()
- 删除数组的最后一个元素
var arr = [1, 2, 3];
console.log(arr.pop());
console.log(arr);
console.log(arr.length);
注释
- pop是可以删除数组的最后一个元素,记住一次只能删除一个元素,返回的结果是删除的那个元素
- pop() 没有参数
- 原数组会发生变化
shift()
- 删除数组的第一个元素
var arr = [1, 2, 3];
console.log(arr.shift());
console.log(arr);
console.log(arr.length);
注释
- shift是可以删除数组的第一个元素,记住一次只能删除一个元素,返回的结果是删除的那个元素
- shift() 没有参数
- 原数组会发生变化
数组排序
- 数组中有对数组本身排序的方法,部分方法如下表
reverse()
- 翻转数组并返回新数组,会改变原来的数组
var arr = ['orange', 'red', 'blue'];
arr.reverse();
console.log(arr);
sort()
- 排序数组并返回新数组,会改变原来的数组
注释
- sort方法需要传入参数来设置升序、降序排序
- 如果传入“function(a,b){ return a-b;}”,则为升序
- 如果传入“function(a,b){ return b-a;}”,则为降序
- 如果没有设置升序降序规则,元素按照转换为的字符串的各个字符的Unicode位点进行排序
- 例如:“black” 排在 “red” 之前,“666” 排在 “88” 之前
// 数组排序(冒泡排序)
var arr1 = [13, 4, 77, 1, 7];
arr1.sort(function (a, b) {
// return a - b; 升序的顺序排列
return b - a; // 降序的顺序排列
});
console.log(arr1);
数组索引方法
- 数组中有获取数组指定元素索引值的方法,部分方法如下表
注释
此两个方法区分大小写
indexOf()
- 返回数组元素索引号方法
- indexOf(searchElement,fromIndex) 作用就是返回该数组元素的索引号,从前面开始查找
- 它只返回第一个满足条件的索引号
- 它如果在该数组里面找不到该元素,则返回的是 -1
注释
searchElement:必须。要查找的元素
fromIndex:可选。开始查找的位置。如果该索引值大于或等于数组长度,意味着不会在数组里查找,返回-1。如果参数中提供的索引值是一个负值,则将其作为数组末尾的一个抵消,即-1表示从最后一个元素开始查找,-2表示从倒数第二个元素开始查找 ,以此类推。 注意:如果参数中提供的索引值是一个负值,并不改变其查找顺序,查找顺序仍然是从前向后查询数组。如果抵消后的索引值仍小于0,则整个数组都将会被查询。其默认值为0。
示例
var arr = ['blue', 'red', 'green', 'blue'];
console.log(arr.indexOf('blue')); // 0
console.log(arr.indexOf('yellow')); // -1
console.log(arr.indexOf('blue',2)); // 3
console.log(arr.indexOf('red',-2)); // -1
console.log(arr.indexOf('red',-3)); // 1
lastIndexOf()
- 返回数组元素索引号方法
- lastIndexOf(searchElement,fromIndex) 作用就是返回该数组元素的索引号,从后面开始查找
- 它只返回第一个满足条件的索引号
- 它如果在该数组里面找不到该元素,则返回的是 -1
var arr = ['blue', 'red', 'green', 'blue'];
console.log(arr.lastIndexOf('blue')); // 3
console.log(arr.lastIndexOf('yellow')); // -1
注释
searchElement:必须。要查找的元素
fromIndex:可选。从此位置开始逆向查找。默认为数组的长度减 1(arr.length - 1),即整个数组都被查找。如果该值大于或等于数组的长度,则整个数组会被查找。如果为负值,将其视为从数组末尾向前的偏移。即使该值为负,数组仍然会被从后向前查找。如果该值为负时,其绝对值大于数组长度,则方法返回 -1,即数组不会被查找。
案例
数组去重
- 要求去除数组中重复的元素
- 目标: 把旧数组里面不重复的元素选取出来放到新数组中, 重复的元素只保留一个, 放到新数组中去重。
- 核心算法: 遍历旧数组, 然后拿着旧数组元素去查询新数组, 如果该元素在新数组里面没有出现过, 就添加进新数组, 否则不添加。
function add(arr) { // 封装去重函数
var newArr = new Array(); // var newArr = [];
for (var i = 0; i < arr.length; i++) {
if (newArr.indexOf(arr[i]) == -1) {
newArr.push(arr[i]); // newArr[newArr.length] = arr[i];
}
}
return newArr;
}
console.log(add(['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b']));
console.log(add(['blue', 'green', 'blue']));
数组转换为字符串
- 数组中有把数组转化为字符串的方法,部分方法如下表
注释
join方法如果不传入参数,则按照 “ , ”拼接元素
示例
var arr = ['green', 'blue', 'pink'];
console.log(arr.join()); // green,blue,pink
console.log(arr.join('-')); // green-blue-pink
console.log(arr.join('- ')); // green- blue- pink
console.log(arr.join('&')); // green&blue&pink
其他方法
- 数组中还有其他操作方法,同学们可以在课下自行查阅学习
concat()
- 连接两个或多个数组,不会改变原数组,返回连接后的新数组
语法
arrayObject.concat(array1,array2,……,arrayn); // 参数可以是具体的值,可以是数组对象,也可以是任意多个返回值
注释
该数组是通过把所有参数添加到arrayObject中生成的,如果要进行concat()操作的参数的是数组,那么添加的是数组中的元素,而不是数组。
不同类型的参数也可以连接
示例
var s1 = [1, 2, 3];
var s2 = ['1', '2', '3'];
console.log(s1.concat(s2)); // 1, 2, 3, "1", "2", "3"
console.log(s1); // 1, 2, 3 原数组不变
console.log(s2); // "1", "2", "3" 原数组不变
var arr = ['a', 'b']
console.log('c'.concat(arr)); // String类型 'ca,b'
console.log(arr.concat('c'));
console.log(arr.concat(s1, s2)); // "a", "b", 1, 2, 3, "1", "2", "3"
slice()
- 截取数组元素,返回被截取项目的新数组,不会改变原数组
语法
arrayObject.slice(begin,end);
注释
begin:规定从何处开始截取。如果是负数,规定从数组尾部开始算起的位置,即-1指最后一个元素,-2指倒数第2个元素,……
end:规定从何处结束截取。该参数是数组结束处的数组下标(不包括end)。如果没有指定该参数,那么默认截取数组元素从star开始到数组结束的所有元素;如果为负数,规定从数组尾部开始算起的元素。
示例
var arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
console.log(arr.slice(3)); // "d", "e", "f", "g", "h"
console.log(arr); // "a", "b", "c", "d", "e", "f", "g", "h" 不改变原数组
console.log(arr.slice(3, 7)); // "d", "e", "f", "g"
console.log(arr); // "a", "b", "c", "d", "e", "f", "g", "h" 不改变原数组
console.log(arr.slice(-5,5)); // "d","e"
console.log(arr.slice(-5,-3)); // "d","e"
splice()
- 添加/删除数组元素,返回被删除元素的新数组,会改变原数组
语法
arrayObject.splice(index,howmany,item1,item2,……,itemn)
注释
index:必须。整数。规定添加/删除元素的位置,如果是负数,规定从数组尾部开始算起的位置,即-1指最后一个元素,-2指倒数第2个元素,……
howmany:必须。需要删除元素的个数,如果为0,表示不会删除元素
itemn:可选。向数组中添加新元素
示例
var arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
console.log(arr); // "a", "b", "c", "d", "e", "f", "g", "h"
// 删除数组元素 倒数第二个,后面的元素前移一位
console.log(arr.splice(-2, 1)); // "g"
console.log(arr); // "a", "b", "c", "d", "e", "f", "h" 改变原数组
// 删除并插入数组元素 从第4个元素开始删除两个,并在arr[3]插入z,后面的元素前移两位
console.log(arr.splice(3, 3, 'z')); // "d", "e", "f"
console.log(arr); // "a", "b", "c", "z", "h"