资讯专栏INFORMATION COLUMN

js合并两个对象

魏宪会 / 1150人阅读

摘要:中加一个空对象,的值就不会被改变。遍历此处是判断自有属性,使用循环遍历对象的属性时,原型链上的所有属性都将被访问会避免原型对象扩展带来的干扰可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象。

1.extend()

    var obj1 = {
        a:1,
        b:2
    };
    var obj2 = {
        c:3,
        d:4
    };
    var assignObj = $.extend(obj1,obj2);
    console.log("assignObj",assignObj);
    console.log("obj1",obj1);
    console.log("obj2",obj2);


可以发现obj1的值被改变了。

    var obj1 = {
        a:1,
        b:2
    };
    var obj2 = {
        c:3,
        d:4
    };
    var assignOObj = $.extend({},obj1,obj2);
    console.log("assignOObj",assignOObj);
    console.log("obj1",obj1);
    console.log("obj2",obj2);


extend()中加一个空对象,obj1的值就不会被改变。

2.遍历

    var obj1={a:1};
    var obj2={b:2,c:3};
    for(var key in obj2){
        if(obj2.hasOwnProperty(key)===true){
        //此处hasOwnProperty是判断自有属性,使用 for in 循环遍历对象的属性时,原型链上的所有属性都将被访问会避免原型对象扩展带来的干扰
            obj1[key]=obj2[key];
        } 
    }
    console.log(obj1);
    console.log(obj2);


3.Obj.assign()
可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象。
Object.assign(target, ...sources)

    var obj1 = {
        a:1,
        b:2
    };
    var obj2 = {
        c:3,
        d:4
    };
    var assignObj = Object.assign(obj1,obj2);
    console.log("assignObj",assignObj);
    console.log("obj1",obj1);
    console.log("obj2",obj2);

obj1的值也被改变了,和$.extend()类似.

    var obj1 = {
        a:1,
        b:2
    };
    var obj2 = {
        c:3,
        d:4
    };
    var assignOObj = $.extend({},obj1,obj2);
    console.log("assignOObj",assignOObj);
    console.log("obj1",obj1);
    console.log("obj2",obj2);

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/106624.html

相关文章

  • JavaScript复制(合并对象

    摘要:实现合并对象的方法有很多种,比如也是用写的,谢谢系列等,至于区别自己看文档,文档地址打造的一个不可变数据结构库的方法其中,为原生方法,但是存在以下两个在具体应用场景上的缺点浏览器兼容性问题只能进行浅合并关于浅合并深合并,码友之述备矣,这里就 javascript实现合并对象的方法有很多种,比如: 1、Object.assign 2、jQuery.extend(jQuery也是用java...

    vslam 评论0 收藏0
  • JS每日一题: Vue中mixin怎么理解?

    摘要:两个对象键名冲突时,取组件对象的键值对也使用同样的策略进行合并。代码理解全局混合也可以全局注册混合对象。注意使用一旦使用全局混合对象,将会影响到所有之后创建的实例为自定义的选项注入一个处理器。 20190122 Vue中mixin怎么理解? mixin是为了让可复用的功能灵活的混入到当前组件中,混合的对象可以包含任意组件选项(生命周期,指令之类等等), mixin翻译过来叫混合,高级的...

    jubincn 评论0 收藏0
  • ES6 Javascript 实用开发技巧

    摘要:定义变量常量中新增加了和两个命令,用于定义变量,用于定义常量。 定义变量/常量 ES6 中新增加了 let 和 const 两个命令,let 用于定义变量,const 用于定义常量。两个命令与原有的 var 命令所不同的地方在于,let, const 都是块级作用域,其有效范围仅在代码块中,实例如下: //es5 if(1 == 1){ var b = foo; } conso...

    iamyoung001 评论0 收藏0
  • ES6 javascript 实用开发技巧

    摘要:实用开发技巧本文只罗列出在开发过程中相对实用的内容,并非一个高大全的文档,如果希望查阅详细的内容,可购买阮一峰老师所出版的相关图书。 Javascript - ES6 javascript 实用开发技巧 本文只罗列出在 ES6 开发过程中相对实用的内容,并非一个高大全的文档,如果希望查阅详细的内容,可购买阮一峰老师所出版的 ES6 相关图书。另外阮一峰老师《ECMAScript 6 入...

    DobbyKim 评论0 收藏0
  • seajs模块化改造实践

    摘要:为对象字符串时,表示模块的接口就是该对象字符串。我们来看一个实际的例子支付宝的登陆页面。在网页支付宝收银台中的运用很直观的就能看到插模块的合并,这个合并的工作就是构建工具的功劳了。 前言 一月份的时候,临近放假,拿到一个需求,新增一个产品,我一个前端对一个java后端,两个星期的开发时间。 因为大部分功能在别的产品都已经有了,基本都是简单处理一下拿过来,再添加一下额外需要的功能,比如选...

    justjavac 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<