对象和数组的合并

260 阅读1分钟
对象的合并
  1. 扩展运算符

    对象的扩展运算符(...)用于取出参数对象的所有可遍历属性,拷贝到当前对象之中

    let obj1 = {
        name: '陈伟霆',
        gender: '男',
        hobby: '唱歌'
    };
    let obj2 = {
        name: '陈伟霆',
        gender: '男',
        hobby: '跳舞',
        nationality: '中国'
    };
     
    let obj = {...obj1, ...obj2};
    console.log(obj);  // { name: '陈伟霆', gender: '男', hobby: '跳舞', nationality: '中国' }
    // 如果想把obj1合并到obj2中,obj2可以这样定义
    let obj2 = {
        name: '陈伟霆',
        gender: '男',
        hobby: '跳舞',
        nationality: '中国',
        ...obj1
    };
    
  2. Object.assign

    Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象

    let obj = Object.assign({}, obj1, obj2);
    console.log(obj);  // { name: '陈伟霆', gender: '男', hobby: '跳舞', nationality: '中国' }
    // 如果想把obj1合并到obj2中,obj2可以这样定义
    Object.assign(obj2, obj1)
    console.log(obj1);// { name: '陈伟霆', gender: '男', hobby: '跳舞', nationality: '中国' }
    

    tips:第一级是深拷贝,第二级开始都是浅拷贝。

  3. 递归赋值

    let obj = obj1;
    for (var p in obj2){
        if(obj2.hasOwnProperty(p))
        obj[p] = obj2[p];
    }
    console.log(obj);  // { name: '陈伟霆', gender: '男', hobby: '跳舞', nationality: '中国' }
    
数组合并
  1. 扩展操作符

    var newArray = [...array,...elements]
    console.log(newArray); // ["a", "b", 0, 1, 2]
    
  2. 使用array.concat()方法进行合并

    使用concat方法:这个方法不是添加到现有数组,而是创建并返回一个新数组

    var array = ["a", "b"];
    var elements = [0, 1, 2];
     
    var newArray = array.concat(elements);
    console.log(array); //['a', 'b']
    console.log(newArray);// ["a", "b", 0, 1, 2]
    
  3. 关于apply

    使用Apply方法:这个方法是将数组各项添加到另一个数组当中,是一种改变原数组的方法

    var array = ["a", "b"];
    var elements = [0, 1, 2];
    array.push.apply(array, elements);
    console.log(array); // ["a", "b", 0, 1, 2]
    
  4. 使用array.push()方法进行合并

    const heroes = ['Batman'];
    heroes.push('Superman');
    heroes; // ['Batman', 'Superman']
    
    const heroes = ['Batman', 'Superman'];
    const villains = ['Joker', 'Bane'];
     
    heroes.push(...villains);
     
    heroes; // ['Batman', 'Superman', 'Joker', 'Bane']
    

\