根据字符串获取对象深度属性

在vue2中，不少在取值操作时，都存在根据字符串来获取响应变量中的属性。例如watch的声明，模板编译时从html取值等。

具体做法参考如下：

function getValueByStr(expr = "", source = {}) {
  // const
  return expr.split(".").reduce((target, value, index, exprArr) => {
    return target && target[value];
  }, source);
}

再试一下：

var obj = { a : { w : { c : 0, d : 8 }, m : 9 } }；

getValueByStr('a.w.d', obj);  // 取正确值时
// 8
getValueByStr('a.w.d.u', obj);  // 取错误值时
// undefined

证明正确。

假如像直接在一个未知对象变量上安全取值，则可以在Object的原型上绑定一个修改后的该方法：

Object.prototype.getValueByStr = function (expr = "") {
  // const
  return expr.split(".").reduce((target, value, index, exprArr) => {
    return target && target[value];
  }, this);
}
// 测试一下
var obj = { a : { w : { c : 0, d : 8 }, m : 9 } }；
obj.getValueByStr('a.w.c');
// 0