ES6 深拷贝_你别自以为是:ES6误区 之 Object.assign()、const

2b9f83e8b194175446c367e139050597.png

文/北妈

阅读本文需要 2.3分钟

很久没发技术文,今天北妈在新开一个技术系列:“别自以为是,1分钟走出JS常见误区“,里面我会每期挑选几个常见基础属性,讲一讲里面最容易被人忽略和认知错误的误区。

帮助大家更好的掌握基础,这样在面试和实际项目中可以避免很多低级错误和节省时间,欢迎拍砖甚至投稿。

今天说一下关于ES6 就引入的最常用的关于操作对象的新属性:

Object.assign()、const

1、大家知道 Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

MDN官方文档的例子就已经说明一切 

const target = { a: 1, b: 2 };const source = { b: 4, c: 5 };const returnedTarget = Object.assign(target, source);console.log(target);// expected output: Object { a: 1, b: 4, c: 5 }console.log(returnedTarget);// expected output: Object { a: 1, b: 4, c: 5 }

这个属性在ES6才引入,是一个不错的操作js对象格式的新属性。里面还涉及到深拷贝和浅拷贝,替换对象等众多概念。

Object.assign 方法只会拷贝源对象自身的并且可枚举的属性到目标对象。

这个属性在ES6才引入,是一个不错的操作js对象格式的新属性。里面还涉及到深拷贝和浅拷贝,替换对象等众多概念。

在ES5里面要实现和Object.assign 相关的功能要用到  Object.defineProperty很复杂的去实现。

而Object.assign 最常用的功能是将新的对象或者json属性 复制和追加到老的对象,然后生成一个新的整合对象。

项目里,很常用的就是请求传参时,追加各种筛选条件了,这个大家应该深有体会。

重要描述:如果目标对象中的属性具有相同的键,则属性将被源对象中的属性覆盖。后面的源对象的属性将类似地覆盖前面的源对象的属性。

意思是如果原对象利用有j= {a: 1} ,新对象也有{a:2}那么 就会直接覆盖,相当于是 j.a =2.这个在用的过程中是没什么疑问的,正常覆盖就好。

但一定要注意这个误区:比如:json1 = {a:1, b:null } ,那么 直接  

Object.assign(json1, {a:2,b:3} );  会发生什么?

大部分人不看文档 会说:直接覆盖被 最后是{a:2,b:3},但结果事与愿违,因为如果是NULL 这个罪魁祸首,assign 属性是不会生效的,这个value 不会生效,因为官方有一句:

注意,Object.assign 不会跳过那些值为 null 或 undefined 的源对象。

所以一定要注意,检查后端返给你的json数据里,有没有属性值为 null 或者 undefined,这个相当重要,不然会引来很多麻烦和bug。

这也是为啥一直强调,null 和undefined 是绝对禁止出现在正常的数据格式中的。这个大家一定要注意,因为前一段我们后端居然就返回了null ,,无语!!!

2、大家知道 const 是类型声明,大家再熟悉不过,也是es6才有的新属性,之前都是万恶的var,随意改变作用于和值。有个const,相当于给变量加了一个锁,但是

const声明创建一个值的只读引用。但这并不意味着它所持有的值是不可变的,只是变量标识符不能重新分配。例如,在引用内容是对象的情况下,这意味着可以改变对象的内容(例如,其参数)。

 比如:


const  num = 1000;

num = 2000;
//  会报错 ,因为在同一作用于,num的值已经固定,不可改变。

986c26d98e7fb39d9a705324b2790b99.png

但是:

const  num = {a:1000};

num.a = 2000 ;
//  这个不会报错 ,因为在其属性值是可以被改变的,也就是文档里说的改变对象内容,但你不能改变他在内存中的表示和位置。

6a0b64a9e58bb7a4b872320ecdc4a001.png

-----

这个其实看似很简单,有很多人并不理解,以为看到const 就说明这个变量被锁定了,该改变对象也不行,直接let 就行了,其实不对的,const照样可以被改变,但记住,只是改变他的值。

这些在面试题或者平时开发都会遇到,算是常识的自以为是误区,大家注意,也欢迎大家对平时积累的累死误区,告诉我,我更多的公布出来。

每日金句世界上没有恒久不变的东西,包括爱情和承诺。唯一不变的就是这个世界永远在变

热门阅读

空闲时间不要接私活,要提升自己

月薪5k的国企, 和月薪2万的私企,我选国企...

低学历者生存困难 程序员尤其明显

每天只想听你们说:小北最帅!

1e45d5bca05c80971d00ad62f9f4bc93.png

长按扫码关注我

一个不一样的帅码农

每天有惊喜

我觉得 「在看」与「转发」

也是对我的认可 6ac779bc98ee02fadd53e6877d29f6ec.gif

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

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

相关文章

c语言的数据类型复数型,C语言数据类型

一、基本类型C语言的基本数据类型包括字符型、整数型、浮点型。1、字符型(char)描述单个字符(一个字节),用半角的单引号包含起来,如a、A、1、$等,键盘能输入的英文和半角的符号都是字符。A B C ...... Za b c ...... z0 1 2 ...... 9~ ! ...…

opengl实现三维动画简单代码_使用Python简单实现马赛克拼图!内附完整代码

今天小编带大家使用python简单实现马赛克拼图,内容比以往会稍长一些,各位看官老爷可以慢慢细读,若有不足之处还望请斧正,闲话不多说,请看文章。先看原图:效果图:思路:拼图的原理其实…

耳机不支持android,安卓手机为什么不能用EarPods耳机 原因分析【图解】

相信很多人都有这样的疑问,iPhone和安卓手机的耳机孔是一样的, 安卓手机为什么不能用EarPods耳机? 这是什么原因?本次在这里就给大家分析下。安卓手机为什么不能用EarPods耳机?目前市面上大多数的手机仍采用3.5mm的耳机接口。但很多人不知道…

python自然语言处理库_Python 自然语言处理(NLP)工具库汇总

最近正在用nltk 对中文网络商品评论进行褒贬情感分类,计算评论的信息熵(entropy)、互信息(point mutual information)和困惑值(perplexity)等(不过这些概念我其实也还理解不深...只是…

android代码清除锁屏密码,清除Android手机锁屏密码的三个小妙招

大家有没有把锁屏密码忘记过?发生这种情况的概率应该很小吧,但为了以防万一大家还是看一下本文的解锁教程吧!这种解锁的方法要求,被锁上的手机是联网的状态,并登录了google账号,账号密码已知。如果以上条件…

android退出app代码,Android应用退出代码各种方式

1. 点击按钮最小化app返回到home//并不会退出app,只是最小化findViewById(R.id.button3).setOnClickListener(new OnClickListener(){public void onClick(View v){Intent intent new Intent(Intent.ACTION_MAIN);intent.addCategory(Intent.CATEGORY_HOME);startA…

c语言数组最大可定义多少位_C语言求数组的最大值三种方法

/* 黄哥Python培训 黄哥所写*/#include int maxValue(int* arr, int n);int maxRecursionValue(int* arr, int n);int maxDividAndConquerValue(int* arr, int left, int right);int main(void) { int arr[] {500, -1, 30, 7, 99, 12}; printf("数组中的元素最大…

android 百度map 一个layout加载多个mapview,android 百度地图API 使用Marker和InfoWindow

前言:在android开发过程中,百度地图的使用是比较普遍的,但是如何使用,使用什么版本的百度API还是需要一些讲究。在项目过程中,需要用到百度地图的marker和InfoWindow的功能。标注覆盖物(百度地图官方图)布局文件很简单…

python数据的格式输出_Python格式化输出

“%”的使用 格式符 描述 %s 字符串 (采用str()的显示) %r 字符串 (采用repr()的显示) %c 单个字符及其ASCII码 %u 整数(无符号) %b 二进制整数 %o 八进制数(无符号) %d 十进制整数 %i 十进制整数 %x 十六进制数(无符号) %X 十六进制数大写(无符号) %e 指数 (基底写为e)&#x…

android代码移除焦点,android-如何从单个editText移除焦点

android-如何从单个editText移除焦点在我的应用程序中,我只有一个button.seFocusableInTouchMode(),以及一些button.requestFocus(),按钮和一个微调器。 我认为,我的EditText获得关注,因为它是此活动中唯一可关注的视图…

python数据分析实验报告_Python 数据分析入门实战

本训练营中,我们将学习怎么样使用 Python 进行数据分析。课程将从数据分析基础开始,一步步深入讲解。从 Python 的基础用法到数据分析的各种算法,并结合各种实例,讲解数据分析过程中的方方面面。 课程内容将分为以下四个部分&…

unistd.h linux,Linux 标准库下的unistd.h

unistd.h在unix中类似于Window中的windows.h!#ifdef WIN32#include#else#include#endifunistd.h含有的常量与函数:ssize_t read(int, void *,size_t);ssize_t write(int, const void *,size_t);int unlink(const char *);int us…

go 写文件_如何在 Ubuntu 20.04 上安装 Go

本文最先发布在:如何在 Ubuntu 20.04 上安装 Go​www.itcoder.techGo,通常被称为 golang,它是一门由 Google 创建的现代化的开源编程语言,它允许你构建实时并且高效的应用。很多流行的应用程序,例如 Kubernetes&#x…

android纹理存储,Android:OpenGL存储纹理多长时间?

openGL存储纹理多长时间?离开活动时纹理内存是否会被回收?例如,如果我有以下代码:mGL.glGenTextures(1, mTextures, 0);mGL.glBindTexture(GL10.GL_TEXTURE_2D, mTextures[0]); // A bound texture is// an active texture//mGL.glTexImage2D(GL10.GL_TE…

python获取文件夹名_python基础之获取文件目录及名称

准备 被引用的文件:D:\gogncheng\apiAutoMate\api\a\bePerform.py 执行的文件: D:\gogncheng\apiAutoMate\common\b\perform.py 适用场景:在perform.py下引用文件bePerform.py运行代码,分别获取引用文件与执行文件的目录及名称 be…

android调用fragment的方法,AndroidX下使用Activity和Fragment的变化

原标题:AndroidX下使用Activity和Fragment的变化原文:How AndroidX changes the way we work with Activities and Fragments作者:Miłosz Lewandowski译者:Fly_with24链接:https://juejin.im/post/5e5a0c316fb9a07cd2…

java汽车管理系统_坑爹!花费2亿耗时2年,网站没建完Java都写不好,顶级咨询公司埃森哲被告上法庭...

乾明 发自 凹非寺 量子位 报道 | 公众号 QbitA耗费2个多亿,耗时2年多,连一个可用的网站或者APP都没有交付出来。想要完工?那就再交1000万美元。这件事的受害方、美国汽车租赁公司赫兹(Hertz)一怒之下, 将顶级咨询公司埃森哲(Accen…

Android接口一般定义格式,Android开发规范

原标题:Android开发规范一.书写规范1. 编码方式统一用UTF-8.2. 花括号不要单独一行,和它前面的代码同一行。而且,花括号与前面的代码之间用一个空格隔开。3. 空格的使用if、else、for、switch、while等逻辑关键字与后面的语句留一个空格隔开。…

c++将小写转换为大写函数_必须掌握的基础函数组合应用技巧,提高效率,准时下班...

点击上方"Excel函数公式"免费订阅货币,生活中必不可少的东西,是物品价值等的直接体现,在实际的工作中也经常遇到,如果给定的数据中,要对其进行格式的设置,你会怎么做?一、Dollar函数&…