javaScript之ES6(二)


解構(gòu)賦值

解構(gòu)賦值

變量的賦值可以按照一定的模式批量賦值

數(shù)組模式

根據(jù)下標(biāo)一一對(duì)應(yīng)賦值
var [a,b,c] = [1,2.3]
等同于
var a =1;
var b =2;
var c=3

  • 多維數(shù)組同理
  • 解構(gòu)失敗時(shí)賦值為undefined
    var [a,b] = [1];
    //a =1;
    //b=undefined;
  • 設(shè)默認(rèn)值
    var [a,b=2] = [1];
    //a=1;
    //b=2;

對(duì)象模型

根據(jù)key值一一對(duì)應(yīng)賦值,注意此時(shí)value應(yīng)該是變量而非字符串普泡。

var {a:a,b:b}={a:1,b=2};
//ES6對(duì)象key省略時(shí)域那,key value同名咙边,也可以寫(xiě)成這樣
var {a,b} = {a:1,b:2};
  • 解構(gòu)失敗為undefined
    var {c} = {a:1,b:2};
    //c=undefined;
  • json形式時(shí),也是一一對(duì)應(yīng)次员,位置相同即可
  • 默認(rèn)值
    var {a,b=2}={a:1};
    //b=2;
  • 對(duì)于已定義的變量败许,使用對(duì)象模式需要注意(),否則等號(hào)兩邊被認(rèn)為是兩個(gè)代碼塊淑蔚。
let a ;
{a}={a:1};
//SyntaxError
let b ;
{市殷={b:2}};
//b=2;

其他情況

  1. 當(dāng)右邊表達(dá)式是字符串,類(lèi)似數(shù)組刹衫,也是根據(jù)下標(biāo)計(jì)算醋寝。
    const [a,b,c]='123''
    //a='1';b='2';c='3''
  2. 當(dāng)右邊是其他類(lèi)型時(shí)會(huì)被轉(zhuǎn)為對(duì)象,在進(jìn)行解構(gòu)賦值带迟。
    注:null和undefined無(wú)法轉(zhuǎn)為對(duì)象音羞,會(huì)報(bào)錯(cuò)。

其他應(yīng)用

  1. 函數(shù)參數(shù)
//形參寫(xiě)成數(shù)組
function fn([a,b]){
...
};
fn([1,2]);
//形參寫(xiě)成對(duì)象仓犬,不必考慮傳入順序
function fn (a,b){
..
};
fn({b:2,a:1});
  • 形參默認(rèn)值的2種寫(xiě)法嗅绰,一種是解構(gòu)賦值寫(xiě)法,一種是ES6中形參設(shè)置默認(rèn)值的方式
    funtion fn({a,b}={1,2}){
    ...
    };
  1. 函數(shù)返回多個(gè)值搀继,一次性接收
function fn(){
  return [1,2,3]
};
let [a,b,c]=fn();
  1. 交換值
    [y,x]=[x,y]
數(shù)組(一)

ES6數(shù)組新增的方法(部分為ES5方法)

1.concat()
合并數(shù)組窘面,該方法會(huì)改變?cè)瓟?shù)組
2.reverse()
反轉(zhuǎn)數(shù)組
3.Array.isArray()
判斷是否是數(shù)組,等效于Object.prototype,toString.call(xx)==="[objectArray]"
4.forEach(fn(val,index,arr))
ES5的方法叽躯,低版本瀏覽器不兼容民镜,此方法用來(lái)遍歷數(shù)組,參數(shù)中arr指數(shù)組本身险毁,arr.forEach(function(val,index,arr){...})
5.map(fn(val,index,arr))
遍歷制圈,返回一個(gè)新數(shù)組们童,此函數(shù)參數(shù)為數(shù)組中的單個(gè)值(react中用較多)

var numbers = [1,2,3];
numbers.map(function(n){
  return n+1;
});
//[2,3,4]

6.filter(fn(val,index,arr))
過(guò)濾,返回一個(gè)新數(shù)組鲸鹦,它由fn函數(shù)返回true時(shí)的val組成

let arr= [3,4,5.6.7]
arr.filter(function(val){
  return val>4;
})
//[[5,6,7]

7.some(fn(val,index,arr))
查找慧库,其中一個(gè)值經(jīng)過(guò)函數(shù)處理返回了true,則返回true馋嗜,認(rèn)為數(shù)組中包含符合條件的值

let arr=[2,3,4,5,6];
arr.some(function(elem,index,arr){
  return elem>=3
});
//true

8.every((val,index,arr))
類(lèi)似some,fn都返回true齐板,則返回true
9.reduce(fn(val,index,arr),ex)
合并,返回ex葛菇,默認(rèn)是數(shù)組中的第一個(gè)val甘磨,也可以用第二參數(shù)指定

let arr=[1,2,3,4,5];
arr.reduce(function(ex,val){
  return ex+val;
},10);
//25
let json=['aaa','bb','c'];
json.reduce(function(logest,entry){
  return.entry.length>longest.length?entry:longest;
},");

9.find(fn(val,index,arr))
查找第一個(gè)符合fn的值,fn應(yīng)該返回t/f眯停,差不到返回undefinde

let arr= [1,2,3]
arr.find(function(val){
  return val>1;
})
//2
比indexof強(qiáng)大济舆,且可查找NaN
  1. findindex(fn(val,index,arr))
    類(lèi)似find,返回符合fn的下標(biāo)莺债,查不到返回-1滋觉。

11.keys()返回?cái)?shù)組所有key組成的遍歷器對(duì)象
遍歷器對(duì)象在后面詳解,它可以使用for.....of遍歷

let arr=[1,2,3]
for (let i of arr.keys()){
  console.log(i)
}
//1,2,3

12.valus()類(lèi)似keys()齐邦,返回所有value
13.entries()返回所有key value

var arr = [1,2,3]
for(let i of arr.entries()){
  console.log(i)
}
//[0,1] [下標(biāo)椎侠,值]  //[1,2]   //[2,3]

14.Array.from(arrlike,[fn(value)])
將數(shù)組轉(zhuǎn)化為數(shù)組,替代Arrar.prototype.slice,call,fn用來(lái)返回新值措拇。

常見(jiàn)的類(lèi)數(shù)組

  • DOM操作返回的是節(jié)點(diǎn)集合
let p = document.getElementsByTagName("p");
Array.from(p).forEach(fn...);
//正常情況下頁(yè)可使用for循環(huán)我纪,長(zhǎng)度為類(lèi)數(shù)組的length
  • 函數(shù)內(nèi)部的anguments也是累數(shù)組
    注:具有l(wèi)terator接口的都可使用Array.from()
    除了上述方法以外,還有其他諸如數(shù)組填充fill()等不怎么用到的方法丐吓,這里就不再列出宣羊。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市汰蜘,隨后出現(xiàn)的幾起案子仇冯,更是在濱河造成了極大的恐慌,老刑警劉巖族操,帶你破解...
    沈念sama閱讀 219,270評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件苛坚,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡色难,警方通過(guò)查閱死者的電腦和手機(jī)泼舱,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,489評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)枷莉,“玉大人娇昙,你說(shuō)我怎么就攤上這事◇悦睿” “怎么了冒掌?”我有些...
    開(kāi)封第一講書(shū)人閱讀 165,630評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵噪裕,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我股毫,道長(zhǎng)膳音,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,906評(píng)論 1 295
  • 正文 為了忘掉前任铃诬,我火速辦了婚禮祭陷,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘趣席。我一直安慰自己兵志,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,928評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布宣肚。 她就那樣靜靜地躺著想罕,像睡著了一般。 火紅的嫁衣襯著肌膚如雪钉寝。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 51,718評(píng)論 1 305
  • 那天闸迷,我揣著相機(jī)與錄音嵌纲,去河邊找鬼。 笑死腥沽,一個(gè)胖子當(dāng)著我的面吹牛逮走,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播今阳,決...
    沈念sama閱讀 40,442評(píng)論 3 420
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼师溅,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了盾舌?” 一聲冷哼從身側(cè)響起墓臭,我...
    開(kāi)封第一講書(shū)人閱讀 39,345評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎妖谴,沒(méi)想到半個(gè)月后窿锉,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,802評(píng)論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡膝舅,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,984評(píng)論 3 337
  • 正文 我和宋清朗相戀三年嗡载,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片仍稀。...
    茶點(diǎn)故事閱讀 40,117評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡洼滚,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出技潘,到底是詐尸還是另有隱情遥巴,我是刑警寧澤千康,帶...
    沈念sama閱讀 35,810評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站挪哄,受9級(jí)特大地震影響吧秕,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜迹炼,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,462評(píng)論 3 331
  • 文/蒙蒙 一砸彬、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧斯入,春花似錦砂碉、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 32,011評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至磅摹,卻和暖如春滋迈,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背户誓。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,139評(píng)論 1 272
  • 我被黑心中介騙來(lái)泰國(guó)打工饼灿, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人帝美。 一個(gè)月前我還...
    沈念sama閱讀 48,377評(píng)論 3 373
  • 正文 我出身青樓碍彭,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親悼潭。 傳聞我的和親對(duì)象是個(gè)殘疾皇子庇忌,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,060評(píng)論 2 355

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

  • 1、新的聲明方式 以前我們?cè)诼暶鲿r(shí)只有一種方法舰褪,就是使用var來(lái)進(jìn)行聲明皆疹,ES6對(duì)聲明的進(jìn)行了擴(kuò)展,現(xiàn)在可以有三種...
    令武閱讀 1,009評(píng)論 0 7
  • 第2章 基本語(yǔ)法 2.1 概述 基本句法和變量 語(yǔ)句 JavaScript程序的執(zhí)行單位為行(line)占拍,也就是一...
    悟名先生閱讀 4,150評(píng)論 0 13
  • Scala與Java的關(guān)系 Scala與Java的關(guān)系是非常緊密的G交! 因?yàn)镾cala是基于Java虛擬機(jī)刷喜,也就是...
    燈火gg閱讀 3,444評(píng)論 1 24
  • Javascript有很多數(shù)組的方法残制,有的人有W3C的API,還可以去MDN上去找掖疮,但是我覺(jué)得API上說(shuō)的不全初茶,M...
    頑皮的雪狐七七閱讀 4,088評(píng)論 0 6
  • 開(kāi)篇先來(lái)壓壓驚,不要被題目嚇到。雖然多囊卵巢綜合征目前無(wú)法治愈恼布,但這個(gè)病不是絕癥螺戳,也沒(méi)有想象的那么可怕,只要認(rèn)真對(duì)...
    心大夫閱讀 1,373評(píng)論 1 2