類數(shù)組轉(zhuǎn)換為數(shù)組的方法

原文:https://blog.csdn.net/LLLyyx/article/details/78141900

1百炬、Array.prototype.slice.call()?

這種方法是借用了數(shù)組原型中的slice方法微服,返回一個數(shù)組以蕴。slice方法的內(nèi)部實現(xiàn):

Array.prototype.slice = function(start,end){

? ? ? var result = new Array();?

? ? ? start = start || 0;?

? ? ? end = end || this.length; //使用call之后this指向了類數(shù)組對象

? ? ? for(var i = start; i < end; i++){?

? ? ? ? ? result.push(this[i]);?

? ? ? }?

? ? ? return result;?

}

一個通用的轉(zhuǎn)換函數(shù):

var toArray = function(s){

? ? try{?

? ? ? ? return Array.prototype.slice.call(s);?

? ? } catch(e){?

? ? ? ? ? ? var arr = [];?

? ? ? ? ? ? for(var i = 0,len = s.length; i < len; i++){?

? ? ? ? ? ? ? ? arr[i] = s[i];?

? ? ? ? ? ? }?

? ? ? ? ? ? return arr;?

? ? }

2辛孵、Array.from()?

Array.from()是ES6中新增的方法,可以將兩類對象轉(zhuǎn)為真正的數(shù)組:類數(shù)組對象和可遍歷(iterable)對象(包括ES6新增的數(shù)據(jù)結(jié)構(gòu)Set和Map)宝与。

var arrayLike = {

? ? '0':'a',

? ? '1':'b',

? ? '2':'c',

? ? length:3

};

var arr = Array.from(arrayLike);//['a','b','c']

//把NodeList對象轉(zhuǎn)換為數(shù)組焚廊,然后使用數(shù)組的forEach方法

var ps = document.querySelectorAll('p');

Array.from(ps).forEach(p){

? ? console.log(p);

});? ? ? ? ? ? ? ? ? ? ? ? ? ?

//轉(zhuǎn)換arguments對象為數(shù)組

function foo(){

? ? var args = Array.from(arguments);

? ? //...

}

//只要是部署了Iterator接口的數(shù)據(jù)結(jié)構(gòu),Array.from都能將其轉(zhuǎn)換為數(shù)組

Array.from('hello');? ? ? ? ? ? //['h','e','l','l','o']

3习劫、擴(kuò)展運(yùn)算符(…)?

同樣是ES6中新增的內(nèi)容咆瘟,擴(kuò)展運(yùn)算符(…)也可以將某些數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)為數(shù)組

//arguments對象的轉(zhuǎn)換

function foo(){?

?var args = [...arguments];

}

//NodeList對象的轉(zhuǎn)換

[...document.querySelectorAll('p')]

擴(kuò)展運(yùn)算符實際上調(diào)用的是遍歷器接口,如果一個對象沒有部署此接口就無法完成轉(zhuǎn)換

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末诽里,一起剝皮案震驚了整個濱河市搞疗,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌须肆,老刑警劉巖匿乃,帶你破解...
    沈念sama閱讀 219,427評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異豌汇,居然都是意外死亡幢炸,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,551評論 3 395
  • 文/潘曉璐 我一進(jìn)店門拒贱,熙熙樓的掌柜王于貴愁眉苦臉地迎上來宛徊,“玉大人,你說我怎么就攤上這事逻澳≌⑻欤” “怎么了?”我有些...
    開封第一講書人閱讀 165,747評論 0 356
  • 文/不壞的土叔 我叫張陵斜做,是天一觀的道長苞氮。 經(jīng)常有香客問我,道長瓤逼,這世上最難降的妖魔是什么笼吟? 我笑而不...
    開封第一講書人閱讀 58,939評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮霸旗,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘撵枢。我一直安慰自己锄禽,他們只是感情好沟绪,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,955評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著坝疼,像睡著了一般钝凶。 火紅的嫁衣襯著肌膚如雪耕陷。 梳的紋絲不亂的頭發(fā)上哟沫,一...
    開封第一講書人閱讀 51,737評論 1 305
  • 那天嗜诀,我揣著相機(jī)與錄音隆敢,去河邊找鬼拂蝎。 笑死匣屡,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的鹅士。 我是一名探鬼主播也拜,決...
    沈念sama閱讀 40,448評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼慢哈,長吁一口氣:“原來是場噩夢啊……” “哼卵贱!你這毒婦竟也來了键俱?” 一聲冷哼從身側(cè)響起编振,我...
    開封第一講書人閱讀 39,352評論 0 276
  • 序言:老撾萬榮一對情侶失蹤臀玄,失蹤者是張志新(化名)和其女友劉穎镐牺,沒想到半個月后睬涧,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體畦浓,經(jīng)...
    沈念sama閱讀 45,834評論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,992評論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了烛谊。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片丹禀。...
    茶點(diǎn)故事閱讀 40,133評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡持搜,死狀恐怖葫盼,靈堂內(nèi)的尸體忽然破棺而出贫导,到底是詐尸還是另有隱情,我是刑警寧澤邑滨,帶...
    沈念sama閱讀 35,815評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站面哥,受9級特大地震影響尚卫,放射性物質(zhì)發(fā)生泄漏吱涉。R本人自食惡果不足惜怎爵,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,477評論 3 331
  • 文/蒙蒙 一鳖链、第九天 我趴在偏房一處隱蔽的房頂上張望芙委。 院中可真熱鬧灌侣,春花似錦顶瞳、人聲如沸慨菱。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,022評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至描馅,卻和暖如春而线,著一層夾襖步出監(jiān)牢的瞬間膀篮,已是汗流浹背誓竿。 一陣腳步聲響...
    開封第一講書人閱讀 33,147評論 1 272
  • 我被黑心中介騙來泰國打工筷屡, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留毙死,地道東北人规哲。 一個月前我還...
    沈念sama閱讀 48,398評論 3 373
  • 正文 我出身青樓唉锌,卻偏偏與公主長得像袄简,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子秃症,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,077評論 2 355

推薦閱讀更多精彩內(nèi)容