怎樣使你的 JavaScript 代碼簡(jiǎn)單易讀(推薦)
讓我們先從怎樣刪除數(shù)組中的重復(fù)項(xiàng)這個(gè)簡(jiǎn)單問(wèn)題開(kāi)始。
復(fù)雜 - 使用 forEach 刪除重復(fù)項(xiàng)
首先,我們新創(chuàng)建一個(gè)空數(shù)組,用 forEach() 在數(shù)組的每個(gè)元素上執(zhí)行一次提供的函數(shù)。最后檢查新數(shù)組中是否存在該值,如果不存在,則添加它。
function removeDuplicates(arr) { const uniqueVals = []; arr.forEach((value,index) => { if(uniqueVals.indexOf(value) === -1) { uniqueVals.push(value); } }); return uniqueVals; }
簡(jiǎn)單 - 使用 filter 刪除重復(fù)項(xiàng)
用 filter 方法創(chuàng)建一個(gè)包含所有元素的新數(shù)組,通過(guò)提供的函數(shù)進(jìn)行測(cè)試?;旧衔覀冎恍枰鷶?shù)組,并檢查當(dāng)前元素在數(shù)組中出現(xiàn)的第一個(gè)位置是否和當(dāng)前位置相同。當(dāng)然,這兩個(gè)位置對(duì)于重復(fù)元素來(lái)說(shuō)是不同的。
function removeDuplicates(arr) { return arr.filter((item, pos) => arr.indexOf(item) === pos) }
簡(jiǎn)單 - 使用 Set 刪除重復(fù)項(xiàng)
ES6 提供了 Set 對(duì)象,這使事情變得更加容易。 Set 僅允許存在唯一值,所以當(dāng)你傳入數(shù)組時(shí),它會(huì)自動(dòng)刪除重復(fù)的值。
但是,如果你需要一個(gè)包含唯一元素的數(shù)組,為什么不一開(kāi)始就用 Set 呢?
function removeDuplicates(arr) { return [...new Set(arr)]; }
接下來(lái)讓我們解決第二個(gè)問(wèn)題:寫(xiě)一個(gè)函數(shù),向該函數(shù)傳入一組非負(fù)整數(shù),其中的值各不不同,要求使它們連續(xù),并返回缺失的數(shù)字個(gè)數(shù)。
對(duì)于const arr = [4,2,6,8],輸出應(yīng)為
countMissingNumbers(arr)= 3
你可以看到 3,5 和 7 是缺失的。
復(fù)雜 - 使用 sort 和 for 循環(huán)解決
要獲得最小和最大的數(shù)字,我們需要用用 sort方法按升序進(jìn)行排序來(lái)達(dá)到這個(gè)目的,然后從最小的數(shù)字循環(huán)到最大的數(shù)字。每次檢查數(shù)組中是否存在應(yīng)該出現(xiàn)的序號(hào),如果不存在,就對(duì)計(jì)數(shù)器加一。
function countMissingNumbers(arr) { arr.sort((a,b) => a-b); let count = 0; const min = arr[0]; const max = arr[arr.length-1]; for (i = min; i<max; i++) { if (arr.indexOf(i) === -1) { count++; } } return count; }
簡(jiǎn)單 - 使用 Math.max 和 Math.min 求解
這個(gè)解決方案有一個(gè)簡(jiǎn)單的解釋:Math.max()函數(shù)返回?cái)?shù)組中最大的數(shù)字,而Math.min() 返回?cái)?shù)組中最小的數(shù)字。
首先,如果沒(méi)有丟失數(shù)字,我們能知道數(shù)組中有多少個(gè)數(shù)字。所以可以用以下公式 maxNumber - minNuber + 1,并用這個(gè)結(jié)果減去數(shù)組長(zhǎng)度,得到的差就是缺失數(shù)字的個(gè)數(shù)。
function countMissingNumbers(arr) { return Math.max(...arr) - Math.min(...arr) + 1 - arr.length; }
最后一個(gè)問(wèn)題是檢查字符串是否為回文。所謂 回文 是一個(gè)從左到右和從右到左讀起來(lái)都一樣的字符串。
復(fù)雜 - 使用 for 循環(huán)檢查
這個(gè)方法的循環(huán)從字符串的第一個(gè)字符開(kāi)始,一直到字符串長(zhǎng)度的一半。字符串中最后一個(gè)字符的索引是 string.length-1,倒數(shù)第二個(gè)字符的索引是string.length-2,依此類推。所以在這里我們檢查從左邊開(kāi)始的指定索引處的字符是否等于右邊指定索引處的字符。如果它們不相等,就返回false。
function checkPalindrome(inputString) { let length = inputString.length for (let i =0; i<length / 2; i++) { if (inputString[i] !== inputString[length - 1 -i]) { return false } } return true }
簡(jiǎn)單 - 用 reverse 和 join 檢查
我認(rèn)為這個(gè)解決方案簡(jiǎn)單到不需要解釋,因?yàn)榇a本身說(shuō)明了一切。我們只需使用 spread operator 從字符串創(chuàng)建一個(gè)數(shù)組,然后reverse數(shù)組,最后用 join 方法將其再次轉(zhuǎn)換為字符串,并與原始字符串進(jìn)行比較。
function checkPalindrome(string) { return string === [...string].reverse().join(''); }
保持簡(jiǎn)單!
當(dāng)有更簡(jiǎn)單的方法時(shí),為什么要搞得那么復(fù)雜?希望你能從這篇文章中學(xué)到一些很有意思的思路。祝你有一個(gè)美好的編碼時(shí)間,盡量不要讓生活中簡(jiǎn)單的事情復(fù)雜化。
以上所述是小編給大家介紹的怎樣使你的 JavaScript 代碼簡(jiǎn)單易讀詳解整合,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
javascript結(jié)合Flexbox簡(jiǎn)單實(shí)現(xiàn)滑動(dòng)拼圖游戲
本文給大家分享的是一則使用javascript結(jié)合Flexbox簡(jiǎn)單實(shí)現(xiàn)滑動(dòng)拼圖游戲的代碼,雖然沒(méi)有實(shí)現(xiàn)完整的功能,但是還是推薦給大家,喜歡的朋友可以繼續(xù)做完2016-02-02Bootstrap輸入框組件簡(jiǎn)單實(shí)現(xiàn)代碼
這篇文章主要為大家詳細(xì)介紹了Bootstrap輸入框組件的簡(jiǎn)單實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03js實(shí)現(xiàn)隨機(jī)數(shù)小游戲
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)隨機(jī)數(shù)小游戲,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-06-06uniapp實(shí)現(xiàn)審批流程的具體操作步驟
這篇文章主要介紹了uniapp實(shí)現(xiàn)審批流程的具體操作方法,實(shí)現(xiàn)思路大概是需要要定義一個(gè)變量,記錄當(dāng)前激活的步驟,通過(guò)數(shù)組的長(zhǎng)度來(lái)循環(huán)數(shù)據(jù),如果有就采用3元一次進(jìn)行選擇,具體實(shí)現(xiàn)步驟跟隨小編一起看看吧2024-03-03javascript代碼簡(jiǎn)寫(xiě)的幾種常用方式匯總
任何一種編程語(yǔ)言的簡(jiǎn)寫(xiě)小技巧都是為了幫助你寫(xiě)出更簡(jiǎn)潔、更完善的代碼,讓你用更少的編碼實(shí)現(xiàn)你的需求,這篇文章主要給大家介紹了關(guān)于javascript代碼簡(jiǎn)寫(xiě)的幾種常用方式,需要的朋友可以參考下2021-08-08使用VSCode調(diào)試Electron主進(jìn)程的方法步驟
本文主要介紹了使用VSCode調(diào)試Electron主進(jìn)程的方法步驟,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-01-01