在ES2015中創建API服務的實例

我主要是一位C＃開發人員，在JavaScript/EcmaScript方面的經驗有限，並試圖理解創建API服務實例的正確方法，我可以在我的函數中重用該實例。在ES2015中創建API服務的實例

我正在使用的應用程序是一個React應用程序，我嘗試使用的API服務是Google Places。我爲所有Google Places相關功能創建了一個外部文件，以便它們可重複使用。以下是我在該文件中的函數，它會使API調用從Google獲得一些建議。

export const googleCall = (keyword) => { 
    const googlePlacesAutocomplete = new google.maps.places.AutocompleteService(); 
    googlePlacesAutocomplete.getQueryPredictions({input: keyword}, callback); 
}

這是沒有意義的，以保持「新」荷蘭國際集團（）新的鍵擊進入該功能，每次google.maps.places.AutocompleteService。

我能想到的一個選擇是，在我的React應用程序中 - 比如在ComponentWillMount中 - 我可以創建此服務的一個實例，然後將其與關鍵字一起傳遞到此函數中，但似乎有點麻煩。這將是這個樣子：

export const googleCall = (googleService, keyword) => { 
    googleService.getQueryPredictions({input: keyword}, callback); 
}

我認爲更好的辦法是，以確保googleCall（）函數可以訪問什麼在我的終極版店內的狀態，即。換句話說，我可以在ComponentWillMount函數中創建一個googleService實例，並將其放入我的redux商店。只是不知道如何讓這個功能訪問我的狀態。

或者更一般地說，在ES中 - 特別是在ES2015中 - 如何創建一個我的googleCall函數可以在每次我調用它時訪問而不必創建新服務實例的服務實例？我只是不確定這是如何在ES中完成的，我們創建了一些實例並將其保存在內存中用於隨後的調用。

UPDATE：

在我的陣營組成部分，我只是得到了googleCall功能是這樣的：

import {googleCall} from '../googlePlacesFunctions';

來源

2016-12-14 Sam

原路多個實例在C＃這樣做的;使用變量？這聽起來更像是如何在React中做到這一點的問題。您可能需要在標題和文本中強調這一點。 –

只需使用單例模式。 – Bergi

在模塊中使用私有變量：'var googlePlacesAutocomplete; export googleCall =（keyword）=> {！googlePlacesAutocomplete} googlePlacesAutocomplete = new google.maps.places.AutocompleteService（）; googlePlacesAutocomplete.getQueryPredictions（{input：keyword}，callback）; } @ – Thomas

我有點被你的問題混淆。爲什麼不只是？

// api.js 

const googlePlacesAutocomplete = new google.maps.places.AutocompleteService(); 

export const googleCall = (keyword, callback) => { 
    googlePlacesAutocomplete.getQueryPredictions({input: keyword}, callback); 
}

你不通過周圍的事物，任何地方，你不創造AutocompleteService

來源

2016-12-14 23:04:55 azium

正如我所說，我對JS/ES的知識是有限的，所以我相信我的問題是非常基本的。我在我的React組件中導入了googleCall（）函數 - 請參閱原始文章中的更新 - 所以我不確定是否googlePallcesAutocomplete可用於googleCall（）函數，如果我要聲明並實例化它外部文件。看起來您正在「導入」api.js，我認爲它會包含一些Google Places API庫。 – Sam

@Sam，在JS中查看*閉包*的概念。這是瞭解 – Thomas

@Thomas最重要的功能之一。我只是讀了它，我認爲你說的是，即使googlePlacesAutocomplete超出範圍就React組件而言，因爲我將googleCall（）導入到我的組件中，而googleCall（）需要服務，googlePlacesAutocomplete的實例將被創建並保持在範圍內 - 這是由於JS中的閉包概念。 – Sam

在ES2015中創建API服務的實例

回答

相關問題