@(JavaScript基础)
关于构造函数Array属性和方法总结
构造函数Array属性：
Array.length
Array 构造函数的 length 属性，其值为1。
Array.prototype
构造函数Array方法
Array.isArray
Array.isArray(obj):
描述:
假如一个变量是数组则返回true，否则返回false
参数:
obj
返回值:
boolean值
例子:
// 下面的函数调用都返回 true
Array.isArray([]);
Array.isArray([1]);
Array.isArray(new Array());
// 鲜为人知的事实：其实 Array.prototype 也是一个数组。
Array.isArray(Array.prototype);
// 下面的函数调用都返回 false
Array.isArray();
Array.isArray({});
Array.isArray(null);
Array.isArray(undefined);
Array.isArray(17);
Array.isArray('Array');
Array.isArray(true);
Array.isArray(false);
Array.isArray({ __proto__: Array.prototype })
Array.of
Array.of(element0[, element1[, ...[, elementN]]]):
描述:
方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型
参数:
elementN
任意个参数，将按顺序成为返回数组中的元素。
返回值
新的 Array 实例
例子:
Array.of(1); // [1]
Array.of(1, 2, 3); // [1, 2, 3]
Array.from
Array.from(arrayLike, mapFn, thisArg):
描述:
从类数组或者迭代对象（iterable object）中创建一个新的数组实例,
Array.from(obj, mapFn, thisArg) 就相当于 Array.from(obj).map(mapFn, thisArg)
伪数组对象（拥有一个 length 属性和若干索引属性的任意对象）
可迭代对象（可以获取对象中的元素,如 Map和 Set 等）
参数:
arrayLike
想要转换成数组的伪数组对象或可迭代对象。
mapFn (可选参数)
如果指定了该参数，新数组中的每个元素会执行该回调函数。
thisArg (可选参数)
可选参数，执行回调函数 mapFn 时 this 对象
返回值:
一个新的数组实例
例子:
Array.from('foo'); // ["f", "o", "o"]
const obj={
name:'lee',
};
const forEach=item=>item+=item;
const arrayLike={
0:'name',
1:'age',
length:2
}
Array.from(arrayLike,forEach,obj); // ["namename", "ageage"]
构造函数Array实例方法
数组的方法也可以分为增删改查：
查找：
// 以下方法会返回该字符串是否存在某特定字符串的boolean值
----------------------------------------------------------------------------
Array.prototype.includes(searchElement, fromIndex)
描述:
判断当前数组是否包含某指定的值，如果是返回 true，否则返回 false
参数:
searchElement:
需要查找的元素值。
fromIndex:
从该索引处开始查找 searchElement
返回值:
boolean值
例子:
[1, 2, 3].includes(2); // true
[1, 2, 3].includes(3, 2); // true
----------------------------------------------------------------------------
// 以下方法会返回某元素在数组中的索引
----------------------------------------------------------------------------
Array.prototype.indexOf(searchElement[, fromIndex = 0]):
描述:
返回数组中第一个与指定值相等的元素的索引，如果找不到这样的元素，则返回 -1
参数:
searchElement:
要查找的元素
fromIndex:
开始查找的位置
返回值:
元素所在的索引
例子:
const arr=[1,2,3,4,5,6];
arr.indexOf(5); // 4
arr.indexOf(6,3); // 5
----------------------------------------------------------------------------
Array.prototype.lastIndexOf(searchElement[, fromIndex = arr.length-1]):
描述:
返回数组中第一个与指定值相等的元素的索引，如果找不到这样的元素，则返回 -1
参数:
searchElement:
要查找的元素
fromIndex:
开始查找的位置
返回值:
元素所在的索引
例子:
const arr=[1,2,3,4,5,6];
arr.lastIndexOf(5); // 4
arr.lastIndexOf(2,3); // 1
arr.lastIndexOf(6,3); // -1
----------------------------------------------------------------------------
Array.prototype.findIndex(callback,thisArg):
描述:
找到第一个满足测试函数的元素并返回那个元素的索引，如果找不到，则返回 -1
参数:
callback
针对数组中的每个元素, 都会执行该回调函数, 执行时会自动传入下面三个参数:
element
当前元素。
index
当前元素的索引。
array
调用findIndex的数组。
返回值:
强制为true的某元素
thisArg
执行callback时作为this对象的值
返回值:
满足回调函数元素的索引
例子:
const foo=(item,index)=>{
if(item%2===0){
return false;
}else{
return item>10;
}
}
[6,9,10,11].findIndex(foo); // 3
[6,9,10,20].findIndex(foo); // -1
----------------------------------------------------------------------------
// 以下方法会返回数组中的某元素
----------------------------------------------------------------------------
Array.prototype.find(callback[, thisArg])
描述:
找到第一个满足测试函数的元素并返回那个元素的值，如果找不到，则返回 undefined
参数:
callback
在数组每一项上执行的函数，接收 3 个参数：
element
当前遍历到的元素。
index
当前遍历到的索引。
array
数组本身
返回值:
强制为true的某元素
thisArg 可选
指定 callback 的 this 参数
返回值:
当某个元素通过 callback 的测试时，返回数组中的一个值，否则返回 undefined
例子:
const foo=(item,index)=>{
if(item%2===0){
return false;
}else{
return item>10;
}
}
[6,9,10,11].find(foo); // 11
[6,20,10,20].find(foo); // undefined
----------------------------------------------------------------------------
增加:
// 该方法向数组开头添加元素
----------------------------------------------------------------------------
Array.prototype.unshift(element1, ..., elementN):
描述:
将一个或多个元素添加到数组的开头，并返回新数组的长度
参数:
elementN
返回值:
新数组的长度
例子:
const arr=[1,2,3];
arr.unshift(0); // 4
const arr2=[1,2,3];
arr2.unshift(4,5,6); // 6
----------------------------------------------------------------------------
// 该方法向数组尾部添加元素
----------------------------------------------------------------------------
Array.prototype.push(element1, ..., elementN):
描述:
在数组的末尾增加一个或多个元素，并返回数组的新长度
参数:
elementN
返回值:
新数组的长度
----------------------------------------------------------------------------
// 该方法用特定值填充数组特定位置
----------------------------------------------------------------------------
Array.prototype.fill(value, start, end):
描述:
用一个固定值填充一个数组中从起始索引到终止索引内的全部元素
参数:
value
start
end
返回值:
修改后的数组
例子:
[1,2,3,4].fill(5); // [5,5,5,5]
[1,2,3,4].fill(5,2); // [1,2,5,5]
[1,2,3,4].fill(5,1,4); // [1,5,5,5]
----------------------------------------------------------------------------
编辑
总结:
splice() 方法与 slice() 方法的作用是不同的，
splice() 方法会直接对数组进行修改,
slice()方法会返回截取后的数组
----------------------------------------------------------------------------
Array.prototype.slice(begin,end)
描述:
抽取当前数组中的一段元素组合成一个新数组
参数:
begin:
提取数组的起始位置，默认值为0
end:
提取数组的结束位置(该位置取不到)，默认值为数组长度
返回值:
一个含有提取元素的新数组
例子:
const names=['panda','cat','dog','monkey'];
names.slice(); // ["panda", "cat", "dog", "mokey"]
names.slice(1); // ["cat", "dog", "mokey"]
names.slice(1,3); // ['cat','dog']
----------------------------------------------------------------------------
Array.prototype.splice(start, deleteCount, item1, item2, ...):
描述:
通过删除现有元素和/或添加新元素来更改一个数组的内容
参数:
start:
指定修改的开始位置（从0计数）
若只使用start参数而不使用deleteCount、item，如：array.splice(start) ，
表示删除[start，end]的元素
deleteCount:
整数，表示要移除的数组元素的个数
item1, item2, ... :
要添加进数组的元素,从start 位置开始
返回值:
由被删除的元素组成的一个数组。
如果只删除了一个元素，则返回只包含一个元素的数组。
如果没有删除元素，则返回空数组
例子:
[1,2,3,4,5].splice(3); // [4,5]
[1,2,3,4,5].splice(2,3); // [3,4,5]
const arr=[1,2,3,4,5];
arr.splice(2,3,6);
// [3,4,5]
// arr: [1,2,6]
arr.splice(2,4,6,7,8,9,0);
// [3, 4, 5]
// [1, 2, 6, 7, 8, 9, 0]
----------------------------------------------------------------------------
// 该方法会对数组内部元素进行复制
----------------------------------------------------------------------------
Array.prototype.copyWithin(target, start, end):
描述:
浅复制数组的一部分到同一数组中的另一个位置，并返回它，而不修改其大小
参数:
target:
0 为基底的索引，复制序列到该位置。如果是负数，target 将从末尾开始计算
start:
0 为基底的索引，开始复制元素的起始位置。如果是负数，start 将从末尾开始计算
如果 start 被忽略，copyWithin 将会从0开始复制
end:
0 为基底的索引，开始复制元素的结束位置
如果 end 被忽略，copyWithin 将会复制到 arr.length
返回值:
改变了的数组
例子:
[1,2,3,4,5].copyWithin(-2); // [1,2,3,1,2]
[1,2,3,4,5].copyWithin(2,1); // [1,2,2,3,4]
[1,2,3,4,5].copyWithin(2,1,3); // [1,2,2,3,5]
----------------------------------------------------------------------------
// 该方法会反转数组
----------------------------------------------------------------------------
Array.prototype.reverse():
描述:
颠倒数组中元素的排列顺序，即原先的第一个变为最后一个，原先的最后一个变为第一个,然后依次颠倒
无参:
返回值:
颠倒顺序之后的新数组
例子:
['hello','world','today','tomorrow','yesterday'].reverse();
// ["yesterday", "tomorrow", "today", "world", "hello"]
----------------------------------------------------------------------------
// 该方法会对数组进行排序
----------------------------------------------------------------------------
Array.prototype.sort(compareFunction)
描述:
在适当的位置对数组的元素进行排序，并返回数组。
默认排序顺序是根据字符串Unicode码点
参数
compareFunction
可选。用来指定按某种顺序进行排列的函数。
如果省略，元素按照转换为的字符串的诸个字符的Unicode位点进行排序
如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前；
如果 compareFunction(a, b) 等于 0 ， a 和 b 的相对位置不变
如果 compareFunction(a, b) 大于 0 ， b 会被排列到 a 之前
返回值:
排序后的数组
例子:
['atom','diy','coo','bar'].sort(); // ["atom", "bar", "coo", "diy"]
function compare(val1,val2){
return val1-val2;
};
[2,9,4,7,5].sort(compare); // [2, 4, 5, 7, 9]
const items=[
{name:'lee',age:18},
{name:'panda',age:9},
{name:'cat',age:15},
{name:'dog',age:6},
{name:'monkey',age:20},
];
function compareAge(val1,val2){
return val1.age-val2.age;
};
items.sort(compareAge);
// [
// {name:'dog',age:6},
// {name:'panda',age:9},
// {name:'cat',age:15},
// {name:'lee',age:18},
// {name:'monkey',age:20},
// ]
----------------------------------------------------------------------------
// 合并数组
----------------------------------------------------------------------------
Array.prototype.concat(value1[, value2[, ...[, valueN]]]):
描述:
用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组
参数:
valueN:
将数组和/或值连接成新数组
返回值:
新的 Array 实例
例子:
const arr1=[1,2,3],
arr2=[4,5,6],
arr3=[7,8,9];
arr1.concat(arr2,arr3);
// [1,2,3,4,5,6,7,8,9];
arr1.concat(0,arr2,arr3);
// [1,2,3,0,4,5,6,7,8,9]
----------------------------------------------------------------------------
删除:
// 该方法删除数组中第一个元素
----------------------------------------------------------------------------
Array.prototype.shift()
描述:
从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度
无参:
返回值:
[1,2,3,4,5].shift(); // 1
----------------------------------------------------------------------------
// 该方法删除数组中最后一个元素
----------------------------------------------------------------------------
Array.prototype.pop():
描述:
从数组中删除最后一个元素，并返回该元素的值。此方法更改数组的长度
无参
返回值:
从数组中删除的元素
例子:
[1,2,3,4].pop(); // 4
----------------------------------------------------------------------------
以下数组方法与字符串有关
----------------------------------------------------------------------------
Array.prototype.join(separator):
描述:
将数组（或一个类数组对象）的所有元素连接到一个字符串中
参数
separator:
指定一个字符串来分隔数组的每个元素。
如果需要(separator)，将分隔符转换为字符串。
如果省略()，数组元素用逗号分隔。默认为 ","。
如果separator是空字符串("")，则所有元素之间都没有任何字符
返回值:
一个所有数组元素连接的字符串
例子:
['h','e','l','l','o'].join(); // "h,e,l,l,o"
['h','e','l','l','o'].join(""); // "hello"
----------------------------------------------------------------------------
----------------------------------------------------------------------------
Array.prototype.toString()
描述:
返回一个由所有数组元素组合而成的字符串,默认以','进行分割
遮蔽了原型链上的 Object.prototype.toString() 方法
无参:
返回值:
返回一个字符串，表示指定的数组及其元素
例子:
const names=['panda','cat','dog','mokey'];
names.toString(); // "panda,cat,dog,mokey"
----------------------------------------------------------------------------
----------------------------------------------------------------------------
Array.prototype.toLocaleString()
描述:
返回一个由所有数组元素组合而成的本地化后的字符串。
数组中的元素将会使用各自的 toLocaleString 方法：
Object: Object.prototype.toLocaleString()
Number: Number.prototype.toLocaleString()
Date: Date.prototype.toLocaleString()
无参:
返回值:
返回一个由所有数组元素组合而成的本地化后的字符串
----------------------------------------------------------------------------
遍历方法
Array.prototype.forEach
Array.prototype.forEach(callback[, thisArg]):
描述:
为数组中的每个元素执行一次回调函数
参数:
callback:
为数组中每个元素执行的函数，该函数接收三个参数：
currentValue(当前值):
数组中正在处理的当前元素。
index(索引):
数组中正在处理的当前元素的索引。
array:
forEach()方法正在操作的数组。
thisArg可选
当执行回调 函数时用作this的值(参考对象)
返回值:
undefined
例子:
const arr=[1,2,3,4,5];
const newArr=[];
arr.forEach((item,index)=>{
if(index%2===0){
item+=item;
newArr.push(item);
}
if(index%2!==0){
item*=item;
newArr.push(item)
}
});
console.log(newArr); // [2, 4, 6, 16, 10]
// 利用类创建对象,而且forEach中参数以箭头函数方式传入
class Counter {
constructor(){
this.sum=0;
this.count=0;
}
add(array){
array.forEach(item=>{
this.sum+=item;
++this.count
})
}
}
const obj=new Counter();
obj.add([1,2,3,4,5]);
obj.sum; // 15
obj.count; // 5
// 利用类创建对象,而且forEach中参数以函数方式传入
class Counter {
constructor(){
this.sum=0;
this.count=0;
}
add(array){
array.forEach(function(item){
this.sum+=item;
++this.count
})
}
}
const obj=new Counter();
obj.add([1,2,3,4,5]);
obj.sum; // Uncaught TypeError: Cannot read property 'sum' of undefined
// 利用类创建对象,而且forEach中参数以箭头函数方式传入，并传入this
class Counter {
constructor(){
this.sum=0;
this.count=0;
}
add(array){
array.forEach(function(item){
this.sum+=item;
++this.count
},this)
}
}
const obj=new Counter();
obj.add([1,2,3,4,5]);
obj.sum; // 15
Array.prototype.every
Array.prototype.every(callback[, thisArg])
描述:
测试数组的所有元素是否都通过了指定函数的测试
如果数组中的每个元素都满足测试函数，则返回 true，否则返回 false
参数:
callback:
为数组中每个元素执行的函数，该函数接收三个参数：
currentValue(当前值):
数组中正在处理的当前元素。
index(索引):
数组中正在处理的当前元素的索引。
array:
forEach()方法正在操作的数组。
thisArg可选
当执行回调 函数时用作this的值(参考对象)
返回值:
boolean值
例子:
const compare=(item,index)=>{
return item>2;
};
[1,2,3,4,5].every(compare); // false
[3,4,5,6,7].every(compare); // true
Array.prototype.some
Array.prototype.some(callback[, thisArg])
描述:
如果数组中至少有一个元素满足测试函数，则返回 true，否则返回 false
参数:
callback:
为数组中每个元素执行的函数，该函数接收三个参数：
currentValue(当前值):
数组中正在处理的当前元素。
index(索引):
数组中正在处理的当前元素的索引。
array:
forEach()方法正在操作的数组。
thisArg可选
当执行回调 函数时用作this的值(参考对象)
返回值:
boolean值
例子:
const compare=(item,index)=>{
return item>4;
};
[1,2,3,4,0].some(compare); // false
[3,4,5,6,7].some(compare); // true
Array.prototype.filter
Array.prototype.filter(callback[, thisArg])
描述:
将所有在过滤函数中返回 true 的数组元素放进一个新数组中并返回
参数:
callback:
为数组中每个元素执行的函数，该函数接收三个参数：
currentValue(当前值):
数组中正在处理的当前元素。
index(索引):
数组中正在处理的当前元素的索引。
array:
forEach()方法正在操作的数组。
thisArg可选
当执行回调 函数时用作this的值(参考对象)
返回值:
一个新的通过测试的元素的集合的数组
例子:
const compare=(item,index)=>{
return item>2;
};
[1,2,3,4,0].filter(compare); // [3,4]
Array.prototype.map
Array.prototype.map(callback[, thisArg])
描述:
返回一个由回调函数的返回值组成的新数组
参数:
callback:
为数组中每个元素执行的函数，该函数接收三个参数：
currentValue(当前值):
数组中正在处理的当前元素。
index(索引):
数组中正在处理的当前元素的索引。
array:
forEach()方法正在操作的数组。
thisArg可选
当执行回调 函数时用作this的值(参考对象)
返回值:
一个新数组，每个元素都是回调函数的结果
例子:
['1', '2', '3'].map( str => parseInt(str) ); // [1,2,3]
Array.prototype.keys
Array.prototype.keys()
描述:
返回一个数组迭代器对象，该迭代器会包含所有数组元素的键
无参:
返回值:
一个新的 Array 迭代器对象
例子:
const arr = ["a", "b", "c"];
const iterator = arr.keys();
console.log(iterator.next()); // { value: 0, done: false }
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: undefined, done: true}
Array.prototype.values
Array.prototype.values()
描述:
返回一个数组迭代器对象，该迭代器会包含所有数组元素的值
谷歌，火狐暂未实现
Array.prototype.entries
Array.prototype.entries()
描述:
返回一个数组迭代器对象，该迭代器会包含所有数组元素的键值对
无参:
返回值:
一个新的 Array 迭代器对象
例子:
const arr = ["a", "b", "c"];
const iterator = arr.entries();
console.log(iterator.next()); // { value:[0,'a'], done:false}
console.log(iterator.next()); // { value:[1,'b'], done:false}
console.log(iterator.next()); // { value:[2,'c'], done:false}
console.log(iterator.next()); // { value:undefined, done:done}
Array.prototype.reduce
Array.prototype.reduce(callback[, initialValue]):
描述:
从左到右为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，
并返回最后一次回调函数的返回值
参数:
callback
执行数组中每个值的函数，包含四个参数：
accumulator
累加器累加回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue
currentValue
数组中正在处理的元素。
currentIndex
数组中正在处理的当前元素的索引。 如果提供了initialValue，则索引号为0，否则为索引为1。
array
调用reduce的数组
返回值:
强制返回accumulator,否则为undefined
initialValue
用作第一个调用 callback的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素
返回值:
函数累计处理的结果
例子:
let arr=[];
const add=(init,item,index)=>{
if(item%2===0){
init+=item;
arr.push(index);
return init;
}else{
return init
}
};
let sum=[1,2,3,4,5,6].reduce(add);
console.log(sum); // 13
console.log(arr); // [1, 3, 5]
[7,8,9,10].reduce(add,sum); // 31
Array.prototype.reduceRight
Array.prototype.reduceRight(callback[, initialValue])
描述:
从右到左为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中传给下次回调函数，
并返回最后一次回调函数的返回值
参数:
callback
执行数组中每个值的函数，包含四个参数：
accumulator
累加器累加回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue
currentValue
数组中正在处理的元素。
currentIndex
数组中正在处理的当前元素的索引。 如果提供了initialValue，则索引号为0，否则为索引为1。
array
调用reduce的数组
返回值:
强制返回accumulator,否则为undefined
initialValue
用作第一个调用 callback的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素
返回值:
函数累计处理的结果
例子:
let arr=[];
const add=(init,item,index)=>{
if(item%2===0){
init+=item;
arr.push(index);
return init;
}else{
return init
}
};
let sum=[1,2,3,4,5,6].reduceRight(add);
console.log(sum); // 12
console.log(arr); // [3,1]
[7,8,9,10].reduceRight(add,sum); // 31
对方法一些特性进行总结：
以下方法会改变调用他们自身的对象的值：
Array.prototype.copyWithin()
Array.prototype.fill()
Array.prototype.pop()
Array.prototype.push()
Array.prototype.reverse()
Array.prototype.shift()
Array.prototype.sort()
Array.prototype.splice()
Array.prototype.unshift()
以下方法绝对不会改变调用它们的对象的值，只会返回一个新的数组或者返回一个其它的期望值：
Array.prototype.concat()
Array.prototype.includes()
Array.prototype.join()
Array.prototype.slice()
Array.prototype.toString()
Array.prototype.toLocaleString()
Array.prototype.indexOf()
Array.prototype.lastIndexOf()
与字符串共有的方法
Array.prototype.includes()
Array.prototype.slice()
Array.prototype.concat()
Array.prototype.toString()
关于数组遍历方法返回值总结:
Array.prototype.forEach(callback[, thisArg])
无返回值
Array.prototype.every(callback[, thisArg])
返回boolean值
Array.prototype.some(callback[, thisArg])
返回boolean值
Array.prototype.filter(callback[, thisArg])
返回 true 的数组元素组成的新数组
Array.prototype.map(callback[, thisArg])
返回一个由回调函数的返回值组成的新数组。
Array.prototype.keys()
返回一个数组迭代器对象，该迭代器会包含所有数组元素的键。
Array.prototype.values()
返回一个数组迭代器对象，该迭代器会包含所有数组元素的值
Array.prototype.entries()
返回一个数组迭代器对象，该迭代器会包含所有数组元素的键值对。
Array.prototype.reduce()
Array.prototype.reduceRight()
Array.prototype[@@iterator]()