前言
疫情無情人有情，在疫情期間，在家窩了小一個月，回杭發現自己胖了幾斤。去年秋天的減肥之旅，付之東流。
話說回來，今年文章更新的頻率下降了，主要原因是部門老大給我安排了新的任務，讓我做主程，專案進度都得自己把控，包括測試和上線都要我去督促，所以就耽誤了學習了，不過我在開發過程中，解決了一個比較有趣的問題，這是早些年困擾過我的問題，這次解決了覺得比較有趣，就分享給大家。
分析需求
產品?來了一個需求，大概是這樣的。有一個列表頁面 A，列表的每一項都有一個編輯功能，點選編輯功能跳轉到新的頁面，然後編輯該項，結束之後點選確認按鈕，要把當前編輯頁面關閉，並且要保證列表頁面 A 重新整理，展示出最新的編輯情況，畫個示意圖如下。
試問兩個 Tab 怎麼通訊呢，縱然你是神，你也得老老實實做如下操作：
找到答案
經過一番搜尋，找到了一個比較這個需求的解決方案，那就是 window.opener 這個全域性屬性。先來介紹一下它。
opener 屬性是一個可讀可寫的屬性，可返回對建立該視窗的 Window 物件的引用。當使用
window.open()開啟一個視窗，您可以使用此屬性返回來自目標視窗源（父）視窗的詳細資訊。 程式碼提示：window.opener.close()將關閉源（父）視窗。
簡單的說，就是我現在可以通過在編輯頁面 B 通過 window.opener 拿到列表頁 A 的全域性物件。
再看看它的瀏覽器支援情況：
資料來源於 www.caniuse.com 這個網站專門查詢一些瀏覽器對屬性的相容性。從圖片中可以看出 opener 的支援情況還是比較樂觀的，大多數瀏覽器都已支援。
那麼問題就變得簡單了，假設 A 頁面獲取資料的方法是 LoadData，那麼我將 LoadData 掛載到 A 頁面的一個全域性變數上，程式碼如下：
window._A_LOADDATA = LoadData;
複製程式碼全域性變數一定要注意要規範一些，避免造成全域性變數的汙染，最好 A 頁面銷燬的時候，清除一下 window._A_LOADDATA 。
然後在 B 頁面，編輯完資訊提交儲存介面的回撥函式處呼叫 window.opener._A_LOADDATA 方法：
savaEdit().then({
window.opener._A_LOADDATA()
window.close()
})
複製程式碼這樣執行 window.opener._A_LOADDATA() 後，列表頁 A 就會執行 LoadData 方法，重新整理當前頁面的資料，得到編輯後的結果。
總結
問題不難，但是希望大家能學到的是解決問題的這個過程，不要一有問題就去群裡問：“有大佬在嗎？幫我解決一下**問題”。我可以很明確的告訴你，身為大佬的我，鳥都不想鳥你（開個玩笑），自己去百度搜答案去吧。大多數問題搜尋引擎加上自己的一些分析和理解能力，都是可以迎刃而解的，實在解決不了，再去請求自己上司的幫助，相信他不會為難你。