html assign无效,Object.assign的一些用法

Object.assign的一些用法

2020/11/12 20:19:03  字体:大 中 小 浏览 1289 我要评论

b8e5be3e73e49cec83127783bda0decc.gif

660c1dce368e50df695cd58a781c9f25.gif

ff886d0cf9d645b88ac7df686ed5bbe1.gif

a228b0bb11b6ca00f0d8df13df93d6f1.gif

5ae08058a671177c58cd16f4952d687b.gif

28e33134612665f8a4636df96fc3af91.gif

c4be00e1ece500675a129d09c82307de.gif

2c4230e45fdc1ab2f4208697d2b33edd.gif

需要定制网站程序、公众号程序、微信小程序可以联系:565449214或者加微信13961347334(备注:需要技术)

或者在处理一些技术问题时,有什么不懂的地方,随时可以加我QQ:565449214讨论技术或者加QQ群62655404讨论

用法1:替换数组的值

let a = [1,2,3],b = [4,5]

console.log( Object.assign(a,b)); // 后面的值覆盖前面的值,[4,5,3]

用法2:为对象添加属性

下面是es5的写法:this.xxx =xxx

//    es5的写法

class Test{

constructor(x,y){

this.x =x

this.y = y

}

sum(){

return this.x + this.y

}

}

let t = new Test(1,2)

console.log(t.sum());

用Object.assign的写法

// Object.assign的写法

class Test2{

constructor(x,y){

Object.assign(this,{x,y})

}

sum2(){

return this.x + this.y

}

}

let t2 = new Test2(1,2)

console.log(t2.sum2());

用法3 深度克隆对象

//    用法3 深度克隆对象

let clone = (orignObj) => {

let originProto = Object.getPrototypeOf(orignObj)

return Object.assign(Object.create(originProto), orignObj)

}

let obj3 = { name: 'zs', age: 12 }

console.log(clone(obj3));

用法4:合并对象属性

下面这种写法,合并后,原来的两个对象都已经改变

// example1

let obj = {name:'zs'} ,obj2 = {name:'zs',age:12}

let merge = (target, ...v) => Object.assign(target, ...v)

console.log(merge(obj,obj2));// {name:'zs',age:12}

console.log(obj,obj2); // 合并后,两个对象都已经改变,值都是 {name:'zs',age:12}

如果不想改变原来的对象,可以用下面这个写法

// example2 合并后,返回一个新对象,不更改原有对象的属性

let merge2 = (...v) => Object.assign({}, ...v)

console.log(merge2(obj, obj2));// {name:'zs',age:12}

console.log(obj); //  原来的对象保持原样  {name:'zs'}

console.log(obj2); //  原来的对象保持原样  {name:'zs',age:12}

//合并对象,还可以用展开操作符

let obj5 = {name:'zs'},obj6 = {age:12}

let newOjb = {...obj5,...obj6}

console.log(newOjb);

用法5.为默认对象新增属性

const DEFAULTS = { name: 'zs', age: 13 } // 默认对象

let createObjWithDefault = (opt) => Object.assign({}, DEFAULTS, opt)

console.log(createObjWithDefault({ 'addr': 'gz' }));

9f20b987662dbe593713a2494620bfd3.png

99b4fbe0cab4535784c5588b9ae72181.png

正在加载评论……

呢 称:

表 情:

76207ad7f062fd1221aae117bae9f4dd.gif

d979e8ee9deca1c3b68a6486add1275a.gif

ca34335d0441fa6d944a2b48ced886ee.gif

e0490ca19708bb04c950b0b20a4b3445.gif

70e5674d73fb7c4c9c04346f46777494.gif

b981f04e2e1dcf4b13c1211c30ba9172.gif

975872c06344b0f05e3f3b49e80932c4.gif

7265fa957f73e3e18f993c6a612e7411.gif

0d3ca9b4b879d612b54c1689a17a809a.gif

0fc4ef5dfed3727c3bd614f192a04c7f.gif

19adb11d2752d7506949237a2358931a.gif

7017d810191c34e2580ddfb8b15dd8e3.gif

b4152965d82061656f399ac98328534c.gif

016564cc6c718044650b9768688b64a6.gif

c06dc6fbc7f127e7597d384b7009db34.gif

8304c6a824d70923ce5d5095989be60a.gif

c2787afe8081ddf16bedc84e8341e8ca.gif

b84c0ee1eec293e9628041c7dbdc6f8f.gif

6bc706ceb394e09b7ffb517b7a470dbe.gif

4635249215acf4f8e41239992e420214.gif

975b1f08a1ff7b55d8a9a4ca0ebd600c.gif

内 容:

评论内容:不能超过 1000 字,需审核,请自觉遵守互联网相关政策法规。

验证码:

d2c83c8c7b93ea14d41de6904ff03bdd.png

深山工作室网友评论声明,请自觉遵守互联网相关政策法规。

您发布的评论即表示同意遵守以下条款:

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家、社会、集体和公民的合法权益;

二、不得发布国家法律、法规明令禁止的内容;互相尊重,对自己在本站的言论和行为负责;

三、本站对您所发布内容拥有处置权。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/302604.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

R语言和 Python —— 一个错误的分裂

全世界有3.14 % 的人已经关注了数据与算法之美最近有一些文章提出与年龄相关的问题:“崭露头角的年轻数据科学家们是学习R语言还是Python更好?”答案似乎都是“视情况而定”,在现实中没有必要在R和Python中做出选择,因为你两个都用得到。推荐…

快速修改HTML5,HTML5无刷新修改URL(示例代码)

HTML5新添加了两个api分别是pushState和replaceState,DOM中的window对象通过window.history方法提供了对浏览器历史记录的读取,可以在用户的访问记录中前进和后退,我们可以开始操作这个历史记录堆栈。实例一、通过pushState修改URL通过这句代…

这一平台只要把握住风口期,自己就能当老板!

我是电商珠珠 短视频渐渐走进大家的视野,改变了大家的日常娱乐方式。从19年开始,抖音开始发展电商平台-抖音小店。 在改变大家娱乐方式的同时,还将直播电商的热度掀了起来,由此改变了大家的购物方式,给大家带来了方便…

如何用TensorFlow实现人工智能?

自 2015 年 11 月 9 号发布之后,TensorFlow 逐渐成为人工智能领域最广泛运用的深度学习框架。那么TensorFlow框架到底是什么?TensorFlow 是一个大规模机器学习的开源框架,提供了多种深度神经网络的支持。不仅 Google 在自己的产品线使用 Tens…

一不小心,知乎炸了!

阅读本文大概需要7分钟。昨天晚上加完班发完原创文章:如何成为一个搞垮公司的程序员?就准备回家了,突然发现知乎一堆咨询消息,看了看原来是之前回答的一个问题突然火了,就是这个:好家伙,一天不到…

[转载]Android Layout标签之-viewStub,requestFocus,merge,include

定义Android Layout(XML)时&#xff0c;有四个比较特别的标签是非常重要的&#xff0c;其中有三个是与资源复用有关&#xff0c;分别是<viewStub/>, <requestFocus />, <merge /> and<include />。可是以往我们所接触的案例或者官方文档的例子都没有着…

查询2021抚顺高考成绩,2021年抚顺高考状元是谁分数多少分,历年抚顺高考状元名单...

2020年抚顺一年一度的高考考试已经结束&#xff0c;今年抚顺高考状元是谁呢&#xff0c;抚顺高考状元出自哪个高中学校&#xff0c;文理科分数是多少分&#xff0c;一起来了解。一、2020年抚顺高考状元名单资料2020年抚顺高考状元名单和学校相关信息&#xff0c;截至目前发文时…

Android菜单详解——理解android中的Menu

前言 今天看了pro android 3中menu这一章&#xff0c;对Android的整个menu体系有了进一步的了解&#xff0c;故整理下笔记与大家分享。 PS&#xff1a;强烈推荐《Pro Android 3》&#xff0c;是我至今为止看到的最好的一本android书&#xff0c;中文版出到《精通Android 2》。 …

2021北京高考适应性测试成绩排名查询,2021届适应性考试学生成绩排名

1开启前照灯远光时仪表板上(如图所示)亮起。查看本题分析2在道路上跟车行驶时&#xff0c;跟车距离不是主要的&#xff0c;只须保持与前车相等的速度&#xff0c;即可防止发生追尾事故。查看本题分析3驾驶机动车在高速公路要按照限速标志标明的车速行驶。查看本题分析4这个标志…

.NET之Docker部署详细流程

开篇语自己从头开始走一遍docker部署.net的流程&#xff0c;作为一种学习总结&#xff0c;以及后续会写一些在该基础之上的文章。本次示例环境&#xff1a;vs2019、net5、docker、postman创建项目本次事例代码是用过vs2019创建的ASP.NET Core Web API项目image.png目标框架是.N…

平凡而又神奇的贝叶斯方法

全世界有3.14 % 的人已经关注了数据与算法之美概率论只不过是把常识用数学公式表达了出来。 ——拉普拉斯记得读本科的时候&#xff0c;最喜欢到城里的计算机书店里面去闲逛&#xff0c;一逛就是好几个小时&#xff1b;有一次&#xff0c;在书店看到一本…

d.ts文件可以注释html吗,如何编写一个d.ts文件的步骤详解_旧店_前端开发者

前言本文主要讲怎么写一个typescript的描述文件(以d.ts结尾的文件名&#xff0c;比如xxx.d.ts)。最近开始从之前也从网上面也找了一些资料&#xff0c;但还是看的云里雾里模糊不清&#xff0c;经过一段摸索&#xff0c;将摸索的结果记录下来&#xff0c;也希望可以给别人一个参…

function里面可以写function吗_氨基酸可以和蜂蜜一起喝吗?蜂蜜里面有氨基酸吗?...

氨基酸可以和蜂蜜一起喝吗?蜂蜜里面有氨基酸吗?氨基酸是我们人体不可或缺的营养物质&#xff0c;那氨基酸这种物质是否可以搭配蜂蜜一同食用?不少朋友都存在类似的疑惑&#xff0c;氨基酸会对蜂蜜产生不良的影响吗?其实&#xff0c;蜂蜜中本身也包含不少的氨基酸&#xff0…

通过Dapr实现一个简单的基于.net的微服务电商系统(九)——一步一步教你如何撸Dapr之OAuth2授权-百度版...

目录&#xff1a;一、通过Dapr实现一个简单的基于.net的微服务电商系统二、通过Dapr实现一个简单的基于.net的微服务电商系统(二)——通讯框架讲解三、通过Dapr实现一个简单的基于.net的微服务电商系统(三)——一步一步教你如何撸Dapr四、通过Dapr实现一个简单的基于.net的微服…

各自用一句话来概括MVC、MVP、MVVM的差异特点

MVC&#xff1a; 用户的请求首先会到达Controller&#xff0c;由Controller从Model获取数据&#xff0c;选择合适的View&#xff0c;把处理结果呈现到View上&#xff1b; MVP&#xff1a; 用户的请求首先会到达View&#xff0c;View传递请求到特定的Presenter&#xff0c;Pre…

不用“背”单词,1个方法牢记7000单词:我是如何做到的?

全世界有3.14 % 的人已经关注了数据与算法之美上个月30号&#xff0c;我怀着忐忑的心情&#xff0c;再次打开了 词汇量测试网站。当我看到词汇量达到7190的时候&#xff0c;非常兴奋。以至于带着怀疑的态度测了第二次&#xff1a;7260。7000的词汇量是怎样的一个程度呢&#xf…

VS2005~VS2022,那些年用过的VS,致敬,青春!

微软在开发者博客上宣布了一则重磅消息 —— 众所期待的 Visual Studio 2022 开发工具包即将全面拥抱 64-bit&#xff0c;并将于今夏推出首个公共预览版本。笔者第一次接触的VS版本还是2005&#xff0c;那时候还在上大三&#xff0c;一眨眼的功夫&#xff0c;现在都VS2022了&am…

Cowboy 源码分析(十八)

在上一篇中&#xff0c;我们整理了下cowboy_http_protocol:header/3函数&#xff0c;在文章的末尾留下2个没有讲到的函数&#xff0c;今天&#xff0c;我们先看下cowboy_http_protocol:error_terminate/2函数&#xff0c;另一个函数下一篇&#xff0c;我们再看。cowboy_http_pr…

符合语言习惯的 Python 优雅编程技巧

Python最大的优点之一就是语法简洁&#xff0c;好的代码就像伪代码一样&#xff0c;干净、整洁、一目了然。要写出 Pythonic&#xff08;优雅的、地道的、整洁的&#xff09;代码&#xff0c;需要多看多学大牛们写的代码&#xff0c;github 上有很多非常优秀的源代码值得阅读&a…

compress后的bytearray再decode变大_笔记本电脑风扇噪音变大的原因及其解决办法

笔记本使用时间长了之后&#xff0c;风扇声音会变大&#xff0c;那么如何再把风扇声音变小呢&#xff1f;怎么减小笔记本风扇的噪音&#xff1f;是什么原因导致笔记本风扇声音变大&#xff1f;下面给大家介绍笔记本风扇声音变大的原因及其解决办法。原因&#xff1a;1、使用时间…