JavaScript变量类型和深拷贝

104 阅读2分钟

JavaScript的变量类型(分为两种)

1. 值类型(字符串String、数字Number、空Null、布尔类型Boolean、未定义undefinedSymbol)
值类型直接存储在栈中
const b='123'
const c=2
const d=true
const e=Symbol('e')
console.log(typeof a);
console.log(typeof b);
console.log(typeof c);
console.log(typeof d);
console.log(typeof e);

值类型.png

2. 引用类型(对象Object、数组Array、函数Function)
引用类型存储在堆中,栈中只会存储指向堆的地址(栈中的地址相当于指针)
const obj={age:21,name:'XXX'}
const arr=[1,2,,1,5,56] 
const fn= function fn1(){}
console.log(typeof obj);
console.log(typeof arr);
console.log(typeof fn)

引用类型.png

3. null(特殊值)null为值类型,但是他使用typeof得到的结果为object.您可以把null在
JavaScript 中是对象理解为一个bug。它本应是null
   const n = null;
   console.log(typeof n);

null.png

拷贝

浅拷贝

对于浅拷贝而言,就是只拷贝对象的引用,而不深层次的拷贝对象的值,多个对象指向堆内存中的同一对象,任何一个修改都会使得所有对象的值修改,因为它们公用一条数据

深拷贝

深拷贝作用在引用类型上!例如:Object,Array *深拷贝不会拷贝引用类型的引用,而是将引用类型的值全部拷贝一份,形成一个新的引用类型,这样就不会发生引用错乱的问题,使得我们可以多次使用同样的数据,而不用担心数据之间会起冲突

使用递归的方式实现数组、对象的深拷贝如下

const obj1={
  name:'XXX',
  age:22,
  address:{
    city:'anyang'
  },
   arr: ['1', '2', '3']
}
function deepClone(obj){
  //判断是不是为数组或者对象
  if(typeof obj!=='object'||typeof obj==null){
    return obj
  }
  let result
  if(obj instanceof Array){
    result=[]
  }else{
    result={}
  }
  for(let key in obj){
    //hasOwnProperty判断原型上是否有该属性
    if(obj.hasOwnProperty(key)){
      result[key]=obj[key]
    }
  }
  return result
}

let obj2=deepClone(obj1)
console.log(obj2)

深拷贝.png