資訊專欄INFORMATION COLUMN
摘要：注意屬性名代表了數(shù)組的索引號，如果沒有這個(gè)索引號，轉(zhuǎn)出來的數(shù)組中對應(yīng)的元素就為空。對象的屬性名不能轉(zhuǎn)換成索引號時(shí)?？蛇x參數(shù)可選參數(shù)，執(zhí)行回調(diào)函數(shù)時(shí)對象。
ES6為Array增加了from函數(shù)用來從一個(gè)類似數(shù)組或可迭代對象中創(chuàng)建一個(gè)新的，淺拷貝的數(shù)組實(shí)例。
不過只可以將一下兩種對象轉(zhuǎn)換成數(shù)組。
1.部署了Iterator接口的對象，比如：Set，Map，Array。
2.類數(shù)組對象，什么叫類數(shù)組對象，就是一個(gè)對象必須有l(wèi)ength屬性，沒有l(wèi)ength，轉(zhuǎn)出來的就是空數(shù)組。
1：轉(zhuǎn)換字符串
可以吧ascii的字符串拆解成一個(gè)數(shù)據(jù)，也可以準(zhǔn)確的將unicode字符串拆解成數(shù)組。
console.log(Array.from("hello world"))
console.log(Array.from("u4f60u597d"))
//h,e,l,l,o, ,w,o,r,l,d
//你,
2：轉(zhuǎn)換set對象
將Set對象的元素轉(zhuǎn)換成一個(gè)數(shù)組。
const newSet = new Set(); newSet.add(0).add(1).add(2); console.log(Array.from(newSet )) //0,1,2
3：轉(zhuǎn)換map
將Map對象的鍵值對轉(zhuǎn)換成一個(gè)一維數(shù)組，轉(zhuǎn)換出來的數(shù)組元素的序列是：key1,value1,key2,value2,key3,value3.....
const map1 = new Map();
map1.set("k1", 1);
map1.set("k2", 2);
map1.set("k3", 3);
console.log(Array.from(map1))
//k1,1,k2,2,k3,3
4：轉(zhuǎn)換類數(shù)組對象
一個(gè)類數(shù)組對象必須要有l(wèi)ength，他們的元素屬性名必須是數(shù)值或者可以轉(zhuǎn)換成數(shù)值的字符。
注意：屬性名代表了數(shù)組的索引號，如果沒有這個(gè)索引號，轉(zhuǎn)出來的數(shù)組中對應(yīng)的元素就為空。
console.log(Array.from({
0: "0",
1: "1",
3: "3",
5: "5"
length:5
}))
//0,1,,3,,5
如果對象不帶length屬性，那么轉(zhuǎn)出來就是空數(shù)組。
console.log(Array.from({
0: 0,
1: 1
}))
//結(jié)果就是空數(shù)組。
對象的屬性名不能轉(zhuǎn)換成索引號時(shí)。
console.log(Array.from({
a: "1",
b: "2",
length:2
}))
//結(jié)果也是空數(shù)組
Array.from可以接受三個(gè)參數(shù)
我們看定義：
Array.from(arrayLike[, mapFn[, thisArg]]) //arrayLike //想要轉(zhuǎn)換成數(shù)組的偽數(shù)組對象或可迭代對象。 //mapFn (可選參數(shù)) //如果指定了該參數(shù)，新數(shù)組中的每個(gè)元素會執(zhí)行該回調(diào)函數(shù)。 //thisArg (可選參數(shù)) //可選參數(shù)，執(zhí)行回調(diào)函數(shù) mapFn 時(shí) this 對象。
第一個(gè)參數(shù)上面已經(jīng)講了，下面講剩下的兩個(gè)參數(shù)
第二個(gè)參數(shù)，map函數(shù)
用來對轉(zhuǎn)換中，每一個(gè)元素進(jìn)行加工，并將加工后的結(jié)果作為結(jié)果數(shù)組的元素值。
console.log(Array.from([1, 2, 3, 4, 5], (n) => n + 1)) //2,3,4,5,6
第三個(gè)參數(shù)，map函數(shù)中this指向的對象
該參數(shù)可以將被處理的數(shù)據(jù)和處理對象分離，將各種不同的處理數(shù)據(jù)的方法封裝到不同的的對象中去，處理方法采用相同的名字。在調(diào)用Array.from對數(shù)據(jù)對象進(jìn)行轉(zhuǎn)換時(shí)，可以將不同的處理對象按實(shí)際情況進(jìn)行注入，以得到不同的結(jié)果，適合解耦。
相當(dāng)于：Array.from(obj).map(mapFn, thisArg)
let diObj = {
handle: function(n){
return n + 2
}
}
console.log(Array.from(
[1, 2, 3, 4, 5],
function (x){
return this.handle(x)
},
diObj))
//3,4,5,6,7
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/105786.html
摘要：數(shù)組的方法方法創(chuàng)建一個(gè)新的數(shù)組，新數(shù)組中的元素是通過檢查指定數(shù)組中符合條件的所有元素?？蛇x，執(zhí)行函數(shù)時(shí)的值。刪除所有的鍵值對，沒有返回值。返回一個(gè)布爾值，表示某個(gè)鍵是否在當(dāng)前對象之中。 說明 JavaScript數(shù)組去重這個(gè)問題，經(jīng)常出現(xiàn)在面試題中，以前也寫過一篇數(shù)組去重的文章，（JavaScript 數(shù)組去重的多種方法原理詳解）但感覺代碼還是有點(diǎn)不夠簡單，今天和大家再說兩種方法，代碼...
摘要：數(shù)組的方法方法創(chuàng)建一個(gè)新的數(shù)組，新數(shù)組中的元素是通過檢查指定數(shù)組中符合條件的所有元素?？蛇x，執(zhí)行函數(shù)時(shí)的值。刪除所有的鍵值對，沒有返回值。返回一個(gè)布爾值，表示某個(gè)鍵是否在當(dāng)前對象之中。 說明 JavaScript數(shù)組去重這個(gè)問題，經(jīng)常出現(xiàn)在面試題中，以前也寫過一篇數(shù)組去重的文章，（JavaScript 數(shù)組去重的多種方法原理詳解）但感覺代碼還是有點(diǎn)不夠簡單，今天和大家再說兩種方法，代碼...
摘要：數(shù)組的方法方法創(chuàng)建一個(gè)新的數(shù)組，新數(shù)組中的元素是通過檢查指定數(shù)組中符合條件的所有元素?？蛇x，執(zhí)行函數(shù)時(shí)的值。刪除所有的鍵值對，沒有返回值。返回一個(gè)布爾值，表示某個(gè)鍵是否在當(dāng)前對象之中。 說明 JavaScript數(shù)組去重這個(gè)問題，經(jīng)常出現(xiàn)在面試題中，以前也寫過一篇數(shù)組去重的文章，（JavaScript 數(shù)組去重的多種方法原理詳解）但感覺代碼還是有點(diǎn)不夠簡單，今天和大家再說兩種方法，代碼...
摘要：使用一元加模擬函數(shù)原理對非數(shù)值類型的數(shù)據(jù)使用一元加，會起到與函數(shù)相同的效果。中，若判斷不為則不再進(jìn)行下一步操作。使用邏輯或設(shè)置默認(rèn)值邏輯或也屬于短路操作，即當(dāng)?shù)谝粋€(gè)操作數(shù)可以決定結(jié)果時(shí)，不再對第二個(gè)操作數(shù)進(jìn)行求值。 善于利用JS中的小知識的利用，可以很簡潔的編寫代碼 1. 使用!!模擬Boolean()函數(shù) 原理：邏輯非操作一個(gè)數(shù)據(jù)對象時(shí)，會先將數(shù)據(jù)對象轉(zhuǎn)換為布爾值，然后取反，兩個(gè)!!...
閱讀 2255·2023-04-26 00:00
閱讀 3456·2021-09-24 10:37
閱讀 3625·2021-09-07 09:58
閱讀 1587·2019-08-30 15:56
閱讀 2275·2019-08-30 13:11
閱讀 2368·2019-08-29 16:38
閱讀 1059·2019-08-29 12:58
閱讀 1984·2019-08-27 10:54
