如何通过通用函数从JS对象提取键值?

时间:2020-01-01 07:57:12

标签: javascript

我尝试从JS对象中提取一个值。

这是我的数据-

var data = {
  "productServicing": {
    "title": "Personalization",
    "varients": {
      "MachineEngraving": {
        "title": "Standard Engraving",
        "styles": {
          "Block": "Block",
          "Roman": "Sterling Roman",
          "Script": "Script",
          "FrenchScript": "French Script",
          "ItalicRoman": "Sterling Italic",
          "American_Typewriter": "American Typewriter"
        }
      },
      "Monogrammings": {
        "title": "Monogrammings",
        "styles": {
          "Monogramming_Roman": "Roman",
          "Monogramming_Block": "Block",
          "Monogramming_Roman_Script": "Roman Script",
          "Monogramming_Round": "Round",
          "Monogramming_Script": "Script",
          "Monogramming_American_Typewriter": "American Typewriter"
        }
      },
      "HandEngravings": {
        "title": "Hand Engravings",
        "styles": {
          "Block": "Block",
          "Roman": "Sterling Roman",
          "FrenchScript": "French Script",
          "lady_bug": "Lady bug",
          "hummingbird": "Hummingbird",
          "strawberry": "Strawberry",
          "archival_horseshoe": "Archival Horseshoe",
          "lucky_7": "Lucky 7"
        }
      }
    }
  }
}

现在,我想从上面绕过的variant键中搜索提取值。 例如-如果我传递“ MachineEngraving”和“ FrenchScript”,它将返回我-“ French Script”值。

我尝试过的-

function getTextfromData(obj, type, style){

    // obj      = data
    // type     = MachineEngraving;
    // style    = FrenchScript;

    for (var i = 0; i < obj.length; i++) {
        if (obj[i][key] == style) {
            return i;
        }
    }

console.log(getTextfromData(data.productServicing.varients, "MachineEngraving", "FrenchScript"));
}

2 个答案:

答案 0 :(得分:3)

您不需要for循环。如果您知道对象的结构,则可以简单地执行以下操作:

var data = { "productServicing": { "title": "Personalization", "varients": { "MachineEngraving": { "title": "Standard Engraving", "styles": { "Block": "Block", "Roman": "Sterling Roman", "Script": "Script", "FrenchScript": "French Script", "ItalicRoman": "Sterling Italic", "American_Typewriter": "American Typewriter" } }, "Monogrammings": { "title": "Monogrammings", "styles": { "Monogramming_Roman": "Roman", "Monogramming_Block": "Block", "Monogramming_Roman_Script": "Roman Script", "Monogramming_Round": "Round", "Monogramming_Script": "Script", "Monogramming_American_Typewriter": "American Typewriter" } }, "HandEngravings": { "title": "Hand Engravings", "styles": { "Block": "Block", "Roman": "Sterling Roman", "FrenchScript": "French Script", "lady_bug": "Lady bug", "hummingbird": "Hummingbird", "strawberry": "Strawberry", "archival_horseshoe": "Archival Horseshoe", "lucky_7": "Lucky 7" } } } } }

function getTextfromData(obj, type, style) {
    return obj[type].styles[style]
}

console.log(
  getTextfromData(data.productServicing.varients, "MachineEngraving", "FrenchScript")
) // should return "French Script"

答案 1 :(得分:1)

您的情况是使用命名键遍历几个对象从而找到一个值的情况。
在我看来,您的函数应为:

function getTextfromData1( obj, type, style){
    let keys = Object.keys(obj);  // returns keys [ 'MachineEngraving', 'Monogrammings', 'HandEngravings' ]
    let retValue ='';  // the function should return a value 

    keys.forEach( function( element){
        if (element == type) {
            let thisKeys = Object.keys( obj[element] );  // returns keys [ 'title', 'styles' ]

            let styles =  Object.keys( obj[element][ thisKeys[1] ]);

                styles.forEach( function( font ){
                    if ( font == style ) {
                        retValue = obj[element][thisKeys[1]][font];
                    }
                });

        }
    });
    return retValue;
}

let font = getTextfromData1( data.productServicing.varients, "MachineEngraving", "FrenchScript" );
console.log ( font );

或者您也可以只写一个箭头功能:

const getTextfromData2 =( obj, type, style) => obj[type].styles[style];

let font2 = getTextfromData2( data.productServicing.varients, "MachineEngraving", "FrenchScript" );
console.log ( font2 );  // logs French Script

let font3 = getTextfromData2( data.productServicing.varients, "HandEngravings", "lucky_7" );
console.log ( font3 );  // logs Lucky 7

去吧。