Array.from():從一個(gè)類似數(shù)組或可迭代對(duì)象創(chuàng)建一個(gè)新的臭埋,淺拷貝的數(shù)組實(shí)例哪自。
1. 將類數(shù)組轉(zhuǎn)換成數(shù)組
常見(jiàn)的類數(shù)組對(duì)象:
函數(shù)中的arguments關(guān)鍵字
一個(gè)DOM集合(比如:document.getElementsByTagName("p")可以獲取文檔中所有的p元素忆首,這就是一個(gè)DOM集合)
類數(shù)組對(duì)象可以用索引引用也可以使用length,但是沒(méi)有數(shù)組的一些方法,比如pop(),push(),reduce()等汤锨,通過(guò)Array.from()將類數(shù)組對(duì)象轉(zhuǎn)換成一個(gè)數(shù)組。就可以使用數(shù)組的那些方法了百框。
2. 克隆一個(gè)數(shù)組(淺拷貝)
// 引用類型直接賦值的話闲礼,是將指向引用類型的指針進(jìn)行賦值,享有同一個(gè)內(nèi)存地址,修改其中一個(gè)數(shù)據(jù)也會(huì)干擾到另一個(gè)數(shù)據(jù)的值
const person = [1,3,2,4]
const me = person;
console.log(person===me) // true
me[1]=4;
console.log(person) // [1, 4, 2, 4]
console.log(me) // [1, 4, 2, 4]
淺拷貝:只復(fù)制指向引用類型的指針柬泽,而不復(fù)制引用類型本身慎菲,新舊引用類型還是共享同一塊內(nèi)存。淺拷貝的引用類型若包含子引用類型锨并,當(dāng)新的引用類型對(duì)子引用類型發(fā)生改變時(shí)則會(huì)使原引用類型子引用類型一同改變露该,若新的引用類型只改變第一層的數(shù)據(jù),則原引用類型不會(huì)改變第煮。
深拷貝:會(huì)另外創(chuàng)造一個(gè)一模一樣的引用類型解幼,新引用類型跟原引用類型不共享內(nèi)存,修改新引用類型不會(huì)改到原引用類型包警。
const person = [1,[2,[4,5],3]]
const me = Array.from(person);
console.log(person===me) // false
// 如果修改子引用類型撵摆,則:
me[1]=4;
console.log(person) // [1,[2,[4,5],3]]
console.log(me) // [1, 4]
// 如果修改子基本類型,則:
me[0]=9;
console.log(person) // [1,[2,[4,5],3]]
console.log(me) // [9,[2,[4,5],3]]
3. 使用值填充數(shù)組
可以使用Array.from()來(lái)模仿fill()實(shí)現(xiàn)數(shù)組填充
const length = 3;
const init = 0;
const result = Array.from({ length }, () => init);
result; // => [0, 0, 0]
// arr.fill(value[, start[, end]]) console.log(Array(6).fill(6)); // => [6, 6, 6, 6, 6, 6]
4.使用對(duì)象填充數(shù)組
如果要求初始化的每一項(xiàng)都是一個(gè)新對(duì)象害晦,使用Array.from()是個(gè)不錯(cuò)的選擇台汇。
const length = 3;
const resultA = Array.from({ length }, () => ({}));
const resultB = Array(length).fill({});
resultA; // => [{}, {}, {}]
resultB; // => [{}, {}, {}]
resultA[0] === resultA[1]; // => false
resultB[0] === resultB[1]; // => true
5.數(shù)組去重
結(jié)合Set來(lái)實(shí)現(xiàn)數(shù)組去重
function unique(array) {
return Array.from(new Set(array));
}
unique([1, 1, 2, 3, 3]); // => [1, 2, 3]
當(dāng)然數(shù)組去重比較好用的方法還有...運(yùn)算符:
const ar = [6,6,6,6,1,2];
const a=[...new Set(ar)]
console.log(a); // =>[6, 1, 2]