JS-引用类型的赋值操作

308 阅读2分钟

「这是我参与11月更文挑战的第27天,活动详情查看:2021最后一次更文挑战

一.控制台输出引用数据类型

var arr = ['北京','上海','广州','重庆','天津'];
console.log(arr);
arr[0] = '武汉';

在这里插入图片描述

二.引用类型的赋值操作

(1)简单数据类型/基本数据类型

此时 str1 中存储的是 数据 北京
    var str1 = '北京';

将 str1 中存储的数据北京 赋值给 str2 
    var str2 = str1;

之后对str1 的操作,与str2,无关
    str1 = '上海';

    console.log(str1 , str2);  →  上海 北京

(2)引用数据类型/复杂数据类型

arr1 变量中 存储的是 数组的 内存地址

**var arr1 = [1,2,3,4,5];**

将arr1 存储的内存地址,赋值给arr2,两个变量存储的是相同的内存地址

**var arr2 = arr1;**

arr1操作,数组,arr2也会改变

因为arr1和arr2,同时存储的是相同的数据,操作的也是同一个数组

同理,arr2,操作数组,arr1也会改变

**arr1[0] = '北京'; //console.log(arr2);**

直接将一个引用数据类型的地址,赋值给另一个变量存储的,称为浅拷贝

两个变量存储的是相同的内存地址,一个操作,另一个也会改变

不想两个变量操作数组,都会改变,想建立一个独立的变量,只是存储相同的数据

需要建立一个独立的变量,复制引用数据类型中的数据内容

只复制 引用数据类型中的 数值 而不是 复制地址

称为 深拷贝

只复制arr3中的数据
    var arr3 = ['北京','上海','广州','重庆','天津'];

循环遍历,获取arr3中的所有数据数值,赋值到新的数组中
    var arr4 = [];

通过循环,生成arr3的所有索引下标
    for(var i = 0 ; i <= arr3.length-1 ; i++){
        // arr3[i] 就是获取 arr3中的 存储的 数据信息
        // arr4.push() 将arr3中的数据 arr3[i] , 写入到 arr4中
        arr4.push(arr3[i]);
    }

    console.log(arr4);

    arr3[0] = '武汉';

    console.log(arr3 , arr4);

总结 基本数据类型

赋值的是 存储的数据

赋值之后 两个变量没有关系

引用数据类型

浅拷贝

  直接赋值 赋值的是 内存地址
  赋值之后 两个变量使用的相同内容,一个操作,另一个也会改变

深拷贝

  循环遍历,获取引用数据类型中,存储的每一个数据信息
  赋值到新的变量中
  赋值之后 两个变量,没有任何关系