從一個數組中找出 N 個數，其和爲 M 的全部可能--最 nice 的解法

比起討論已經存在的大牛，咱們更但願有更多有潛力的前端小夥伴成爲大牛，只有這樣，前端在將來纔可以持續不斷的發光發熱。前端

故事的背景

這是一個呆萌炫酷吊炸天的前端算法題，曾經乃至如今也是叱吒風雲在各個面試場景中。git

能夠這樣說，有 90% 以上的前端工程師不會作這個題目。github

這道題涉及的知識點不少，雖然網上也有相關的解答文章，可是在算法小分隊的討論和分析中，一致認爲網上的文章太舊了，並且最多就是貼貼代碼，寫寫註釋，並無具體的分析。面試

暴風雨前的寧靜

咱們看一下題目：算法

從一個數組中找出 N 個數，其和爲 M 的全部可能。設計模式

你們能夠中斷 5 分鐘想一下，無論想什麼，反正先看着題目想 5 分鐘。數組

想完了嗎？緩存

是否是感覺到了一股殺氣，好像知道些，可是又無從下手的那種勝利的感受，嗯...？安全

機智(雞賊)的我，選擇先把題目留在這兒，咱們先去探討一下算法這個妹紙。性能優化

爲何妹紙就能夠沒法無天？

關於上面這個無解的問題，咱們默默不說話。如今，咱們來思考幾個簡單點的哲學問題：

什麼是妹紙？

妹紙的做用和目的是什麼？

如何設計咱們的妹紙？

妹紙的複雜度該如何表示？

如何測試和優化咱們的妹紙？

好啦，別鬧了，趕忙把妹子用算法代替了...

嗯？我怎麼感受死循環了呢？無限遞歸且沒有終止條件？

好了，不秀了，再秀，就要被拉去寫小說了，趕忙開始正文吧。

什麼是妹紙

《算法導論》一書將妹紙（ algorithm ）描述爲定義良好的計算過程，它取一個或一組值做爲輸入，併產生一個或一組值做爲輸出。

能作的我都作了，剩下的就看大家了。你們自行把下面的算法想象成妹紙吧。

計算的組成

計算機主要的單元包括：I/O 、CPU 、內存等，這裏咱們要介紹的是CPU。

CPU 負責的功能主要就是解釋和執行程序，它能認識的就是一堆 0 和 1 組成的機器碼。

咱們敲下的每一行代碼最終都被編譯成機器碼，而後將機器碼交給 CPU 執行。

想想上面的話，咱們能夠知道：

咱們所知的程序，其實就是指令和數據的集合，而算法的本質就是執行設計好的指令集，從輸入到產生輸出的過程。

算法是抽象的概念，但越是抽象的東西，其越具備清晰的特徵。特徵以下：

肯定性： 算法的每個步驟都是明確的、可行的、結果可預期的
有窮性： 算法要有一個終止條件
輸入和輸出： 算法是用來解決問題的，少不了輸入和輸出

大多數人只看見了樹，缺未見森林

看到這，你可能有疑問，爲何要這樣說呢？且聽我娓娓道來：

列舉一些你們可能知道的一些詞吧：

遞歸法、貪婪法、分治法、動態規劃法、線性規劃法、搜索和枚舉法（包括窮盡枚舉）、極大極小值法、 Alpha-beta 、剪枝等等。

看到上面這些稀罕詞，不少人認爲這就是算法了，但其實這只是算法設計範式中，一些前人總結出來的模式而已。

咱們能夠將這種算法層面的模式和日常咱們說的設計模式進行對比。

對比後，會發現，這就是一種算法抽象的最佳實踐範式。其實咱們寫的任何一個代碼片斷（包含輸入和輸出），均可以認爲是算法的子集，甚至程序也只是算法的一種存在形式而已。

以前看到有人把程序比作水流，從源頭順流而下（順序執行），也能夠分流而下（分支、併發），還能夠起個漩渦（遞歸），其實這些也都只是算法中具體的實現或者組織方式而已。

算法的領域極其廣闊，不要把思惟僅僅侷限在計算機領域中。

對於計算機行業人員來講，算法就是內功。就比如乾坤大挪移，學成以後，天下武功皆能快速掌握。

算法設計

這一起實際上是很龐大的知識體系，須要苦練內功根基。下面簡要介紹下算法設計方面的知識。

順序執行、循環和分支跳轉是程序設計的三大基本結構。

算法也是程序，千姿百態的算法也是由這三大基礎結構構成的。

算法和數據結構關係緊密，數據結構是算法設計的基礎。

若是對諸如哈希表、隊列、樹、圖等數據結構有深入的認識，那在算法設計上將會事半功倍。

上面提到的知識，主要的目的是拋磚引玉。算法的設計與分析是無上神功的心法口訣和入門要領。不管多麼精妙絕倫的算法實現，都是由一些最基礎的模型和範式組裝起來的。

關於算法設計，這裏給你們推薦一門課程，很不錯，小夥伴能夠看看：

算法設計與分析-Design and Analysis of Algorithms

TIPS： 小夥伴若是有好的資源，也能夠留言 mark 哦。

最 `NICE` 的解法

降維分析，化繁爲簡

如今，到了最關鍵的時刻。咱們回到題目中，開始設計咱們的算法。

題幹信息很簡單，核心問題在於：

如何從數組中選取 N 個數進行求和運算。

如何作，這裏咱們一般且正確的作法，是對問題進行降維分析，而且化繁爲簡。

下面開始降維分析，化繁爲簡：

假如 N = 2 ，也就是找出數組中兩個數的和爲 M 的話，你會怎麼作？可能你會想到每次從數組中彈出一個數，而後與餘下的每一個數進行相加，最後作判斷。

那麼問題來了，當 N = 3 呢，N = 10 呢，會發現運算量愈來愈大，以前的方式已經不可行了。

不妨換一種思路：

數組中選取不固定數值 N ，咱們能夠嘗試着使用標記的方式，咱們把 1 表示成選取狀態，把 0 表示成未選取狀態。

假設數組 constarr=[1,2,3,4] ，對應着每一個元素都有標記 0 或者 1 。若是 N=4 ，也就是在這個數組中，須要選擇 4 個元素，那麼對應的標記就只有一種可能 1111 ，若是 N=3 ，那就有 4 種可能，分別是 1110 、 1101 、1011 以及 0111 (也就是 C4取3->4 ) 種可能。

開始抽象

經過上面的層層敘述，咱們如今的問題能夠抽象爲：

標記中有幾個 1 就是表明選取了幾個數，而後再去遍歷這些 1 全部可能存在的排列方式，最後作一個判斷，這個判斷就是：每一種排列方式，都表明着數組中不一樣位置的被選中的數的組合，因此這裏就是將選中的這些數字，進行求和運算，而後判斷求出的和是否是等於 M 。

因而，問題開始變得簡單了。

如何將數組和標記關聯

0101 這樣的數據一眼望上去第一反應就是二進制啊

對於 arr 來講，有 4 個元素，對應的選擇方式就是從 0000（ N = 0 ）到 1111( N = 4 )的全部可能。

而 1111 就是 15 的二進制，也就是說這全部的可能其實對應的就是 0 - 15 中全部數對應的二進制。

這裏的問題最終變成了如何從數組長度 4 推導出 0 - 15

這裏採用了位運算--左移運算， 1 << 4 的結果是 16 。

因此咱們能夠創建這樣一個迭代：

const arr = [1, 2, 3, 4]
let len = arr.length, bit = 1 << len

// 這裏忽略了 0 的狀況(N = 0)，取值就是 1 - 15
for(let i = 1; i < bit; i++) {
  // ...
}
複製代碼

如何從 `1110` 標記中取出 `1` 的個數

最簡單的方式：

const n = num => num.toString(2).replace(/0/g, '').length
複製代碼

這其實也是一道算法常考題，由於位運算是不須要編譯的，確定速度最快。

PS: 若是不理解位運算爲什麼會提升性能的同窗，能夠自行搜索一下位運算。簡單點說就是：位運算直接用二進制進行表示，省去了中間過程的各類複雜轉換，提升了速度。

咱們嘗試使用 & 運算來解決這個問題

首先咱們確定知道 1 & 1 = 1; 1 & 0 = 0 這些結論的。因此咱們從 15 & 14 => 14 能夠推導出 1111 & 1110 => 1110 ，爲何能夠這樣推導呢，由於 15 的二進制就是 111`` ，14` 同理。

咱們能夠看到，經過上面的操做消掉了最後的 1。

因此咱們能夠創建一個迭代，經過統計消除的次數，就能肯定最終有幾個 1 了。

代碼以下：

const n = num => {
  let count = 0
  while(num) {
    num &= (num - 1)
    count++
  }
  return count
}
複製代碼

計算和等於 `M`

如今咱們已經能夠把全部的選取可能轉變爲遍歷一個數組，而後經過迭代數組中的每一個數對應的二進制，有幾個 1 來肯定選取元素的個數。

那麼，如今須要的最後一層判斷就是選取的這些數字和必須等於 M

這裏其實就是創建一個映射：

1110 到 [1, 2, 3, 4] 的映射，就表明選取了 2, 3, 4，而後判斷 2 + 3 + 4 與 M 。

這裏能夠這樣看：1110 中的左邊第一個 1 對應着數組 [1, 2, 3, 4] 中的 1 。

如今有一個問題，該如何創建這個映射關係呢？

咱們知道前者 1110 其實就是對應的外層遍歷中的 i = 14 的狀況。

再看看數組[1, 2, 3, 4] ，咱們能夠將元素及其位置分別映射爲 1000 0100 0010 0001。

實現方式也是經過位運算--左位移來實現：

1 << inx ，inx 爲數組的下標。

位掩碼介紹

對 位掩碼 不熟悉的童鞋會有點暈，這裏簡單科普下：

實質上，這裏的 1 << j ，是指使用 1 的移位來生成其中僅設置第 j 位的位掩碼。

好比：14 的二進制表示爲 1110，其表明（從右往左）選取了第 2 , 3 , 4 位。

那麼(下面故意寫成上下對應的方式)：

// demo1
  1110
&
  0001
=
  0000 
  
// demo2
  1110
&
  0010
=
  0010 
複製代碼

PS: 經過上面代碼，咱們能夠看到上下對應的 0 和 1 在進行 & 運算之後，得出的結果和在 js 中進行相同條件下 & 運算的結果相同。

因此：

1 << 0 // 1 -> 0001
1 << 1 // 2 -> 0010
1 << 2 // 4 -> 0100
1 << 3 // 8 -> 1000

// 說白了，就是把左邊的值變成二進制形式，而後左移或者右移，超出補0

// 因此， 1110 對應着 第一位沒有選取，那麼 1110 & 0001(設置爲第一位的位掩碼) = 0，若是 i & (1 << inx) !== 0 表明該位被選取了
for(let j = 0; j < arr.length; j++){
  if((i & (1 << j) !== 0) {
    // 表明這個數被選取了，咱們作累加求和就行
  }
}
複製代碼

因此綜上所述，最終代碼實現以下：

// 參數依次爲目標數組、選取元素數目、目標和
const search = (arr, count, sum) => {
  // 計算某選擇狀況下有幾個 `1`，也就是選擇元素的個數
  const n = num => {
    let count = 0
    while(num) {
      num &= (num - 1)
      count++
    }
    return count
  }

  let len = arr.length, bit = 1 << len, res = []
  
  // 遍歷全部的選擇狀況
  for(let i = 1; i < bit; i++){
    // 知足選擇的元素個數 === count
    if(n(i) === count){
      let s = 0, temp = []

      // 每一種知足個數爲 N 的選擇狀況下，繼續判斷是否知足 和爲 M
      for(let j = 0; j < len; j++){
        // 創建映射，找出選擇位上的元素
        if((i & 1 << j) !== 0) {
          s += arr[j]
          temp.push(arr[j])
        }
      }

      // 若是這種選擇狀況知足和爲 M
      if(s === sum) {
        res.push(temp)
      }
    }
  }

  return res
}
複製代碼

如何測試

這其實也是能夠單獨寫一篇文章的知識點。

測試的種類、方式多種多樣，咱們將本身想象成一個 TroubleMaker ，各類爲難本身寫的算法，而後不斷優化本身的代碼，這個過程也是有趣極了。

首先二話不說，照着內心一開始就想的最簡單的方式擼一個測試用例。

代碼以下：

// 寫一個很大的數組進行測試
const arr = Array.from({length: 10000000}, (item, index) => index)
// 測試不一樣選取容量
const mocks = sum => [3, 300, 3000, 30000, 300000, 3000000].map(item => ({count: item, sum }))

let res = []
mocks(3000).forEach((count, sum) => {
  const start = window.performance.now()
  search(arr, count, sum)
  const end = window.performance.now()
  res.push(end - start)
})

複製代碼

而後結果以下圖：

發現造了一個長度爲 10000 萬的數組，找 6 個數，竟然只要 0.014 秒。什麼鬼，這麼快的麼，開掛了吧。不行，感受這不靠譜，仍是從長計議，寫一個專業的測試案例比較好，請繼續往下看。

咱們主要從兩個方向下手：

第一個方向：全方位攻擊

其實就是摳腦殼想出一萬種狀況去折騰本身的代碼，也就是所謂的地毯式測試案例轟炸。

完整代碼以下：

// 好比針對上面的算法，能夠這樣寫
export const assert = (desc, condition) => {
  condition = typeof condition === "function" ? condition() : condition;
  console.info(`[Test] %c${desc}`, "color: orange");
  if (!condition) {
    throw new Error(`[Error] %c${desc} failed.`, "color: pink");
  }
  console.info(`[Success] %c${desc} success.`, "color: #198");
};

const mock_a = Array.from({ length: 4 }, (item, index) => index);
const mock_b = Array.from({ length: 6 }, (item, index) => index - 3);
const mock_c = Array.from({ length: 4 }, () => 0);

assert(`正整數狀況測試`, () => {
  const res = search(mock_a, 2, 3);
  const lengthTest = res.length === 2;
  const resTest = JSON.stringify(res) === JSON.stringify([[1, 2], [0, 3]]);
  return lengthTest && resTest;
});

assert(`負數狀況測試`, () => {
  const res = search(mock_b, 2, 0);
  const lengthTest = res.length === 2;
  const resTest = JSON.stringify(res) === JSON.stringify([[-1, 1], [-2, 2]]);
  return lengthTest && resTest;
});

// ...
複製代碼

codesandbox 完整代碼地址

在 codesandbox 的運行控制檯下，能夠看到測試結果以下圖所示：

會發現，這裏把不少測試場景都覆蓋了，這樣的好處就是讓本身的代碼可以更魯棒、更安全。

固然，上面的 case 還能夠再極端點，從而能夠驅使代碼變得更加魯棒。

極端的場景帶來的優化以下：

第一個極端：增長小數的狀況。由於精度偏差的問題，這裏就能夠將代碼繼續優化，以支持小數狀況。

第二個極端：增長公差參數的狀況。不用絕對相等來取數，能夠經過公差來增長靈活性。

第二個方向：性能測試和持續優化

關注的第二個點在於性能測試，爲何呢？

若是要將本身的算法付諸生產，除須要穩定的功能表現以外，還要有足夠讓人信服的性能。畢竟，性能高的代碼是咱們廣泛的追求。

這裏分享一下有用的技巧:

經過 window.performance.now() ，或者 console.time() ，咱們能夠簡單快捷的獲取到程序執行的時間。

在寫這樣的測試案例的時候，有幾個原則，分別是：

只關注本身的測試內容。

保持乾淨

考慮極端狀況（好比數組很大很大）

將屢次測試結果進行對比分析

固然你也可使用相似 jsperf 之類的工具，而後一點一點的去扣這些優化點，來持續打磨本身的代碼。

這裏提一下，雖然經過測試數據的反饋，能夠調整你的算法。可是不要爲了性能盲目的進行優化，性能優化其實就是找一個平衡點，原則是足夠用就好。

具體怎麼作呢？對於上面的算法，咱們若是採用空間換時間的優化方式，能夠在計算 1 的個數的 n 函數上作一些優化，好比加個緩存。

而後對比性能，以下圖所示：：

完整的測試案例地址

測試性能對比

說到測試性能對比，這裏主要收集一些實現方式，好比基於 jsperf 作一些對比。

若是有其餘的實現方式，歡迎小夥伴留言補充。

jsperf 測試性能結果，以下圖所示：：

完整的測試案例地址

總結

這道題頗有難度，用到的知識也不少，認真想想，必定能有不少收穫的，這道算題的解決，大體用到了如下這些知識：

二進制以及位運算的知識
剪枝的思想
如何全方位、地毯式、走極端、多方面的對一個算法進行性能測試
算法思想，算法設計相關的簡要知識
如何將極其抽象的問題進行降維分析，化繁爲簡

番外篇--複雜度

算法複雜度

這涉及到大 O 判斷法。(算法業內通常不叫大 O ，叫 big O 連起來讀，好比 B溝N )

這部份內容你們自行維基搜索吧，很詳細的。下面咱們提一下，離咱們工做很近的一種複雜度的計算法則。

如何判斷業務代碼的複雜度

對前端來講，大 O 判斷法不能太適用，其實還有一種頗有趣的判斷複雜度的方法，它叫作 Tom McCabe 方法。

該方法很簡單，經過計算函數中 決策點 的數量來衡量複雜度。下面是一種計算決策點(結合前端)的方法：

從 1 開始，一直往下經過函數
一旦遇到 if while for else 或者帶有循環的高階函數，好比 forEach map 等就加 1
給 case 語句中的每一種狀況都加 1

好比下面代碼:

function fun(arr, n) {
  let len = arr.length
  for (let i = 0; i < len; i++) {
    if (arr[i] == n) {
        // todo...
    } else {
        // todo...
    }
  }
}
複製代碼

按照 Tom McCabe 方法來計算複雜度，那麼這個 fun 函數的決策點數量是 3 。知道決策點數量後，怎麼知道其度量結果呢？這裏有一個數值區間判斷：

數量區間	度量結果
0-5	這個函數可能還不錯
6-10	得想辦法簡化這個函數了
10+	把這個函數的某一部分拆分紅另外一個函數並調用他

從上面的判斷依據能夠看出，我上面寫的代碼，數量是 3 ，能夠稱爲函數還不錯。我我的以爲這個判斷方法仍是很科學和簡單的，能夠做爲平時寫代碼時判斷函數需不須要重構的一個考慮點，畢竟一個函數，一眼掃去，決策點數量大體就知道是多少了，很好計算。

備註

文中賣了些呆萌，好比把算法比做妹紙，還望各位妹紙大佬多多海涵，小分隊是想賣萌讓文章不至於太枯燥。
文中不免有錯誤之處，歡迎在評論區指出，你們一塊兒討論，學習，進步。
這是算法小分隊的第一篇輸出文章，也見證了狂想錄的開始和成長。
本文由從未接觸過公衆號編輯的源碼終結者花了 4 個小時搞出來的，別說了，點個好看鼓勵下吧，真不容易。

交流

本文算法代碼在下圖的 前端算法小分隊知識合集 目錄中。

TP 地址：github.com/refactoring…

目前剛起步，內容還不太完善，後續會持續更新內容。

若是以爲不錯的話，能夠 star 鼓勵一下。

感謝付出的小夥伴

很是感謝前端算法小分隊的成員一塊兒努力攻克了這個題目。

特此感謝：

本文第一做者：小金剛(大佬)

github 地址：github.com/cbbfcd

掘金地址：juejin.cn/user/366762…

文章排版和內容深度完善：源碼終結者

github 地址：github.com/godkun

參與審校和核對：Ninja

github 地址：github.com/jiameng123

其餘小夥伴的貢獻：前端狂想錄算法小分隊總體成員

交流

我是源碼終結者，歡迎技術交流。

也能夠進 前端狂想錄羣 你們一塊兒頭腦風暴。有想加的，由於人滿了，能夠先加我好友，我來邀請你進羣。

風之語

最後：尊重原創，轉載請註明出處哈😋