数组的创建方法
1、常规方式:
var myCars=new Array();
myCars[0]="Saab";
myCars[1]="Volvo";
myCars[2]="BMW";
2、简洁方式:
var myCars=new Array("Saab","Volvo","BMW");
3、字面:
var myCars=["Saab","Volvo","BMW"];
数组的属性
1、constructor :返回对象的构造函数
返回值:函数的引用,不是函数名:
数组 constructor 属性返回 function Array() { [native code] }
数字 constructor 属性返回 function Number() { [native code] }
字符串 constructor 属性返回 function String() { [native code] }
如果一个变量是数组你可以使用 constructor 属性来定义。
2、length :设置或返回数组中元素的数目
3、prototype :向对象添加属性和方法
当构建一个属性,所有的数组将被设置属性,它是默认值。
Array.prototype.name=value
在构建一个方法时,所有的数组都可以使用该方法。
Array.prototype.myUcase=function()
{
for (let i=0;i<this.length;i++)
{
this[i]=this[i].toUpperCase(); //小写转大写
}
}
var fruits=["Banana","Orange","Apple","Mango"];
fruits.myUcase(); //数组输出值:BANANA,ORANGE,APPLE,MANGO
数组的对象方法
1、from() :通过拥有 length 属性的对象或可迭代的对象来返回一个数组
如果对象是数组返回 true,否则返回 false
boole = Array.from(object, mapFunction, thisValue);
<!--
object 必需,要转换为数组的对象。
mapFunction 可选,数组中每个元素要调用的函数。
thisValue 可选,映射函数(mapFunction)中的 this 对象。
-->
from() 的用处:
(1)、数组去重
let arr = Array.from(new Set([1, 2, 1, 2]))
console.log(arr) //[1, 2]
(2)、将一个伪数组转换为数组
let obj = {
'0': 1, // '0':1 中的'0'将转换为 key
'1': 2,
'2':3,
'length': 4, // length 规定了转换的数组有多长
}
let newObj= Array.from(obj, item => {return item});
console.log(newObj); // 输出:[ 1, 2, 3, undefined ]
let obj = {
'a': 1,
'b': 2,
'c':3,
'length': 4,
}
let newObj = Array.from(obj, item => {return item})
console.log(newObj); //key值为非数字所以无效,但规定了 length 所以输出: 四个 undefined
2、fill() :将一个固定值替换数组的元素
array.fill(value, start, end);
<!--
value 必需。填充的值。
start 可选。开始填充位置。
end 可选。停止填充位置 (默认为 array.length)
-->
3、flat() 方法按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
flat() 方法返回一个包含将数组与子数组中所有元素的新数组。
flat() 方法会移除数组中的空项
newArray = array.flat(depth)
<!--
depth 指定要提取嵌套数组的结构深度,默认值为 1。
-->
// 使用 Infinity,可展开任意深度的嵌套数组
var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
4、flatMap() 方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。结构深度 depth 值为 1。
与 map 连着深度值为 1 的 flat 几乎相同,但 flatMap 通常在合并成一种方法的效率稍微高一些。
// 箭头函数
flatMap((currentValue) => { /* … */ } )
flatMap((currentValue, index) => { /* … */ } )
flatMap((currentValue, index, array) => { /* … */ } )
// 回调函数
flatMap(callbackFn)
flatMap(callbackFn, thisArg)
// 行内回调函数
flatMap(function(currentValue) { /* … */ })
flatMap(function(currentValue, index) { /* … */ })
flatMap(function(currentValue, index, array){ /* … */ })
flatMap(function(currentValue, index, array) { /* … */ }, thisArg)
<!--
callback:可以生成一个新数组中的元素的函数,可以传入三个参数:
currentValue:当前正在数组中处理的元素
index:可选的。数组中正在处理的当前元素的索引。
array:可选的。被调用的 map 数组
thisArg 可选的。执行 callback 函数时使用的this 值。
返回值: 数组。
-->
var arr1 = [1, 2, 3, 4];
arr1.map(x => [x * 2]);
// [[2], [4], [6], [8]]
arr1.flatMap(x => [x * 2]);
// [2, 4, 6, 8]
// only one level is flattened
arr1.flatMap(x => [[x * 2]]);
// [[2], [4], [6], [8]]
let arr1 = ["it's Sunny in", "", "California"];
arr1.map(x => x.split(" "));
// [["it's","Sunny","in"],[""],["California"]]
arr1.flatMap(x => x.split(" "));
// ["it's","Sunny","in", "", "California"]
var arr = [1, 2, 3, 4];
arr.flatMap(x => [x, x * 2]);
// is equivalent to
arr.reduce((acc, x) => acc.concat([x, x * 2]), []);
// [1, 2, 2, 4, 3, 6, 4, 8]
注意:这是低效的,并且应该避免大型阵列:在每次迭代中,它创建一个必须被垃圾收集的新临时数组,并且它将元素从当前的累加器数组复制到一个新的数组中,而不是将新的元素添加到现有的数组中。
5、concat():连接两个或多个数组
newArray = array1.concat(array2, array3,..., arrayX)
6、isArray() :判断一个对象是否为数组
boole = Array.isArray(obj)
7、sort() :对数组的元素进行排序。
默认排序顺序为按字母升序。
注意:当数字是按字母顺序排列时"40"将排在"5"前面。
使用数字排序,你必须通过一个函数作为参数来调用。
函数指定数字是按照升序还是降序排列。
这种方法会改变原始数组!
newArray = array.sort(sortfunction)
<!--
sortfunction 可选。规定排序顺序。必须是函数。
-->
数字排序(数字和升序):
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b});
数字排序(数字和降序):
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return b-a});
数字排序 (字母和降序):
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
fruits.reverse();
array.copyWithin(target, start, end);
<!--
target 必需。复制到指定目标索引位置。
start 可选。元素复制的起始位置。
end 可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。
-->
9、splice() :添加或删除数组中的元素
如果删除一个元素,则返回一个元素的数组。 如果未删除任何元素,则返回空数组。
array.splice(index,howmany,item1,.....,itemX)
<!--
index 必需。规定从何处添加/删除元素。
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany 可选。规定应该删除多少元素。必须是数字,但可以是 "0"。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, ..., itemX 可选。要添加到数组的新元素
-->
10、entries() :返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)。
迭代对象中数组的索引值作为 key, 数组元素作为 value。
object = array.entries();
object.next().value; //第一个数组键值对
object.next().value; //第二个数组键值对
object.next().value; //第三个数组键值对
[0, "Banana"]
[1, "Orange"]
[2, "Apple"]
11、some() :检测数组中的元素是否满足指定条件(函数提供)。
some() 方法会依次执行数组的每个元素:
- 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
- 如果没有满足条件的元素,则返回false。
boole = array.some(function(currentValue,index,arr),thisValue)
12、every() :用于检测数组所有元素是否都符合指定条件(通过函数提供)
- 检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
- 如果所有元素都满足条件,则返回 true。
注意: every() 不会对空数组进行检测。
boole = array.every(function(currentValue,index,arr){}, thisValue);
<!--
currentValue 必须。当前元素的值
index 可选。当前元素的索引值
arr 可选。当前元素属于的数组对象
thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。
如果省略了 thisValue ,"this" 的值为 "undefined"
-->
13、forEach() :用于调用数组的每个元素,并将元素传递给回调函数。
array.forEach(callbackFn(currentValue, index, arr), thisValue); //返回值:undefined
forEach() 的 continue 和 break
continue 实现 :
var arr = [1, 2, 3, 4, 5];
arr.forEach(function (item) {
if (item === 3) {
return; //结束循环的这一次
}
console.log(item);
});
var arr = [1, 2, 3, 4, 5];
arr.some(function (item) {
if (item === 2){
return; // 返回false,结束循环的这一次,但不中断循环
}
console.log(item);
});
break 实现:
var arr = [1, 2, 3, 4, 5];
arr.every(function (item) {
console.log(item);
return item !== 3; //返回false,中断循环
});
try {
var array = ["first","second","third","fourth"]; // 执行到第3次,结束循环
array.forEach(function(item,index){
if (item == "third") {
throw new Error("EndIterative");
}
alert(item); // first,sencond
});
} catch(e) {
if(e.message!="EndIterative") throw e;
};
14、map() :返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
newArray = array.map(function(currentValue,index,arr), thisValue)
15、 includes() :判断一个数组是否包含一个指定的值,如果是返回 true,否则false
boole = arr.includes(searchElement, fromIndex)
<!--
searchElement 必须。需要查找的元素值。
fromIndex 可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。
-->
如果 fromIndex 为负值,计算出的索引将作为开始搜索searchElement的位置。如果计算出的索引小于 0,则整个数组都会被搜索。
16、at() :接收一个整数值并返回该索引对应的元素,允许正数和负数
如果找不到指定的索引,则返回 undefined
at() 方法是通用的。其仅期望 this 具有 length 属性和以整数为键的属性。
item = array.at(index)
在非数组对象上调用 at():at() 方法读取 this 的 length 属性并计算需要访问的索引。
const arrayLike = {
length: 2,
0: "a",
1: "b",
};
console.log(Array.prototype.at.call(arrayLike, -1)); // "b"
17、slice() :从已有的数组中返回选定的元素。
slice() 可提取字符串的某个部分,并以新的字符串返回被提取的部分。
newArray = array.slice(start, end)
18、 filter() :创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素
newArray = array.filter(function(currentValue,index,arr), thisValue);
19、find() :返回通过测试(函数内判断)的数组的第一个元素的值,如果没有符合条件的元素返回 undefined。
firstFindedValue = array.find(function(currentValue, index, arr),thisValue);
20、findIndex() :返回传入一个测试条件(函数)符合条件的第一个元素位置,如果没有符合条件的元素返回 -1。
firstFindedIndex = array.findIndex(function(currentValue, index, arr), thisValue);
21、 indexOf() :可返回数组中某个指定的元素位置
如果找到一个 item,则返回 item 的第一次出现的位置。
如果在数组中没找到指定元素则返回 -1。
key = array.indexOf(item,start)
<!--
item 必须。查找的元素。
start 可选的整数参数。规定在数组中开始检索的位置。如省略该参数,则将从字符串的首字符开始检索。
-->
22、lastIndexOf() :返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找。
如果在数组中没找到指定元素则返回 -1。
key = array.lastIndexOf(item,start)
23、reduce() :接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
outcome = array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
<!--
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
initialValue 可选。传递给函数的初始值
outcome 计算结果
-->
24、reduceRight() :从数组的末尾向前将数组中的数组项做累加
outcome = array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)
25、toString() :把数组转换为字符串,并返回结果。
注意: 数组中的元素之间用逗号分隔。
string = array.toString()
26、valueOf() :返回 Array 对象的原始值。
该原始值由 Array 对象派生的所有对象继承。
values = array.valueOf()
27、join() :把数组中的所有元素转换一个字符串。
string = array.join(separator)
<!--
separator 可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。
-->
28、of() :将一组值转换为数组,不考虑参数的数量或类型。
Array.of() 和 Array() 构造函数之间的区别在于对单个参数的处理:Array.of(7) 创建一个具有单个元素 7 的数组,而 Array(7) 创建一个 length 为 7 的空数组。
如果对象是数组返回 true,否则返回 false。
Array.of(element0)
Array.of(element0, element1, /* … ,*/ elementN)
<!--
element0 必需,要转换为数组的元素。
element1, /* … ,*/ elementN 可选,要转换为数组的元素。
-->
29、keys() :从数组创建一个包含数组键的可迭代对象
如果对象是数组返回 true,否则返回 false。
object = array.keys()
object.next().value //第一个键值
object.next().value //第一个键值
... ...
30、pop() :删除数组的最后一个元素并返回删除的元素。
注意:此方法改变数组的长度!
lastItem = array.pop()
31、shift() :把数组的第一个元素从其中删除,并返回第一个元素的值。
removeFirstItem = array.shift()
32、push() :向数组的末尾添加一个或多个元素,并返回新的长度。
arrNewLength = array.push(item1, item2, ..., itemX)
33、unshift() :向数组的开头添加一个或更多元素,并返回新的长度
newArrLength = array.unshift(item1,item2, ..., itemX)
34、reverse() :颠倒数组中元素的顺序。
newArray = array.reverse()