javascript Array
1. Properties
-
Array.length
var arr = ["apple","juice "]; arr.length; // 2
-
Array.prototype
Array.prototype是Array的原型,你可以在上面添加新的方法,所有的Array實(shí)例都會(huì)繼承新添加方法。
if(!Array.prototype.first){ Array.prototype.first = function(){ return this[0]; } } var arr = [1,2,3]; arr.first = 1;
2. Methods
-
Array.from(arrayLike, mapFn?)
Array.from()會(huì)從array-like or iterable object中創(chuàng)建一個(gè)新的數(shù)組實(shí)例。
mapFn: 可選,可調(diào)用數(shù)組中每一個(gè)元素array-like: 類數(shù)組
具有l(wèi)ength和index的對(duì)象.iterable object: 可迭代對(duì)象
可以循環(huán)獲取對(duì)象里面值的對(duì)象,例如:Map和Set-
從字符串中獲取數(shù)組
Array.from("echo"); //["e","c","h","o"]
拓展
把字符串轉(zhuǎn)成數(shù)組
"echo".split(""); -
從數(shù)組中拷貝數(shù)組
var arr = [1,2,3]; var fromArr = Array.from(arr); arr; //[1,2,3] fromArr; //[1,2,3]
再看:
var arr = [1,{a: 1}]; var fromArr = Array.from(arr); fromArr[1].a = 2; arr; //[ 1, { a: 2 } ] fromArr; //[ 1, { a: 2 } ]
發(fā)現(xiàn)了嗎?
Array.from()是從數(shù)組中淺拷貝一個(gè)數(shù)組出來。
想了解更多深拷貝和淺拷貝的東東?請(qǐng)狠狠的戳這里??
從Set中獲取一個(gè)數(shù)組
const set = new Set([1,2,2,3]); Array.from(set); //[1,2,3]
Set數(shù)據(jù)結(jié)構(gòu)介紹??
- 從Map中獲取一個(gè)數(shù)組
var m = new Map([[1, 2], [2, 4], [4, 8]]); Array.from(m); // [[1, 2], [2, 4], [4, 8]]
Map數(shù)據(jù)結(jié)構(gòu)介紹??
- 從類數(shù)組中獲取一個(gè)數(shù)組
function f() { return Array.from(arguments); } f(1,2); //[1,2]
拓展
把類數(shù)組轉(zhuǎn)成數(shù)組
function f() {
return [].slice.call(arguments);
}
f(1,2); //[1,2]- mapFn的應(yīng)用
Array.from([1,2,3], x => x * x); //[1,4,9] Array.from({length: 5}, (item, index) => index); //[0,1,2,3,4]
-
-
Array.isArray()
Array.isArray() 用于確定傳遞的值是否是一個(gè) Array。
Array.isArray([1,2,3]); //true Array.isArray({a: 1}); //false
-
Array.of()
Array.of() 方法創(chuàng)建一個(gè)具有可變數(shù)量參數(shù)的新數(shù)組實(shí)例,而不考慮參數(shù)的數(shù)量或類型。
Array.of(1,2,3); //[1,2,3] Array.of(undefined); //[undefined] Array.of({a: 2}); //[{a: 2}]
3. prototype
-
Array.prototype.concat()
concat() 方法用于合并兩個(gè)或多個(gè)數(shù)組。此方法不會(huì)更改現(xiàn)有數(shù)組,而是淺復(fù)制一個(gè)新數(shù)組。
連接兩個(gè)數(shù)組
var alpha = ['a', 'b', 'c']; var numeric = [1, 2, 3]; alpha.concat(numeric); // result in ['a', 'b', 'c', 1, 2, 3]
連接三個(gè)數(shù)組
var num1 = [1, 2, 3], num2 = [4, 5, 6], num3 = [7, 8, 9]; var nums = num1.concat(num2, num3); console.log(nums); // results in [1, 2, 3, 4, 5, 6, 7, 8, 9]
-
Array.prototype.copyWithin(target, start, end)
copyWithin() 方法淺復(fù)制數(shù)組的一部分到同一數(shù)組中的另一個(gè)位置,并返回它,而不修改其大小。
說明:
1.把序列號(hào)為[start, end)的值拷貝到序列號(hào)為target的位置,而不改變?cè)瓟?shù)組大小。 2.start省略后默認(rèn)為0,為負(fù)數(shù)時(shí)從尾部計(jì)算。 3.end省略后為arrauy.length,為負(fù)數(shù)時(shí)從尾部計(jì)算。
示例:
[1, 2, 3, 4, 5].copyWithin(-2); // [1, 2, 3, 1, 2] [1, 2, 3, 4, 5].copyWithin(0, 3); // [4, 5, 3, 4, 5] [1, 2, 3, 4, 5].copyWithin(0, 3, 4); // [4, 2, 3, 4, 5] [1, 2, 3, 4, 5].copyWithin(-2, -3, -1); // [1, 2, 3, 3, 4]
-
Array.prototype.every(fn)
對(duì)一個(gè)數(shù)組里所有的值進(jìn)行檢測(cè),全部通過返回true,否則返回false.
說明:
1.fn(element, index, every)
示例:
let arr = [12, 14, 5, 39]; function testArr(item, index, array){ return item > 10; } function testItem(item, index, array){ return item > 3; } console.log( arr.every(testArr) ); //false console.log( arr.every(testItem) ); //true console.log( arr.every(x => x > 1) ); //true
-
Array.prototype.fill(value, strat? end?)
說明:
1.start可選,默認(rèn)值為0.如果為負(fù)數(shù),則從尾部開始。 2.end可選,默認(rèn)值為Array.length,則從尾部開始。
示例:
[1, 2, 3].fill(4); // [4, 4, 4] [1, 2, 3].fill(4, 1); // [1, 4, 4] [1, 2, 3].fill(4, 1, 2); // [1, 4, 3] [1, 2, 3].fill(4, 1, 1); // [1, 2, 3] [1, 2, 3].fill(4, -3, -2); // [4, 2, 3] [1, 2, 3].fill(4, NaN, NaN); // [1, 2, 3] Array(3).fill(4); // [4, 4, 4] [].fill.call({ length: 3 }, 4); // {0: 4, 1: 4, 2: 4, length: 3}
-
Array.prototype.filter()
入口:
callback(item, index, array, thisArg?) item: 當(dāng)前元素 index: 當(dāng)前元素的序列號(hào) array: 當(dāng)前作用的數(shù)組 thisArg: 回掉函數(shù)中的this指向,如果未設(shè)置,則指向undefined
出口:
返回一個(gè)包含匹配元素的數(shù)組
示例:
const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange']; const filterItems = (query) => { return fruits.filter((el) => el.toLowerCase().indexOf(query.toLowerCase()) > -1 ); } console.log(filterItems('ap')); // ['apple', 'grapes'] console.log(filterItems('an')); // ['banana', 'mango', 'orange']
-
Array.prototype.find()
入口:
callback(item, index, array, thisArg?) item: 當(dāng)前元素 index: 當(dāng)前元素的序列號(hào) array: 當(dāng)前作用的數(shù)組 thisArg: 回掉函數(shù)中的this指向,如果未設(shè)置,則指向undefined
出口:
放回第一個(gè)匹配到的元素,如果不存在,返回undefined.
示例:
var inventory = [ {name: 'apples', quantity: 2}, {name: 'bananas', quantity: 0}, {name: 'cherries', quantity: 5} ]; function findCherries(fruit) { return fruit.name === 'cherries'; } console.log(inventory.find(findCherries)); // { name: 'cherries', quantity: 5 }
-
Array.prototype.findIndex()
入口:
callback(item, index, array, thisArg?) item: 當(dāng)前元素 index: 當(dāng)前元素的序列號(hào) array: 當(dāng)前作用的數(shù)組 thisArg: 回掉函數(shù)中的this指向,如果未設(shè)置,則指向undefined
出口:
放回第一個(gè)匹配到的元素的序列號(hào),如果不存在,返回undefined.
示例:
function isBigEnough(element) { return element >= 15; } [12, 5, 8, 130, 44].findIndex(isBigEnough); // index of 4th element in the Array is returned, // so this will result in '3'
-
Array.prototype.forEach()
入口:
callback(item, index, array, thisArg?) item: 當(dāng)前元素 index: 當(dāng)前元素的序列號(hào) array: 當(dāng)前作用的數(shù)組 thisArg: 回掉函數(shù)中的this指向,如果未設(shè)置,則指向undefined
操作:
對(duì)數(shù)組中每一個(gè)元素執(zhí)行一次函數(shù)操作。
示例:
const arr = ['a', 'b', 'c']; arr.forEach(function(element) { console.log(element); }); // a // b // c
-
Array.prototype.includes(searchItem, startIndex?)
入口:
searchItem: 需要搜索的目標(biāo)元素 startIndex: 開始的位置
出口:
如果搜索到有目標(biāo)元素,返回true,否則,返回false.
示例:
var a = [1, 2, 3]; a.includes(2); // true a.includes(4); // false