好的程序员web前端培训分享JavaScript相关知识，今天给大家分享一下JavaScript相关知识。从事web前端工作的朋友们，一起来看看吧，希望对大家有所帮助。 （一）JS中的基本类型和引用类型 JavaScript变量包含两种类型的值：基本类型值和引用类型值，在内存中的表示是：前者存放在栈中的一些简单的数据段，后者是存储在堆内存中的对象。 ?基本类型值 在JavaScript中，基本数据类型包括String、Number、Undefined、Null和Boolean。在ES6中，定义了一个新的基本数据类型Symbol，所以一共有6种类型。 基本类型是按值访问的。将基本类型的值从一个变量复制到另一个变量后，两个变量的值就完全独立了，即使一个变量发生变化，也不会影响第二个变量。. letstr1='Hello'; letstr2=str1; str2='helloword'console.log(str2);//'helloword' console.log(str1);//'你好' ?引用类型值 引用类型值是引用类型的一个实例，是存放在堆内存中的对象，引用类型是一种数据结构，最常用的是Object，Array，函数类型，除了Date、RegExp、Error等。 在ES6中提供了Set、Map2新的数据结构。 (2)如何在JS中复制引用类型的 ?基本类型和引用类型赋值的区别 例如：下面的代码中，只修改了obj1中的name属性，但同时ob1和obj2中的时间名称属性。 letobj1={'name':'小明'}; letobj2=obj1;obj2.name='小兰'; console.log(obj1);//{'name':'小明'} console.log(obj2);//{'name':'小明'} 变量复制引用类型的值时，也会将变量的值复制到新变量上，不同的是对于变量的值，它是指向存储在堆内存中的对象的指针。 因为，在JS中，堆内存中的对象是不能直接访问的，必须访问堆内存中对象的地址，然后通过这个地址来获取对象中的值。 (3)浅拷贝 在JS中，如果属性是基本类型，则复制基本类型的值；如果属性是引用类型，则复制内存地址；所以如果其中一个对象改变了地址，就会影响到另一个对象。 以下是JavaScript提供的浅拷贝方法： Object.assign ES6中复制一个对象的方法，接受的第一个参数为复制的目标，其余参数为源副本对象; 语法：Object.assign(target,...sources) letp={'name':'helloword',}; letcopyP={}; Object.assign(copyP,p); console.log(copyP);console.log(p); Object.assign是一个浅拷贝，它只是在根属性（第一层对象），但如果属性的值是一个对象，则只会复制相同内存地址的一个副本。 扩展运算符 使用扩展运算符可以在构造文字对象时克隆或复制属性。语法如下： letcloneObj={...obj}; letobj={'name':'Monday','college':['Tuesday','Wednesday','Thursday']}letobj2={...obj}; obj.name='nobreak';//{'name':'nobreak','college':['Tuesday','Wednesday','Thursday']}console.log(obj);//{'name':'Monday','college':['Tuesday','Wednesday','Thursday']} console.log(obj2); obj.college.push('Go');//{'name':'nobreak','college':['周二','周三','周四']} console.log(obj);//{'name':'nobreak','college':['周二','周三','周四']} console.log(obj2); 展开运算符与Object.assign()存在相同的问题。值为对象的属性不能完全复制到两个不同的对象中； 但如果属性都是基本类型的值，使用展开运算符更简洁。 （4）深拷贝 浅拷贝只是在根属性上在堆内存中新建一个对象，复制基本类型的值，但是复杂数据类型，即对象，复制的是同一个地址。 深拷贝是将一个对象从内存中完全复制出来，从堆内存中开辟一个新的区域来存放新的对象，修改新的对象不会影响到原对象。 JSON.stringify JSON.stringify()是目前开发过程中最常用的深拷贝方式。其原理是将一个对象序列化为JSON字符串，将对象的内容转换为字符串，然后保存在内存中，然后用JSON.parse()反序列化，将JSON字符串变成一个新的对象。 例如： letobj={name:'少帅',age:18,friends:['Ada','Aer'],goodF:{name:'Fruit',age:19,address:'上海',pets:[{name:'Watermelon'},{name:'Apple'}]},bir:newDate()}; letnewObj=JSON.parse(JSON.stringify(obj)); obj.goodF.pets[0].name='Orange'; console.log(newObj);console.log(obj); 使用JSON.stringify实现深拷贝有几点需要注意： 1）如果被拷贝对象的value中有function,undefined,symbol，key-valuepair会消失在JSON.stringify()序列化的JSON字符串中； 2）不能复制不可枚举属性，不能复制对象的原型链 3）复制Date引用类型会变成字符串 4）复制RegExp引用类型会变成空对象 5)在对象ContainsNaN,Infinityand-Infinity中，序列化后的结果会变为null 递归实现深拷贝 具体实现如下： /***辅助函数判断是否它是一个对象*@paramobj*@returns{boolean}*/ functionisObj(obj){returnobjinstanceofObject;} /***深拷贝fromObj表面的所有属性/值到toObj对象*@paramfromObjcopyobject*@paramtoObjtargetobject*/ 函数deepCopyObj2NewObj(fromObj,toObj)//如果是值类型，则直接复制赋值 if(!isObj(fromValue)){ toObj[key]=fromValue; }else{//如果是引用类型,然后再次调用这个方法,//内部复制这个对象的所有属性//fromValue是什么类型,创建一个这个类型的空对象 lettmpObj=newfromValue.constructor; //console.log(tmpObj);//调试器; deepCopyObj2NewObj(fromValue,tmpObj); toObj[key]=tmpObj; } } }} (5)总结 1)In日常开发，一般不需要拷贝很多特殊的引用类型，使用JSON.stringify深拷贝对象是最直接简单的方法。 2）实现一个完整的深拷贝非常复杂，需要考虑很多边缘情况。如果有特殊引用类型的复制需求，建议使用第三方完整库，如lodash.js。 免责声明：本文图片及文字信息为小编转载自网络，仅供分享及提供阅读之用。版权归原作者所有。如有侵权，请联系我们删除。
