JS：如何使用对象中的动态键获得比第一级更深的值？ [复制]答案

【问题标题】：JS: How to get values deeper then first level with dynamic keys in object? [duplicate]JS：如何使用对象中的动态键获得比第一级更深的值？ [复制]
【发布时间】：2018-01-24 08:00:54
【问题描述】：

这里我有一个问题（下面的示例代码）。如何摆脱未定义的？就我而言，我只能使用一个变量，例如

object[dynamicKey]

但如果关键在对象中更深，那么第一级我会出错。

object = {
  name: 'peter',
  kidsNames: {
    name: 'carlos',
  }
}

dynamicKey1 = 'name';
dynamicKey2 = 'kidsNames.name';

console.log(object[dynamicKey1]); // 'peter'
console.log(object[dynamicKey2]); // undefined ???

我想要一个纯 JavaScript 的解决方案

解决方案：

感谢您的帮助！

在你们的帮助下，我想出了如下解决方案：

const getProp = (obj, prop) => {
   return prop.split('.').reduce((r, e) => {
       return r[e];
   }, obj);
};

getProp(object, dynamicKey2) // 'carlos'

所以现在无论你需要深入到多深的对象，它总是会给你正确的价值。

【问题讨论】：

见stackoverflow.com/questions/45670640/…
object['kidsNames']['name']。您必须使用多维数组语法
@ErrorinException OP 想要通过字符串访问属性，这是行不通的。
根本不可能。没有评估
@ErrorinException 差不多。还有其他方法。我展示了一个让某人生气的：D

标签： javascript

【解决方案1】：

它不起作用，因为JS认为kidsNames.name本身是一个键名并试图做

object['kidsNames.name']

这不起作用。但是你可以从一个基本的想法开始

var keyNames = dynamicKey2.split(".");
object[keyNames[0]][keyNames[1]];

如果您有 n 个级别，请尝试使用循环。

 
var myobject = {
    name: 'peter',
    kidsNames: {
        name: 'carlos',    
    }
}

dynamicKey1 = 'name';
dynamicKey2 = 'kidsNames.name';

var keyNames = dynamicKey2.split(".");


console.log(myobject[dynamicKey1]); // 'peter'
console.log(myobject[keyNames[0]][keyNames[1]]);  //carlos

【讨论】：

【解决方案2】：

使用可以使用递归调用来解决这个问题。见下面的代码：

var object = {
    name: 'peter',
    kidsNames: {
        name: 'carlos',    
    }
}

dynamicKey1 = 'name';
dynamicKey2 = 'kidsNames.name';

object[dynamicKey1]; // 'peter'
object[dynamicKey2];

function getValue(data, keys) {
  // If plain string, split it to array
  if(typeof keys === 'string') {
    keys = keys.split('.')
  }
  
  // Get key
  var key = keys.shift();
  
  // Get data for that key
  var keyData = data[key]
  
  // Check if there is data
  if(!keyData) {
    return undefined;
  }
   
  // Check if we reached the end of query string
  if(keys.length === 0){
    return keyData;
  }
  
  // recusrive call!
  return getValue(Object.assign({}, keyData), keys);
}

console.log(getValue(object, dynamicKey1))
console.log(getValue(object, dynamicKey2))

【讨论】：

【解决方案3】：

object = {
  name: 'peter',
  kidsNames: {
    name: 'carlos',
    child: {
      name: 'myChild',
      child: {
        fullname: 'Sam williams'
      }
    }
  }
}

dynamicKey1 = 'name';
dynamicKey2 = 'kidsNames.name';
dynamicKey3 = 'kidsNames.child.name';
dynamicKey4 = 'kidsNames.child.child.fullname';
console.log(reduce(object, dynamicKey1));
console.log(reduce(object, dynamicKey2));
console.log(reduce(object, dynamicKey3));
console.log(reduce(object, dynamicKey4));


function reduce(obj, key) {
  var keySplit = key.split('.');
  if (keySplit.length > 1) {
    return reduce(obj[keySplit[0]], keySplit.slice(1, keySplit.length).join("."));
  }
  if (keySplit.length == 1) {
    return obj[key];
  } else {
    return obj;
  }
}

这适用于任意数量的子元素，如果它们是对象，而不是数组或列表。（递归方法）

【讨论】：