Was ist eine bessere js Coding Practice?

Question

Ich muss API-Aufrufe senden, um Daten aus mehreren Quellen zu erhalten. Die Daten, die ich bekomme, sind in einem anderen Format (Arrays, Objekte, verschachtelte Arrays). Eine Sache, über die ich mich gut fühle, ist eine Funktion zu haben, die mir die Teile herausholt, die ich brauche. .

Jetzt frage ich mich, wenn ich diese Extraktionsfunktion zu extrahieren haben oder einfach nur die Daten, die ich brauche, wenn ich es verwenden (Einfach ausgedrückt: was man eine bessere Praxis ist?)

Ich persönlich bevorzuge die letztere, weil Ich muss nicht hin und her gehen, um sicher zu gehen, welchen Teil der Daten ich extrahieren muss. Eg.

Extraktion Inline

const data = get("example.com").data[0].Users; 

Verwenden Funktionsdaten zu extrahieren

const data = getData("example.com"; 

const getData = async(url)=>{ 
    const rawData= await get(url); 
    switch(url){ 
    case EXAMPLE_URL: 
     return rawData.data[0].Users; 
    case OTHER_EXAMPLE_URL: 
     return rawData.data; 
    case OTHER_URL: 
    return rawData.data[0].Enum; 

} 
} 

Answer 1

I, die in mehrere Funktionen geteilt würde. Imo, der Aufrufer sollte nicht wissen müssen, welche URL übergeben werden soll, um einen eindeutigen Wert zu erhalten.

Und Sie wissen nicht, ob Sie mit dem Abrufen von zwei verschiedenen Werten aus derselben URL enden.

//maybe using a simple utility 
const getUrlPath = (url, ...path) => { 
    let fetchPath = path.reduceRight((next, key) => obj => next(obj[key]), identity); 
    return() => get(url).then(fetchPath); 
} 
const identity = v => v;  

//and then creating the different functions to get the different values 
const getExample = getUrlPath(EXAMPLE_URL, "data", 0, "Users"); 
const getOther = getUrlPath(OTHER_EXAMPLE_URL, "data"); 
... 

Answer 2

Eine Kernidee Sie zielen sollen ist eine Funktion nur eine Sache tun soll, aber sehr verflixt gut darin, so zielt nicht für ‚ein func sie alle zu regieren.‘ Lösung.

In Ihrem Fall suchen Sie drei Dinge in zwei Aufgaben, holen von URL, und extrahieren Daten aus dem Ergebnis. Ich schlage vor, Sie erstellen Funktion für diese

// Task 1: Fetch URL 
const fetchUrl = async() => { 
    const response = await fetch('example.com', { ...some options }); 

    // Do some error checking (just demo code for idea) 
    if (response.status === 'error') throw new Error('fethcing Error Message'); 

    // If no error found, return with response 
    return response; 
} 


// Task 2: extract data 
const getUserFromResponse = response => response.data[0].Users; 

const getEnumFromResponse = response => response.data[0].Enum; 

Jetzt können Sie diese in Ihre Arbeitsfunktionen komponieren.

const getUser = async() => { 
    try { 
    const response = await fetchUrl(); 
    const user = getUserFromResponse(response); 
    return user; 
    } catch (e) { 
    // do error handling 
    } 
} 

const getEnum = async() => { 
    try { 
    const response = await fetchUrl(); 
    const enum = getEnumFromResponse(response); 
    return enum; 
    } catch (e) { 
    // do error handling 
    } 
} 

Funktionen auf eine einzige Aufgabe brechen wird es einfacher, einen Testfall zu erstellen und in mehr wiederverwendbaren Codes Schreibkraft zu hoffen, dass dies hilft, cheers :)