Array数组对象是用于构造数组的全局对象; 它是高阶,类似列表的对象。
我们可以创建一个数组1
2
3
4
5
6
7
8
9
10
11
12var array = new Array();
var array = new Array(20);//数组的成员数量20
或
var array = new Array(20)
var arrs = ["1","2"];
arrs.length();//数组的长度
#可以通过索引访问数组元素
arrs[0]//结果1
#创建一个空数组
var arr = [];
###遍历一个数组(常用)
forEach 方法
1
2
3
4
5
6var arrs = ["aaa","bbb"];
arrs.forEach(function (item, index, array) {
console.log(item, index);
//aaa 0
//bbb 1
});for( ; ; ){}
1
2
3for(var i=0;i< arrs.length;i++){
console.log(arrs[i]);
}for in 方法
1
2
3for(var i in arrs){
console.log(arrs[i]);
}for of 方法
1
2
3for(var value of arrs){
console.log(value);
}map() :方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果
1
2
3
4
5
6
7
8
9
10let array = arr.map(function callback(currentValue, index, array) {
// Return element for new_array
}[, thisArg])
方法会将其传入三个参数,分别是`currentValue`当前成员、`index `当前位置和`array `数组本身
var numbers = [1, 2, 3];
numbers.map(function (n) {
return n + 1;
});
// [2, 3, 4]如何判断是否为数组
1
2
3
4var arr = [1,2,3];
#判断方法
typeof arr // "object"
Array.isArray(arr) // true
#Array实例方法
- Array.from() :方法从一个类似数组或可迭代的对象中创建一个新的数组实例。
1
2
3
4
5
6
7
8var arrs = ["a","b","c"];
Array.from(arrs);//["a","b","c"]
Array.from("welcome");
//[ 'w', 'e', 'l', 'c', 'o', 'm', 'e' ]
Array.from("123456789")
//[ '1', '2', '3', ',', '4', '5', '6', '7', '8', '9' ]
1 | var setArr = new Set(["sss","aaa"]) |
1 | #from的functions方法 |
valueOf() :方法返回数组本身
1
2var arrs = ["aaa","bbb"];
arrs.valueOf();toString() :此方法返回数组的字符串形式
1
2
3
4
5
6var arrs = ["a","b","c"];
arrs.toString();//"a,b,c"
var arrs = ["a","b","c",[1,2,3]];
console.log(arrs.toString())
//a,b,c,1,2,3Array.of() :方法创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型
Array.of()
和Array
构造函数之间的区别在于处理整数参数:Array.of(7) 创建一个具有单个元素 7 的数组,而 Array(7) 创建一个包含 7 个undefined
元素的数组。
1 | Array.of(7); // [7] |
concat() :方法用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组
1
2
3
4let arr1 = ["a", "b", "c"];
let arr2 = ["d", "e", "f"];
let arr3 = arr1.concat(arr2);
#结果["a","b","c","d", "e", "f"]copyWithin() :方法浅复制数组的一部分到同一数组中的另一个位置,并返回它,而不修改其大小
arr.copyWithin(target)
arr.copyWithin(target, start)
arr.copyWithin(target, start, end)
arr.copyWithin(目标索引, [源开始索引], [结束源索引])1
2
3
4
5
6
7
8
9target
0 为基底的索引,复制序列到该位置。如果是负数,target 将从末尾开始计算。
如果 target 大于等于 arr.length,将会不发生拷贝。如果 target 在 start 之后,复制的序列将被修改以符合 arr.length。
start
0 为基底的索引,开始复制元素的起始位置。如果是负数,start 将从末尾开始计算。
如果 start 被忽略,copyWithin 将会从0开始复制。
end
0 为基底的索引,开始复制元素的结束位置。copyWithin 将会拷贝到该位置,但不包括 end 这个位置的元素。如果是负数, end 将从末尾开始计算。
如果 end 被忽略,copyWithin 将会复制到 arr.length。
1 | [1, 2, 3, 4, 5].copyWithin(-2); |
push() :方法用于在数组的末端添加一个或多个元素,并返回添加新元素后的数组长度。注意,该方法会改变原数组。
1
2
3
4
5
6
7
8
9
10var numbers = [1, 2, 3];
numbers.push(4);
console.log(numbers);
// [1, 2, 3, 4]
#合并两个数组
var a = [1,2,3,4];
var b = [5,6];
a.push.apply(a,b)
//[1,2,3,4,5,6]pop() :方法用于删除数组的最后一个元素,并返回该元素。注意,此方法更改数组的长度,如果你在一个空数组上调用
pop()
,它返回undefined
1
2
3
4let a = [1, 2, 3];
a.length; // 3
#删除最后一个元素
a.pop(); // 3
push和pop结合使用,就构成了“后进先出”的栈结构(stack)
- join() :方法将数组(或一个
类数组对象
)的所有元素连接到一个字符串中1
2
3
4
5
6
7
8
9
10
11let a = ['1', '2', '3'];
a.join();
//默认为 ","
//"1,2,3"
a.join("");
// 分隔符 === 空字符串 ""
// "123"
a.join("-");
//"1-2-3"
若数组成员存在undefined或null或空位,会被转成空字符串1
2
3
4
5[undefined, null].join('-')
// '-'
['1',, '2'].join('-')
// '1--2'
也可以通过call
方法用于字符串1
2
3
4
5Array.prototype.join.call('hello', '-')
// "h-e-l-l-o"
var obj = { 0: 'a', 1: 'b', length: 2 };
Array.prototype.join.call(obj, '-')
// 'a-b'
- shift() :方法用于删除数组的第一个元素,并返回该元素。注意,该方法会改变原数组
shift
方法移除索引为 0 的元素(即第一个元素),并返回被移除的元素,其他元素的索引值随之减 1。如果length
属性的值为 0 (长度为 0),则返回undefined
1
2
3 let myFish = ['1', '2', '3', '4'];
myFish.shift();
// ['2', '3', '4']
shift
方法可以遍历并清空一个数组
1
2
3
4
5
6 var list = [1, 2, 3];
var ite;
while (ite = list.shift()) {
console.log(ite);
}
// 结果list:[]
unshift() :方法将一个或多个元素添加到数组的开头,并返回新数组的长度
1
2
3let a = [1, 2, 3];
a.unshift(4, 5);//添加
// [4, 5, 1, 2, 3]reverse() :方法将数组中元素的位置颠倒
1
2
3var myArray = ['1', '2', '3'];
myArray.reverse();
// ['3', '2', '1']slice() :方法返回一个从
开始
到结束
(不包括结束
)选择的数组的一部分浅拷贝
到一个新数组对象。原始数组不会被修改。arr.slice();//[0,end]
arr.slice(begin);//[begin,end]
arr.slice(begin,end)://[begin,end)
它的第一个参数begin
为起始位置(从0开始),第二个参数end
为终止位置(但该位置的元素本身不包括在内)。如果省略第二个参数,则一直返回到原数组的最后一个成员1
2
3
4
5
6
7var arr = ['a', 'b', 'c'];
arr.slice(1) // ["b", "c"]
arr.slice(1, 2) // ["b"]
arr.slice(2, 7) // ["c"],7已经超过数组的length
arr.slice() // ["a", "b", "c"]
如果是负数则表示倒数计算位置
arr.slice(-2) // ["b", "c"]
slice
方法的一个重要应用,是将类似数组的对象转为真正的数组
1
2
3
4
5
6
7 Array.prototype.slice.call({ 0: 'a', 1: 'b', length: 2 })
// ['a', 'b']
或者
function list() {
return Array.prototype.slice.call(arguments);
}
var list1 = list(1, 2, 3); // [1, 2, 3]
- splice() :方法通过删除现有元素和/或添加新元素来更改一个数组的内容
array.splice(start)
array.splice(start, deleteCount)
array.splice(start, deleteCount, item1, item2, …)1
2
3splice:第一个参数是删除的起始位置,第二个参数是被删除的元素个数。
如果后面还有更多的参数,则表示这些就是要被插入数组的新元素。
# 起始位置如果是负数,就表示从倒数位置开始删除
1 | var arr = ['a', 'b', 'c', 'd', 'e', 'f']; |
- sort() :方法在适当的位置对数组的元素进行排序,并返回数组。 sort 排序不一定是稳定的。默认排序顺序是根据字符串Unicode码点
1
2
3var fruit = ['cherries', 'apples', 'bananas'];
fruit.sort();
// ['apples', 'bananas', 'cherries']
1 | var scores = [1, 10, 21, 2]; |
1 | var things = ['word', 'Word', '1 Word', '2 Words']; |
sort可以按照自定义的方式排序,可以传入一个函数作为参数
1
2
3
4 [10111, 1101, 111].sort(function (a, b) {
return a - b;
})
// [111, 1101, 10111]
- filter() :方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素,参数函数可以接受三个参数,第一个
elem
参数是当前数组成员的值,这是必需的,后两个参数是可选的,分别是当前数组成员的位置index
和整个数组arr
filter(function (elem, index, arr) {…do somthing…})
1
2
3
4
5function isBigEnough(value) {
return value >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
//[12, 130, 44]
1 | [1, 2, 3, 4, 5].filter(function (item) { |
some() :方法测试数组中的某些元素是否通过由提供的函数实现的测试
1
2
3
4
5const asd = (element, index, array) => {
return element > 10;
}
[2, 5, 8, 1, 4].some(asd);//false
[2, 5, 8, 1, 40].some(asd);//trueevery() :方法测试数组的所有元素是否都通过了指定函数的测试,类似
some()
reduce() :方法对累加器和数组中的每个元素 (从左到右)应用一个函数,将其减少为单个值
1
2
3
4var total = [0, 1, 2, 3].reduce(function(item, value) {
return item + value;
}, 0);
// total is 6reduceRight() :方法接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值
1
2
3
4let flattened = [[0, 1], [2, 3], [4, 5]].reduceRight((a, b) => {
return a.concat(b);
}, []);
// flattened is [4, 5, 2, 3, 0, 1]indexOf(),lastIndexOf():
indexOf
方法返回给定元素在数组中第一次出现的位置,如果没有出现则返回-11
2
3let a = [2, 9, 7, 8, 9];
a.indexOf(2); // 0
a.indexOf(6); // -1
lastIndexOf
方法返回给定元素在数组中最后一次出现的位置,如果没有出现则返回-11
2
3
4
5var array = [2, 5, 9, 2];
var index = array.lastIndexOf(2);
// index is 3
index = array.lastIndexOf(7);
// index is -1
find() :方法返回数组中满足提供的测试函数的第一个元素的值。否则返回
undefined
1
2
3
4function isBigEnough(element) {
return element >= 15;
}
[12, 5, 8, 130, 44].find(isBigEnough); // 130findIndex() :方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1
1
2
3
4function isBigEnough(element) {
return element >= 15;
}
[12, 5, 8, 130, 44].findIndex(isBigEnough); // 3toLocaleString() :返回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString 方法转成字符串,这些字符串将使用一个特定语言环境的字符串(例如一个逗号 “,”)隔开
1 | var number = 1668; |
includes() :方法用来判断一个数组是否包含一个指定的值,如果是,酌情返回 true或 false
arr.includes(searchElement)
arr.includes(searchElement, fromIndex)searchElement
需要查找的元素值fromIndex
从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。1
2
3
4
5et a = [1, 2, 3];
a.includes(2);
// true
a.includes(5);
// falsefill() :方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素
arr.fill(value)
arr.fill(value, start)
arr.fill(value, start, end)value
用来填充数组元素的值start
起始索引,默认值为0end
终止索引,默认值为 this.length1
2
3var numbers = [1, 2, 3]
numbers.fill(1);
// results in [1, 1, 1]