Array
Array.prototype
属性表示 Array
构造函数的原型,并允许您向所有Array对象添加新的属性和方法。
Array
实例继承自 Array.prototype 。与所有构造函数一样,您可以更改构造函数的原型对象,以对所有 Array
实例进行更改
鲜为人知的事实:Array.prototype
本身也是一个 Array
。
Array.isArray(Array.prototype);
// true
-
concat:
concat() 方法用于连接两个或多个数组。
该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
-
copyWithin:
copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。
它接受三个参数。 target (必需):从该位置开始替换数据。 start (可选):从该位置开始读取数据,默认为 0 。如果为负值,表示倒数。 end (可选):到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒数。 这三个参数都应该是数值,如果不是,会自动转为数值。
-
entries:
**Object.entries()**
方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用for...in
循环遍历该对象时返回的顺序一致(区别在于 for-in 循环还会枚举原型链中的属性)。 -
every:
every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。
every() 方法使用指定函数检测数组中的所有元素:
- 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
- 如果所有元素都满足条件,则返回 true。
注意: every() 不会对空数组进行检测。
注意: every() 不会改变原始数组。
var ages = [32, 33, 16, 40]; function checkAdult(age) { return age >= 18; } function myFunction() { document.getElementById("demo").innerHTML = ages.every(checkAdult); } //输出结果 false
-
filter
**fill()**
方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。const array1 = [1, 2, 3, 4]; // fill with 0 from position 2 until position 4 console.log(array1.fill(0, 2, 4)); // expected output: [1, 2, 0, 0] // fill with 5 from position 1 console.log(array1.fill(5, 1)); // expected output: [1, 5, 5, 5] console.log(array1.fill(6)); // expected output: [6, 6, 6, 6]
语法
arr.fill(value[, start[, end]])
参数
-
value
用来填充数组元素的值。
-
start
可选起始索引,默认值为0。
-
end
可选终止索引,默认值为
this.length
。
返回值
修改后的数组。
-
-
find:
find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。
find() 方法为数组中的每个元素都调用一次函数执行:
- 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
- 如果没有符合条件的元素返回 undefined
注意: find() 对于空数组,函数是不会执行的。
注意: find() 并没有改变数组的原始值。
var ages = [3, 10, 18, 20]; function checkAdult(age) { return age >= 18; } function myFunction() { document.getElementById("demo").innerHTML = ages.find(checkAdult); } //输出:18
-
findIndex:
findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。
findIndex() 方法为数组中的每个元素都调用一次函数执行:
- 当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
- 如果没有符合条件的元素返回 -1
注意: findIndex() 对于空数组,函数是不会执行的。
注意: findIndex() 并没有改变数组的原始值。
-
flat:
-
flatMap:
flat()
和flatMap()
本质上就是是归纳(reduce) 与 合并(concat)的操作。flat()
flat()
方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。//flat()方法最基本的作用就是数组降维 var arr1 = [1, 2, [3, 4]]; arr1.flat(); // [1, 2, 3, 4] var arr2 = [1, 2, [3, 4, [5, 6]]]; arr2.flat(); // [1, 2, 3, 4, [5, 6]] var arr3 = [1, 2, [3, 4, [5, 6]]]; arr3.flat(2); // [1, 2, 3, 4, 5, 6] //使用 Infinity 作为深度,展开任意深度的嵌套数组 arr3.flat(Infinity); // [1, 2, 3, 4, 5, 6]
flatMap()
flatMap()
方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。它与 map 和 深度值1的 flat 几乎相同,但 flatMap 通常在合并成一种方法的效率稍微高一些。 这里我们拿map方法与flatMap方法做一个比较。var arr1 = [1, 2, 3, 4]; arr1.map(x => [x * 2]); // [[2], [4], [6], [8]] arr1.flatMap(x => [x * 2]); // [2, 4, 6, 8] // 只会将 flatMap 中的函数返回的数组 “压平” 一层 arr1.flatMap(x => [[x * 2]]); // [[2], [4], [6], [8]]
-
forEach:
**forEach()**
方法对数组的每个元素执行一次给定的函数。const array1 = ['a', 'b', 'c']; array1.forEach(element => console.log(element)); // expected output: "a" // expected output: "b" // expected output "c"
-
includes:
includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
[1, 2, 3].includes(2); // true [1, 2, 3].includes(4); // false [1, 2, 3].includes(3, 3); // false
-
indexOf:
indexOf() 方法可返回数组中某个指定的元素位置。
该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。
如果在数组中没找到指定元素则返回 -1。
提示如果你想查找字符串最后出现的位置,请使用 lastIndexOf() 方法。
//查找数组中 "Apple" 的元素, 在数组的第四个位置开始检索: var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"]; var a = fruits.indexOf("Apple",4); //输出 6
-
join:
join() 方法将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目,那么将返回该项目而不使用分隔符。
const elements = ['Fire', 'Air', 'Water']; console.log(elements.join()); // expected output: "Fire,Air,Water" console.log(elements.join('')); // expected output: "FireAirWater" console.log(elements.join('-')); // expected output: "Fire-Air-Water"
-
keys:
keys() 方法返回一个包含数组中每个索引键的Array Iterator对象。
const array1 = ['a', 'b', 'c']; const iterator = array1.keys(); for (const key of iterator) { console.log(key); } // expected output: 0 // expected output: 1 // expected output: 2
-
lastIndexOf:
lastIndexOf() 方法返回指定元素(也即有效的 JavaScript 值或变量)在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找,从 fromIndex 处开始。
const animals = ['Dodo', 'Tiger', 'Penguin','Tiger','Tiger', 'Dodo']; console.log(animals.lastIndexOf('Dodo')); // expected output: 5 console.log(animals.lastIndexOf('Tiger')); // expected output: 4
-
length:
length 是Array的实例属性。返回或设置一个数组中的元素个数。该值是一个无符号 32-bit 整数,并且总是大于数组最高项的下标。
-
map:
map() 方法创建一个新数组,其结果是该数组中的每个元素是调用一次提供的函数后的返回值。
const array1 = [1, 4, 9, 16]; // pass a function to map const map1 = array1.map(x => x * 2); console.log(map1); // expected output: Array [2, 8, 18, 32]
-
pop:
**pop()**
方法从数组中删除最后一个元素,并返回该元素的值。此方法更改数组的长度。const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato']; console.log(plants.pop()); // expected output: "tomato" console.log(plants); // expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"] plants.pop(); console.log(plants); // expected output: Array ["broccoli", "cauliflower", "cabbage"]
-
push:
**push()**
方法将一个或多个元素添加到数组的末尾,并返回该数组的新长度。const animals = ['pigs', 'goats', 'sheep']; const count = animals.push('cows'); console.log(count); // expected output: 4 console.log(animals); // expected output: Array ["pigs", "goats", "sheep", "cows"] animals.push('chickens', 'cats', 'dogs'); console.log(animals); // expected output: Array ["pigs", "goats", "sheep", "cows", "chickens", "cats", "dogs"]
-
reduce:
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
reduce() 可以作为一个高阶函数,用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。
array.reduce(function(total, currentValue, currentIndex, arr), initialValue) total 必需。初始值, 或者计算结束后的返回值。 currentValue 必需。当前元素 currentIndex 可选。当前元素的索引 arr 可选。当前元素所属的数组对象。 initialValue 可选。传递给函数的初始值
var numbers = [65, 44, 12, 4]; function getSum(total, num) { return total + num; } function myFunction(item) { document.getElementById("demo").innerHTML = numbers.reduce(getSum); } //结果125
-
reduceRight:
**reduceRight()**
方法接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值。const array1 = [[0, 1], [2, 3], [4, 5]].reduceRight( (accumulator, currentValue) => accumulator.concat(currentValue) ); console.log(array1); // expected output: Array [4, 5, 2, 3, 0, 1]
-
reverse:
**reverse()**
方法将数组中元素的位置颠倒,并返回该数组。数组的第一个元素会变成最后一个,数组的最后一个元素变成第一个。该方法会改变原数组。const array1 = ['one', 'two', 'three']; console.log('array1:', array1); // expected output: "array1:" Array ["one", "two", "three"] const reversed = array1.reverse(); console.log('reversed:', reversed); // expected output: "reversed:" Array ["three", "two", "one"] // Careful: reverse is destructive -- it changes the original array. console.log('array1:', array1); // expected output: "array1:" Array ["three", "two", "one"]
-
shift:
**shift()**
方法从数组中删除第一个元素,并返回该元素的值。此方法更改数组的长度。const array1 = [1, 2, 3]; const firstElement = array1.shift(); console.log(array1); // expected output: Array [2, 3] console.log(firstElement); // expected output: 1
-
slice:
**slice()**
方法返回一个新的数组对象,这一对象是一个由begin
和end
决定的原数组的浅拷贝(包括begin
,不包括end
)。原始数组不会被改变。const animals = ['ant', 'bison', 'camel', 'duck', 'elephant']; console.log(animals.slice(2)); // expected output: Array ["camel", "duck", "elephant"] console.log(animals.slice(2, 4)); // expected output: Array ["camel", "duck"] console.log(animals.slice(1, 5)); // expected output: Array ["bison", "camel", "duck", "elephant"] console.log(animals.slice(-2)); // expected output: Array ["duck", "elephant"] console.log(animals.slice(1, -2)); // expected output: Array ["camel", "duck"] //理解分析: //提取起始处的索引(从 0 开始),从该索引开始提取原数组元素。 //如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。 //如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)。 //如果 end 被省略,则 slice 会一直提取到原数组末尾。 //如果 end 大于数组的长度,slice 也会一直提取到原数组末尾。
-
some:
**some()**
方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。**注意:**如果用一个空数组进行测试,在任何情况下它返回的都是
false
。const array = [1, 2, 3, 4, 5]; // checks whether an element is even const even = (element) => element % 2 === 0; console.log(array.some(even)); // expected output: true
-
sort:
sort() 方法用于对数组的元素进行排序。
对数组的引用。请注意,数组在原数组上进行排序,不生成副本。
如果没有指明
compareFunction
,那么元素会按照转换为的字符串的诸个字符的Unicode位点进行排序。例如 “Banana” 会被排列到 “cherry” 之前。当数字按由小到大排序时,9 出现在 80 之前,但因为(没有指明compareFunction
),比较的数字会先被转换为字符串,所以在Unicode顺序上 “80” 要比 “9” 要靠前。 -
splice:
splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。
**注释:**该方法会改变原始数组。
请注意,splice() 方法与 slice() 方法的作用是不同的,splice() 方法会直接对数组进行修改。
arrayObject.splice(index,howmany,item1,.....,itemX) index 必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。 howmany 必需。要删除的项目数量。如果设置为 0,则不会删除项目。 item1, ..., itemX 可选。向数组添加的新项目。 splice() 方法可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。 如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。 //例子:
-
toLocaleString:
把数组转换为本地字符串。
<script type="text/javascript"> var arr = new Array(3) arr[0] = "George" arr[1] = "John" arr[2] = "Thomas" document.write(arr.toLocaleString()) </script> //输出结果:George, John, Thomas
-
toString:
**toString()**
返回一个字符串,表示指定的数组及其元素const array1 = [1, 2, 'a', '1a']; console.log(array1.toString()); // expected output: "1,2,a,1a"
思考:
toString()和toLocaleString()有什么区别
var a=1234 a.toString() //"1234" a.toLocaleString() //"1,234" //当数字是四位及以上时,toLocaleString()会让数字三位三位一分隔,像我们有时候数字也会三位一个分号 var sd=new Date() sd Wed Feb 15 2017 11:21:31 GMT+0800 (CST) sd.toLocaleString() //"2017/2/15 上午11:21:31" sd.toString() //"Wed Feb 15 2017 11:21:31 GMT+0800 (CST)"
这样总结以上就是toString()和toLocaleString()两点区别:
1.当数字是四位数及以上时,有区别,区别看以上代码
2.当目标是标准时间格式时,用以上两种方法是有区别的,区别看以上
-
unshift:
unshift()
方法将一个或多个元素添加到数组的开头,并返回该数组的新长度(该方法修改原有数组**)**。const array1 = [1, 2, 3]; console.log(array1.unshift(4, 5)); // expected output: 5 console.log(array1); // expected output: Array [4, 5, 1, 2, 3]
-
values:
values()
方法返回一个新的Array Iterator
对象,该对象包含数组每个索引的值const array1 = ['a', 'b', 'c']; const iterator = array1.values(); console.log(iterator); for (const value of iterator) { console.log(value); } // expected output: "a" // expected output: "b" // expected output: "c"