时间戳

首页 > 解决方案 > JavaScript Object：如何仅动态检索不为空的键值对

javascript - JavaScript Object：如何仅动态检索不为空的键值对

问题描述

考虑到你知道我是相当新的问题......我需要以下帮助：通过一个api，我每次都会得到一个不同的对象，如下所示。每个对象都有存储在字符串中的“成分”，例如：strIngredient1、strIngredient2 等。现在并非所有字符串都具有此键值对中的值：("strIngredient5": null)。我如何设法只获取不为空的字符串？鉴于我事先不知道我的对象将有多少 strIngredients？并且还考虑到每个 strIngredient 都有不同的后缀号？

[{
    "idDrink": "11007",
    "strDrink": "Margarita",
    "strDrinkAlternate": null,
    "strDrinkES": null,
    "strDrinkDE": null,
    "strDrinkFR": null,
    "strDrinkZH-HANS": null,
    "strDrinkZH-HANT": null,
    "strTags": "IBA,ContemporaryClassic",
    "strVideo": null,
    "strCategory": "Ordinary Drink",
    "strIBA": "Contemporary Classics",
    "strAlcoholic": "Alcoholic",
    "strGlass": "Cocktail glass",
    "strInstructions": "Rub the rim of the glass with the lime slice to make the salt stick to it. Take care to moisten only the outer rim and sprinkle the salt on it. The salt should present to the lips of the imbiber and never mix into the cocktail. Shake the other ingredients with ice, then carefully pour into the glass.",
    "strInstructionsES": null,
    "strInstructionsDE": "Reiben Sie den Rand des Glases mit der Limettenscheibe, damit das Salz daran haftet. Achten Sie darauf, dass nur der äußere Rand angefeuchtet wird und streuen Sie das Salz darauf. Das Salz sollte sich auf den Lippen des Genießers befinden und niemals in den Cocktail einmischen. Die anderen Zutaten mit Eis schütteln und vorsichtig in das Glas geben.",
    "strInstructionsFR": null,
    "strInstructionsZH-HANS": null,
    "strInstructionsZH-HANT": null,
    "strDrinkThumb": "https://www.thecocktaildb.com/images/media/drink/5noda61589575158.jpg",
    "strIngredient1": "Tequila",
    "strIngredient2": "Triple sec",
    "strIngredient3": "Lime juice",
    "strIngredient4": "Salt",
    "strIngredient5": null,
    "strIngredient6": null,
    "strIngredient7": null,
    "strIngredient8": null,
    "strIngredient9": null,
    "strIngredient10": null,
    "strIngredient11": null,
    "strIngredient12": null,
    "strIngredient13": null,
    "strIngredient14": null,
    "strIngredient15": null,
    "strMeasure1": "1 1/2 oz ",
    "strMeasure2": "1/2 oz ",
    "strMeasure3": "1 oz ",
    "strMeasure4": null,
    "strMeasure5": null,
    "strMeasure6": null,
    "strMeasure7": null,
    "strMeasure8": null,
    "strMeasure9": null,
    "strMeasure10": null,
    "strMeasure11": null,
    "strMeasure12": null,
    "strMeasure13": null,
    "strMeasure14": null,
    "strMeasure15": null,
    "strImageSource": "https://commons.wikimedia.org/wiki/File:Klassiche_Margarita.jpg",
    "strImageAttribution": "Cocktailmarler",
    "strCreativeCommonsConfirmed": "Yes",
    "dateModified": "2015-08-18 14:42:59"
  }]

感谢您以对初学者友好的方式进行解释。

标签： javascriptapiobject

解决方案

您可以做的是您可以使用以下方法将对象转换为具有键值对的数组：

const tempArray = Object.entries(arr[0]);

所以这会将对象转换为嵌套数组：

[[key, value], [key, value], [key, value], ... ]

然后使用 .filter 数组运算符，以便您可以删除所有为空的值：

const filteredArray = tempArray.filter(([key, value]) => value !== null );

最后，您可以使用 Object 类的 fromEntries 方法转换回对象。

const filteredObj = Object.fromEntries(filteredArray);

推荐阅读