值类型和引用类型的区别

最新推荐文章于 2024-05-15 15:24:51 发布

devincob

最新推荐文章于 2024-05-15 15:24:51 发布

阅读量434

点赞数

分类专栏：前端-面试

本文链接：https://blog.csdn.net/devincob/article/details/87270855

版权

前端-面试专栏收录该内容

11 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>值类型vs引用类型</title>
</head>
<body>
<script>
    // js中的值类型和引用类型的区别
    // 1.JavaScript中的变量类型有哪些？
    //
    // （1）值类型（基本类型）：字符串（String）、数值（Number）、布尔值（Boolean）、Undefined、Null  （这5种基本数据类型是按值访问的，因为可以操作保存在变量中的实际的值）
    // （2）引用类型：对象（Object）、数组（Array）、函数（Function）
    //
    // 2.值类型和引用类型的区别
    //
    // （1）值类型：1、占用空间固定，保存在栈中（当一个方法执行时，每个方法都会建立自己的内存栈，在这个方法内定义的变量将会逐个放入这块栈内存里，随着方法的执行结束，这个方法的内存栈也将自然销毁了。因此，所有在方法中定义的变量都是放在栈内存中的；栈中存储的是基础变量以及一些对象的引用变量，基础变量的值是存储在栈中，而引用变量存储在栈中的是指向堆中的数组或者对象的地址，这就是为何修改引用类型总会影响到其他指向这个地址的引用变量。）
    //                         2、保存与复制的是值本身
    //                         3、使用typeof检测数据的类型
    //                         4、基本类型数据是值类型
    // （2）引用类型：1、占用空间不固定，保存在堆中（当我们在程序中创建一个对象时，这个对象将被保存到运行时数据区中，以便反复利用（因为对象的创建成本通常较大），这个运行时数据区就是堆内存。堆内存中的对象不会随方法的结束而销毁，即使方法结束后，这个对象还可能被另一个引用变量所引用（方法的参数传递时很常见），则这个对象依然不会被销毁，只有当一个对象没有任何引用变量引用它时，系统的垃圾回收机制才会在核实的时候回收它。）
    //                            2、保存与复制的是指向对象的一个指针
    //                            3、使用instanceof检测数据类型
    //                            4、使用new()方法构造出的对象是引用型
    // 实例：
    // 值类型：Number、string、bollean、undefined
    var a = 100
    var b = a
    a = 200
    console.log(b) // 100 保存与复制的是值本身
    // 引用类型：对象、数组、函数、null(空指针)
    // 可以扩展属性
    var a1 = {age: 20}
    var b1 = a
    b1.age = 21
    console.log(a1.age) // 21 内存上来说
    // 值类型
    // 是把每一个值都存在变量所处的位置；
    // 引用类型
    // 是保存和复制的 指向对象的指针 内存公用空间
    // 1占用空间不固定，保存在堆中（当我们在程序中创建一个对象时，这个对象将被保存到运行时数据区中，以便反复利用（因为对象的创建成本通常较大），这个运行时数据区就是堆内存。堆内存中的对象不会随着方法的结束而销毁，即使方法结束后，这个对象还可能被另一个引用变量所引用，则这个对象依然不会被销毁，只有当一个对象没有任何引用变量引用它时，系统的垃圾回收机制才会在合适的时候回收它。）
    // 2保存与复制的是执行对象的一个指针
    // 3使用instanceof检测数据类型
    // 4使用new()方法构造出的对象是引用型

    // 利用typeof来区分 只能区分值类型 虽然函数能区分 是因为函数的特殊性
    typeof undefined // undefined
    typeof 'abc' // string
    typeof 123 // number
    typeof true // boolean
    // typeof 区分不出来引用类型（除了函数）
    typeof {} // object
    typeof [] // object
    typeof null // object 空指针
    typeof console.log //function
    // 用instanceof来区分引用类型
    console.log([1, 2, 3, 4] instanceof Array)
    // 如果变量是给定引用类型（根据它的原型链来识别）的实例，那么
    // instanceof 操作符就会返回 true
    console.log(person instanceof Object); // 变量 person 是 Object 吗？
    console.log(colors instanceof Array); // 变量 colors 是 Array 吗？
    console.log(pattern instanceof RegExp); // 变量 pattern 是 RegExp 吗？

    // 3. 几方面的区别举例：
    // （1）动态的属性： 定义基本类型值和引用类型值的方式是类似的。
    //     但是，当这个值保存到变量中以后，对不同类型值可以执行的操作则大相径庭。
    //     对于引用类型的值，我们可以为其添加属性和方法，也可以改变和删除其属性和方法，
    //     但是，我们不能给基本类型的值添加属性，只能给引用类型值动态地添加属性，以便将来使用。
    //     例如
    var person = new Object();
    person.name = "Nicholas";
    alert(person.name); //"Nicholas"
    // （2）复制变量值： 如果从一个变量向另一个变量复制基本类型值，会在变量对象上创建一个新值，然后把该值复制到为新变量分配的位置上。

    var num1 = 5;
    var num2 = num1
    // 上述例子中，num1保存的值是5，当使用 num1 的值来初始化 num2 时，num2 中也保存了值 5。
    // 但 num2中的 5 与 num1 中的 5 是完全独立的，该值只是 num1 中 5 的一个副本。
    // 此后，这两个变量可以参与任何操作而不会相互影响。
</script>
</body>
</html>

devincob

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
值类型和引用类型的区别

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;值类型vs引用类型&lt;/title&gt;&lt;/head&gt;&lt;body&gt;&lt;scrip
复制链接

扫一扫