js数组、对象、值拷贝方法总结

古城微笑少年丶 2022-06-13 07:40 319阅读 0赞

## 前言： ##

我们都知道在java中存在基本数据类型和引用数据类型，在对基本数据类型进行拷贝的时候直接使用等号（=）赋值即可， 但是对于引用类型拷贝则需要复写Object的clone（）方法,那么在JavaScript中是怎么样的呢？

--------------------

## 知识点一：JavaScript中的数据类型 ##

1.引用类型：
        对象
        数组
    2.基础类型：
        数字
        字符串
        null
        undefined
        boolean类型：
            true
            false
    3.函数类型（因为函数其特殊，这里列举出来）

--------------------

## 知识点二：JavaScript基础类型拷贝 ##

### 数字类型: ###

var num1 = 6;
        var num2 = num1;
        num2 = 5;
        alert("num1 = "+num1);//num1 = 6
        alert("num2 = "+num2);//num2 = 5

总结：数字类型拷贝可以直接使用等号（=），改变num2的值，不会影响num1

## 字符串类型： ##

var str1 = "hello world ! ";
        var str2 = str1;
        str2 = "hello zxy !";
        alert("str1 = "+str1); //hello world ! 
        alert("str2 = "+str2);//hello zxy !

总结：字符串类型拷贝可以直接使用等号（=），改变str2的值，不会影响str1

## boolean类型： ##

var bo1 = true;
        var bo2 = bo1;
        bo2 = false;
        alert("bo1 = "+bo1); //bo1 = true
        alert("bo2 = "+bo2);//bo2 = false

总结：boolean类型拷贝可以直接使用等号（=），改变bo2的值，不会影响bo1

## null 和 undefined 就不测试了，没有意义！ ##

#### 总结： ####

1.基础类型的拷贝可以使用等号（=），并且修改任意一个，不会影响到另外的值；

--------------------

## 知识点三：JavaScript引用类型拷贝 ##

### 对象： ###

var person1 = {
            name:"zhangyu",
            age : 8
        };
    
        var person2 = person1;
        person2.name = "zhanglong";
        person2.age = 10;
    
        alert("person1.name = "+person1.name +"...person1.age = "+person1.age);//person1.name = zhanglong...person1.age = 10
        alert("person2.name = "+person2.name +"...person2.age = "+person2.age);//person1.name = zhanglong...person1.age = 10

总结：将person1赋值给person2以后，修改person2的name和age以后，person1的name和age也发生的改变。

## 数组： ##

var arr1 = [1,2,3,4,5,6];
        var arr2 = arr1;
        arr2[0] = 88;
        alert("arr1[0] = "+arr1[0]);//arr1[0] = 88
        alert("arr2[0] = "+arr2[0]);//arr2[0] = 88

总结：将arr1 赋值给arr2 以后，修改arr2 的第一个元素为88以后，arr1 的第一个元素也改变为88。

--------------------

## 知识点四：函数的拷贝 ##

var func1 = function () { 
            alert("我是func1函数1！");
        }
    
        var func2  = func1;
    
        func2 = function () { 
            alert("我是修改后的func2函数！");
        }
    
        func1();//我是func1函数1！
        func2();//我是修改后的func2函数！

总结：函数复制以后，在修改不会影响到以前的函数。

--------------------

## 知识点五：总结 ##

在 JavaScript 中数据类型可以分为两类：
    
    原始数据类型值 primitive type，比如Undefined,Null,Boolean,Number,String。
    引用类型值，
    也就是对象类型 Object type,比如Object,Array,Function,Date等。
    声明变量时不同的内存分配
    
    原始值：存储在栈（stack）中的简单数据段，也就是说，它们的值直接存储在变量访问的位置。
    这是因为这些原始类型占据的空间是固定的，所以可将他们存储在较小的内存区域 – 栈中。这样存储便于迅速查寻变量的值。
    
    引用值：存储在堆（heap）中的对象，也就是说，存储在变量处的值是一个指针（point），指向存储对象的内存地址。
    这是因为：引用值的大小会改变，所以不能把它放在栈中，否则会降低变量查寻的速度。相反，放在变量的栈空间中的值是该对象存储在堆中的地址。
    地址的大小是固定的，所以把它存储在栈中对变量性能无任何负面影响。

![这里写图片描述][SouthEast]

不同的内存分配机制也带来了不同的访问机制
    
    在javascript中是不允许直接访问保存在堆内存中的对象的，所以在访问一个对象时，首先得到的是这个对象在堆内存中的地址，
    然后再按照这个地址去获得这个对象中的值，这就是传说中的按引用访问。而原始类型的值则是可以直接访问到的。
    
    复制变量时的不同
    原始值：在将一个保存着原始值的变量复制给另一个变量时，会将原始值的副本赋值给新变量，此后这两个变量是完全独立的，他们只是拥有相同的value而已。

![这里写图片描述][SouthEast 1]

引用值：在将一个保存着对象内存地址的变量复制给另一个变量时，会把这个内存地址赋值给新变量，也就是说这两个变量都指向了堆内存中的同一个对象，
    他们中任何一个作出的改变都会反映在另一个身上。（这里要理解的一点就是，复制对象时并不会在堆内存中新生成一个一模一样的对象，
    只是多了一个保存指向这个对象指针的变量罢了）

![这里写图片描述][SouthEast 2]

### 说明：最后总结摘抄自：[http://blog.csdn.net/chelen\_jak/article/details/48915679][http_blog.csdn.net_chelen_jak_article_details_48915679] ###

[SouthEast]: /images/20220613/62f0d049b5004f2b9ebb35f05af11792.png
[SouthEast 1]: /images/20220613/1822c20ebd564f54956a2871d23b57c0.png
[SouthEast 2]: /images/20220613/40dc0038d9d44c03bc4d4290ab9cce7c.png
[http_blog.csdn.net_chelen_jak_article_details_48915679]: http://blog.csdn.net/chelen_jak/article/details/48915679