小編給大家分享一下Javascript使用數(shù)組解構(gòu)獲取函數(shù)的多個(gè)返回值的方法，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

成都創(chuàng)新互聯(lián)專(zhuān)注于沂源網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠(chéng)為您提供沂源營(yíng)銷(xiāo)型網(wǎng)站建設(shè)，沂源網(wǎng)站制作、沂源網(wǎng)頁(yè)設(shè)計(jì)、沂源網(wǎng)站官網(wǎng)定制、成都小程序開(kāi)發(fā)服務(wù)，打造沂源網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供沂源網(wǎng)站排名全網(wǎng)營(yíng)銷(xiāo)落地服務(wù)。

javascript欄目將列出五個(gè)讓你的代碼更加可讀和易于維護(hù)小竅門(mén)。

在編輯舊項(xiàng)目的時(shí)候，有沒(méi)有遇到過(guò)那種一加新邏輯就“粉碎”的迷惑代碼？我們當(dāng)然都遇到過(guò)。 為了讓世界上不可讀的 Javascript 代碼更少，我得給你們看看以下的五個(gè)例子 -- 我的恥辱柱。

使用數(shù)組解構(gòu)獲取函數(shù)的多個(gè)返回值

如果我們有一個(gè)返回多個(gè)值的函數(shù),可以使用數(shù)組解構(gòu)實(shí)現(xiàn)取值。代碼如下：

const func = () => {  const a = 1;  const b = 2;  const c = 3;  const d = 4; 
  return [a,b,c,d];
}const [a,b,c,d] = func();console.log(a,b,c,d); // Outputs: 1,2,3,4

雖然上面的方法能實(shí)現(xiàn)賦值，但是它有一些副作用。

調(diào)用函數(shù)得到返回值 a,b,c,d 時(shí)，我們需要注意返回值返回的順序。這里的一個(gè)小錯(cuò)誤很可能就是你 debug 路上的夢(mèng)魘。

除了需要注意順序，我們還不能只獲取想要的其中幾個(gè)返回值，假如我只想要 c,d 呢？

const func = () => {  const a = 1;  const b = 2;  const c = 3;  const d = 4;  return {a,b,c,d};
}const {c,d} = func();復(fù)制代碼

我們可以使用對(duì)象解構(gòu)賦值來(lái)代替它。

const func = () => {  const a = 1;  const b = 2;  const c = 3;  const d = 4;  return {a,b,c,d};
}const {c,d} = func();

現(xiàn)在我們可以自由地選擇需要哪些函數(shù)返回值。

以后就算函數(shù)增加了更多的返回值，對(duì)象解構(gòu)的代碼也可以不做任何變更,使代碼更加穩(wěn)定。

沒(méi)有在函數(shù)入?yún)⑹褂脤?duì)象解構(gòu)

假設(shè)我們有一個(gè)入?yún)⑹菍?duì)象的函數(shù)，函數(shù)內(nèi)代碼需要使用到這個(gè)對(duì)象的屬性。 一個(gè)幼稚的實(shí)現(xiàn)如下：

// badfunction getDaysRemaining(subscription) {  const startDate = subscription.startDate;  const endDate = subscription.endDate;  return endDate - startDate;
}

這個(gè)方案雖然滿(mǎn)足了我們的需要，但是聲明了兩個(gè)沒(méi)什么必要的臨時(shí)引用變量 startDate  和 endDate。

一個(gè)更好的方案是使用對(duì)象解構(gòu)在一行里面獲取入?yún)?startDate 和 endDate。

// betterfunction getDaysRemaining(subscription) {  const { startDate, endDate } = subscription;  return startDate - endDate;
}

我們甚至可以直接在入?yún)⑹褂脤?duì)象解構(gòu)定義這兩個(gè)變量。

// even betterfunction getDaysRemaining({ startDate, endDate }) {  return startDate - endDate;
}
Much more elegant wouldn’t you agree?

你難道不覺(jué)得這樣實(shí)現(xiàn)更優(yōu)雅嗎？

不使用展開(kāi)語(yǔ)法(...)拷貝數(shù)組

使用 for 循環(huán)遍歷元素再拷貝到新數(shù)組除了繁瑣還很丑陋。

使用展開(kāi)語(yǔ)法可以讓實(shí)現(xiàn)更加清晰和簡(jiǎn)潔。

const stuff = [1,2,3];// badconst stuffCopyBad = []for(let i = 0; i < stuff.length; i++){
  stuffCopyBad[i] = stuff[i];
}// goodconst stuffCopyGood = [...stuff];

使用 Var

使用 const 保證一個(gè)變量不能重新賦值，能夠減少 bug 以及提高代碼可讀性。

// badvar x = "badX";var y = "baxY";// goodconst x = "goodX";const y = "goodX";復(fù)制代碼

If you really need to reassign a variable, always prefer let over var . 如果真的需要對(duì)一個(gè)變量重新賦值，使用 let 代替 var。

let 作用于塊作用域，而 var 作用于函數(shù)作用域。

塊作用域使變量?jī)H在定義它的代碼塊中有效，在塊作用域外訪問(wèn)變量將會(huì)提示 ReferenceError。

for(let i = 0; i < 10; i++){  //something}
print(i) // ReferenceError: i is not defined復(fù)制代碼

定義在函數(shù)作用域的變量可以在定義它的函數(shù)范圍內(nèi)使用。

for(var i = 0; i < 10; i++){  //something}console.log(i) // Outputs 10復(fù)制代碼

let和const定義都變量都可以在塊作用域訪問(wèn)到。

不使用模板字符串

手動(dòng)拼接字符串寫(xiě)起來(lái)非常復(fù)雜，讀起來(lái)很困惑。看例子：

// badfunction printStartAndEndDate({ startDate, endDate }) {  console.log('StartDate:' + startDate + ',EndDate:' + endDate)
}

模板字符串提供清晰和易讀的在字符串插入變量的方法。

// goodfunction printStartAndEndDate({ startDate, endDate }) {  console.log(`StartDate: ${startDate}, EndDate: ${endDate}`)
}

模板字符串提供了也簡(jiǎn)單的方法換行，你只需要在鍵盤(pán)按下 enter 鍵，像你平時(shí)（在系統(tǒng)）使用一樣。

// prints on two linesfunction printStartAndEndDate({ startDate, endDate }) {  console.log(`StartDate: ${startDate}
  EndDate: ${endDate}`)
}

以上是Javascript使用數(shù)組解構(gòu)獲取函數(shù)的多個(gè)返回值的方法的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

網(wǎng)站標(biāo)題：Javascript使用數(shù)組解構(gòu)獲取函數(shù)的多個(gè)返回值的方法
URL標(biāo)題：http://vcdvsql.cn/article34/gjjope.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供營(yíng)銷(xiāo)型網(wǎng)站建設(shè)、網(wǎng)站制作、定制開(kāi)發(fā)、企業(yè)建站、做網(wǎng)站、App設(shè)計(jì)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)