javascript nested object merge All In One

javascript nested object merge All In One

deep copy / deep clone

In JavaScript, standard built-in object-copy operations (spread syntax, Array.prototype.concat(), Array.prototype.slice(), Array.from(), Object.assign(), and Object.create()) do not create deep copies (instead, they create shallow copies).

One way to make a deep copy of a JavaScript object, if it can be serialized, is to use JSON.stringify() to convert the object to a JSON string, and then JSON.parse() to convert the string back into a (completely new) JavaScript object:

https://developer.mozilla.org/en-US/docs/Glossary/Deep_copy

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

shallow copy

https://developer.mozilla.org/en-US/docs/Glossary/Shallow_copy

Object reference type

function namespace(oNamespace, sPackage) {
  // deep copy ✅
  let res = oNamespace;
  const arr = sPackage.split(".");
  //  ["a", "b", "c", "d"]
  const len = arr.length;
  for(let key of arr){
    if(key in oNamespace){
      if(typeof oNamespace[key] !== "object"){
        oNamespace[key] = {};
      } else {
        // except
      }
    } else {
      oNamespace[key] = {};
    }
    // ? 引用类型 🚀
    oNamespace = oNamespace[key];
    console.log(`\noNamespace ${key}`, JSON.stringify(oNamespace))
    console.log(`res`, JSON.stringify(res))
    // console.log(`oNamespace ${key}`, oNamespace)
    // console.log(`\nres`, res)
  }
  console.log(`\noNamespace`, oNamespace)
  console.log(`result =`, JSON.stringify(res))
  return res;
}

// namespace({a: {test: 1, b: 2}}, 'a.b.c.d')

/*

// oNamespace a {"test":1,"b":2}
// res {"a":{"test":1,"b":2}}

// oNamespace b {}
// res {"a":{"test":1,"b":{}}}

// oNamespace c {}
// res {"a":{"test":1,"b":{"c":{}}}}

// oNamespace d {}
// res {"a":{"test":1,"b":{"c":{"d":{}}}}}

// oNamespace {}
// result = {"a":{"test":1,"b":{"c":{"d":{}}}}}

*/

shallow copy bug ❌

Object.assign /

function namespace(oNamespace, sPackage) {
  const arr = sPackage.split(`.`).reverse();
  // const arr = 'a.b.c.d'.split(`.`).reverse();
  let obj = {};
  for(let k of arr) {
    obj = {[k]: obj}
  }
  // shallow copy bug ❌
  return Object.assign(oNamespace, obj);
  // return obj;
}

function namespace(oNamespace, sPackage) {
  const arr = sPackage.split(`.`).reverse();
  // const arr = 'a.b.c.d'.split(`.`).reverse();
  let obj = {};
  for(let k of arr) {
    obj = {[k]: obj}
  }
  // shallow copy bug ❌
  return {...oNamespace, ...obj};
  // return obj;
}

deep copy OK

// deep merge objects

function isObject(item) {
  return (item && typeof item === 'object' && !Array.isArray(item));
}

function mergeDeep(target, ...sources) {
  if (!sources.length) return target;
  const source = sources.shift();
  if (isObject(target) && isObject(source)) {
    for (const key in source) {
      if (isObject(source[key])) {
        if (!target[key]) Object.assign(target, { [key]: {} });
        mergeDeep(target[key], source[key]);
      } else {
        Object.assign(target, { [key]: source[key] });
      }
    }
  }
  return mergeDeep(target, ...sources);
}

demos

function namespace(oNamespace, sPackage) {
  const arr = sPackage.split(`.`).reverse();
  // const arr = 'a.b.c.d'.split(`.`).reverse();
  let obj = {};
  for(let k of arr) {
    obj = {[k]: obj}
  }
  return Object.assign({}, oNamespace, obj);
  // return obj;
}

obj = namespace({a: {test: 1, b: 2}}, 'a.b.c.d')

function namespace(oNamespace, sPackage) {
  const arr = sPackage.split(`.`).reverse();
  // const arr = 'a.b.c.d'.split(`.`).reverse();
  let obj = {};
  for(let k of arr) {
    obj = {[k]: obj}
  }
  // return Object.assign({}, oNamespace, obj);
  return obj;
}
undefined
obj = namespace({a: {test: 1, b: 2}}, 'a.b.c.d')

Object.prototype.toString

Object.prototype.toString.call({})
'[object Object]'
Object.prototype.toString.call(() => {})
'[object Function]'
Object.prototype.toString.call(BigInt(1))
'[object BigInt]'

BigInt(1);
// 1n

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt

refs

根据包名，在指定空间中创建对象

https://www.nowcoder.com/practice/a82e035501504cedbe881d08c824a381?tpId=2&&tqId=10854&rp=1&ru=/ta/front-end&qru=/ta/front-end/question-ranking

Returning Object Literals from Arrow Functions in JavaScript

https://github.com/lydiahallie/javascript-questions#98-whats-the-output

https://github.com/lydiahallie/javascript-questions/issues/220#issuecomment-523736303

const getList = ([x, ...y]) => [x, y];
const getUser = user => { name: user.name; age: user.age; }

const list = [1, 2, 3, 4];
const user = { name: "Lydia", age: 21 };

console.log(getList(list));
console.log(getUser(user));
//  [1, Array(3)]
// undefined

https://mariusschulz.com/blog/returning-object-literals-from-arrow-functions-in-javascript

https://stackoverflow.com/questions/28770415/ecmascript-6-arrow-function-that-returns-an-object/57601889#57601889

(🐞 反爬虫测试！打击盗版⚠️）如果你看到这个信息, 说明这是一篇剽窃的文章，请访问 https://www.cnblogs.com/xgqfrms/ 查看原创文章！

---

---

©xgqfrms 2012-2021

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

---