オブジェクトのリテラルをパスを含むオブジェクトに変換しますか？

Question

私はオブジェクトリテラルを取って、それを新しいオブジェクトキーがパスである新しいオブジェクトに変換したいと思います。

const obj = { 
    test: { 
    qwerty: 'text', 
    abc: { 
     testing: 123 
    } 
    } 
} 

へ：

{ 
    'test.qwerty': 'text', 
    'test.abc.testing': 123 
} 

私はlodash docsを通して見てきたが、私はすぐにこれを行う可能性があるものを見ることができません。

オブジェクトリテラルは、任​​意の深さのレベルにすることができます。

これにアプローチするにはどうすればよいですか？

Answer 1

lodashが機能内蔵のいずれかを持っていますが、これはES6 arrow functions、オプションのパラメータと再帰呼び出しを使用してのアプローチであれば知ってはいけない：

const obj = { 
    test: { 
    qwerty: 'text', 
    abc: { 
     testing: 123 
    } 
    } 
} 


pathMyObject = (obj, prefix, newObj = {}) => { 
    Object.keys(obj).forEach(key => { 
     const value = obj[key]; 
     const newPrefix = (!prefix ? key : prefix + "." + key) 
     if (typeof value === 'object') { 
      pathMyObject(value, newPrefix, newObj) 
     } else { 
      newObj[newPrefix] = value; 
     } 
    }) 
    return newObj 
} 

const path = pathMyObject(obj); 

console.log(path); 
/* 
    { 
    'test.qwerty': 'text', 
    'test.abc.testing': 123 
    } 
*/ 

Answer 2

このようなオブジェクトを構築するために再帰関数を作成することができます。

const obj = { 
 
    test: { 
 
    qwerty: 'text', 
 
    abc: { 
 
     testing: 123 
 
    } 
 
    } 
 
} 
 

 
function toStrings(data) { 
 
    var r = {} 
 

 
    function inner(data, c) { 
 
    for (var i in data) { 
 
     if (typeof data[i] == 'object') inner(data[i], c + i + '.') 
 
     else r[(c + i).replace(/\.$/, "")] = data[i] 
 
    } 
 
    } 
 
    inner(data, ''); 
 
    return r; 
 
} 
 

 
console.log(toStrings(obj))

Answer 3

ここでは、再帰的です機能はLodashのreduce機能を使用しています。

const obj = { 
 
    test: { 
 
    qwerty: 'text', 
 
    abc: { 
 
     testing: 123 
 
    } 
 
    } 
 
}; 
 

 
function toPaths(obj, path) { 
 
    if (typeof obj !== 'object') { return { [path]: obj }; } 
 
    return _.reduce(obj, (result, value, key) => 
 
    Object.assign({}, result, toPaths(value, path ? `${path}.${key}` : key)) 
 
    , {}); 
 
} 
 

 
console.log(toPaths(obj));

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>

それはわずかに少ない冗長非Lodash同等以上です。ここで

const obj = { 
 
    test: { 
 
    qwerty: 'text', 
 
    abc: { 
 
     testing: 123 
 
    } 
 
    } 
 
}; 
 

 
function toPaths(obj, path) { 
 
    if (typeof obj !== 'object') { return { [path]: obj }; } 
 
    return Object.keys(obj).reduce((result, key) => 
 
    Object.assign({}, result, toPaths(obj[key], path ? `${path}.${key}` : key)) 
 
    , {}); 
 
} 
 

 
console.log(toPaths(obj));

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.js"></script>