javaScript:带你深入了解基本数据类型和引用类型

news2025/1/3 4:46:52

目录

一.前言

二.Ecmascript 规定的变量有两种

补充 

1.基本数据类型(重点掌握)

基本数据类型的特点

2.引用数据类型 (重点掌握)

引用数据类型的特点

三.什么是栈?堆?

下面代码帮助了解 

解释 

官方解释

总结 

四.小练习 (烧脑面试题)

解释

完整代码


一.前言

       在计算机编程中,数据是关键的组成部分。了解数据的类型和特性对于编写高效和可靠的代码至关重要。在许多编程语言中,包括JavaScript,数据可以分为两大类别:基本数据类型和引用类型。

        基本数据类型是指存储简单数据值的类型,它们被视为不可改变的。在JavaScript中,基本数据类型包括数字(Number)、字符串(String)、布尔值(Boolean)、空值(Null)、未定义(Undefined)和符号(Symbol)。这些类型的变量在内存中直接存储它们的值,且每个变量都相互独立,互不影响。

       引用类型是指存储对象和复杂数据结构的类型,它们可以包含多个值并具有其自己的方法和属性。在JavaScript中,引用类型包括对象(Object)、数组(Array)、函数(Function)等。与基本数据类型不同,引用类型的变量实际上存储的是对象在内存中的引用地址,而不是对象本身。这意味着多个变量可以引用同一个对象,对其中一个引用进行修改会影响到其他引用。

        深入了解基本数据类型和引用类型的区别和特性对于开发者来说是至关重要的。这种了解有助于理解变量的行为、内存管理、函数传参、数据操作等方面的工作原理。它们的使用和处理方式可能不同,因此我们需要掌握如何正确地操作和使用不同的数据类型,以避免潜在的错误和性能问题。

        在接下来的内容中,我们将深入研究基本数据类型和引用类型的各项特性和用法,让你更加熟悉它们之间的区别,为编写高质量的代码打下坚实的基础。

二.Ecmascript 规定的变量有两种

Ecmascript  规定变量有两种不同的数据类型:基本类型 和 引用类型

基本类型 包括:number boolean string undefined

引用类型 包括:数组和对象

补充 

也有其他的不同分类  原始类型 和 对象类型

或者 拥有方法的类型 和没有方法的类型

可变类型 和 不可变类型

以上的这些叫法都是依据两种类型特点来命名的,他们只是叫法不同其本质上都是数据类型。

1.基本数据类型(重点掌握)

基本数据类型的特点

基本类型的特点

            基本类型的比较是 值的比较

            基本类型的值是不能变的

            基本类型的值 存在于 栈区中

2.引用数据类型 (重点掌握)

引用数据类型的特点

引用类型的特点

           引用类型的值 是 可变的

           引用类型的比较是 引用的比较

           引用类型的值 存在于 栈内存和堆内存中

三.什么是栈?堆?

    栈:指的是栈内存,存放的数据是先进后出,栈自动分配内存空间,也会自动释放内存空间

    堆:指的是堆内存,动态分配内存空间,大小不确定,也不会自动释放内存空间先进先出。

下面代码帮助了解 

let arr = [1,2,3,4];
    let arr1 = arr; //此时arr1指向 堆内存中的 数组空间

    arr[1]='分手快乐';
    arr[2]='说散就散';
    console.log(arr);  //说明arr1 和arr同时指向一个地方

 

解释 

将数组 arr 赋值给 arr1 时,实际上是将堆内存中数组的引用复制给了 arr1。这意味着 arr 和 arr1 都指向相同的数组空间。

所以,当你修改 arr 中的元素时,例如 arr[1] = '分手快乐' 和 arr[2] = '说散就散',这些修改会反映在原始的数组上。由于 arr1 指向同一个数组,因此也会反映在 arr1 上。

这是因为数组是引用类型,在 JavaScript 中,对象(包括数组)的赋值是传递引用的。所以,arr 和 arr1 引用了相同的数组对象,它们指向相同的内存空间。任何针对该数组的更改都会被反映在两个变量上。

官方解释

       在计算机科学中,栈(Stack)和堆(Heap)是两种常见的数据结构,用于管理程序在内存中的分配和存储。

       栈(Stack)是一种后进先出(Last-In-First-Out,LIFO)的数据结构。它类似于现实生活中的堆叠物品,只能从最顶端插入和删除数据。当一个函数被调用时,函数的局部变量和参数被存储在栈内存中。每当一个新的函数调用发生时,该函数的数据被压入栈的顶部,形成一个称为栈帧(Stack Frame)的数据块。当函数执行完成后,栈帧被移出栈,控制权返回给调用函数。栈的大小通常是有限的,并受限于操作系统或编程语言的设定。

        堆(Heap)是一种用于动态分配内存的区域。与栈不同,堆的内存分配和释放没有特定的顺序,它是一种自由存储区域。在堆上分配的内存可以通过指针进行访问,并且在不同的部分之间共享。在编程中,动态创建的对象、数组和其他复杂数据结构通常存储在堆内存中。在堆上分配的内存需要手动进行释放,否则可能会导致内存泄漏。

       栈和堆在内存管理方面具有不同的特点和使用场景。栈的存储和释放速度较快,但容量有限,适合存储简单的局部变量和函数调用的上下文信息。堆则可以动态分配大量的内存空间,但需要程序员负责手动分配和释放内存,并且会存在一定的分配和释放开销。

总结 

       总的来说,栈和堆是计算机内存管理中的两个重要概念。栈用于存储函数调用和局部变量,具有快速的分配和释放特性;而堆用于动态分配内存,适合存储较大的对象和复杂的数据结构,但需要手动管理内存的分配和释放。

四.小练习 (烧脑面试题)

 let num = num1 =10
    let a = {m:1}
    let b = a;
    a.x = a = {n:1} 
    console.log(a.x);
    console.log(b.x);

解释

    由于 . 操作高于 联= ,因此先算a.x = {n:1},此时a 和b指向的是内存中

    的同一个空间,因此b = {m:1,x:{n:1} }

    然后再计算 a = {n:1},这样之前声明的a 会被直接释放,只留下一个新的a={n:1}

    综上,计算结果是

    a= {n:1}

    b={

        m:1

        x:{n:1}

    }

所以输出的应是 undefined  {n:1}

完整代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>引用类型</title>
</head>
<body>
    
</body>
</html>
<script>
    /*
    基本数据类型
    number boolean string undefined null object

    Ecmascript  规定变量有两种不同的数据类型:基本类型 和 引用类型
    基本类型 包括:number boolean string undefined 
    引用类型 包括:数组和对象

    也有其他的不同分类  原始类型 和 对象类型
    或者 拥有方法的类型 和没有方法的类型
    可变类型 和 不可变类型

    以上的这些叫法都是依据两种类型特点来命名的
    1.基本类型
        基本类型的特点
            基本类型的比较是 值的比较
            基本类型的值是不能变的
            基本类型的值 存在于 栈区中
    2.引用类型
        引用类型的特点
           引用类型的值 是 可变的
           引用类型的比较是 引用的比较
           引用类型的值 存在于 栈内存和堆内存中

    栈:指的是栈内存,存放的数据是先进后出,栈自动分配内存空间,也会
    自动释放内存空间
    堆:指的是堆内存,动态分配内存空间,大小不确定,也不会自动释放内存空间
    先进先出
    */
    let arr = [1,2,3,4];
    let arr1 = arr; //此时arr1指向 堆内存中的 数组空间

    arr[1]='分手快乐';
    arr[2]='说散就散';
    console.log(arr);  //说明arr1 和arr同时指向一个地方

    let arr2 = arr.concat()  //拷贝
    arr2[2]='体面';
    console.log(arr);

    let arr3 = arr.slice() //拷贝
    arr3[2] = '移情别恋'
    console.log(arr3);
   
    let num = num1 =10
    let a = {m:1}
    let b = a;
    a.x = a = {n:1} 
    /*
    由于 . 操作高于 联= ,因此先算a.x = {n:1},此时a 和b指向的是内存中
    的同一个空间,因此b = {m:1,x:{n:1} } 
    然后再计算 a = {n:1},这样之前声明的a 会被直接释放,只留下一个新的a={n:1}

    综上,计算结果是
    a= {n:1}
    b={
        m:1
        x:{n:1}
    }
    */
    console.log(a.x);
    console.log(b.x);

    //声明一个空对象
    let obj1 ={}
    //给对象添加属性
    obj1.name = '牛郎'
    obj1.act = function(){
        console.log('偷织女的衣服')
    }
    obj1.box = {
        abc:'老黄牛'
    }
    console.log(obj1);
    console.log(obj1.box.abc)

</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/918423.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

线性数据结构:数组与链表的探索与应用

文章目录 1. 数组&#xff1a;连续存储的有序元素集合1.1 创建和访问数组1.2 数组的搜索与排序 2. 链表&#xff1a;非连续存储的动态数据结构2.1 单链表与双链表2.2 链表的操作与应用 3. 数组与链表的比较与应用3.1 数组与链表的比较3.2 数组与链表的应用 4. 总结与展望 &…

Docker基本部署和相关操作

1.安装docker服务&#xff0c;配置镜像加速器 1、yum安装并且添加源信息 yum install yum-utils device-mapper-persistent-data lvm2 -y yum-config-manager --add-repo https://mirrors.tuna.tsinghua.edu.cn/docker-ce/linux/centos/docker-ce.repo2、修改一些配置信息 sed…

跨境电商系统开发:解锁海外财富,轻松实现财富自由

了解跨境电商系统开发的重要性 随着全球化和科技发展的进程&#xff0c;跨境电商已经成为一种崭新且热门的商业模式。跨境电商系统开发为企业提供了进军海外市场的机会&#xff0c;解锁了海外财富&#xff0c;帮助实现财富自由。 跨境电商系统的基本架构 跨境电商系统的基本架…

反腐力度空前,医药行业全面合规势在必行!

“公立医院改革、临床试验自查、医疗反腐、分级诊疗、药品集中采购、一致性评价、最严限抗、两票制等一系列政策卷起了医疗界阵阵反腐风暴。据报道&#xff0c;全国已有至少155家医院的院长和书记接受了调查。。。” 医药行业是与人们的生命和健康息息相关的重要领域&#xff…

一云多芯,智能化转型的下一个工程化挑战

进入2023年&#xff0c;产业数字化和智能化转型升级进入了大规模工程化落地阶段。根据中国信通院《中国数字经济发展研究报告&#xff08;2023&#xff09;》&#xff0c;数字经济已经占我国GDP比重达到41.5%&#xff0c;相当于第二产业占国民经济的比重。随着产业数字化和智能…

java Collection/Map选型

1.Collection接口 Collection接口实现了Iterator接口&#xff0c;所以Collection接口的实现类都可以用迭代器进行迭代。 Collection接口主要有两大重要的子接口List(列表)、Set(集合)。 List的主要特点是&#xff1a;有序、值可重复、支持索引访问。 Set的主要特点是&#xf…

【学习FreeRTOS】第16章——FreeRTOS事件标志组

1.事件标志组简介 事件标志位&#xff1a;用一个位&#xff0c;来表示事件是否发生 事件标志组是一组事件标志位的集合&#xff0c; 可以简单的理解事件标志组&#xff0c;就是一个整数。 事件标志组的特点&#xff1a; 它的每一个位表示一个事件&#xff08;高8位不算&…

spring练习32-删除用户操作

18-Spring练习-删除用户操作_哔哩哔哩_bilibili 106 1、删除操作怎么做&#xff0c;点击删除的时候&#xff0c;我要发请求&#xff0c;就是controller某个方法当中&#xff0c;要不要携带参数那&#xff0c;因为你点这个&#xff0c;那个&#xff0c;都不一眼 2、你点这个你…

低压风机单片机方案

低压风机通常由电机、转子、机壳、进气管、出气管、齿轮和减速机等组成。电机带动转子旋转&#xff0c;旋转的转子带动齿轮和减速机转动&#xff0c;进而形成空气被吸入转子内部&#xff0c;通过旋转而产生的离心力把气体压缩&#xff0c;并将气体排出。 低压风机方案的主控型…

【C++入门到精通】C++入门 —— 模版(template)

阅读导航 前言一、模版的概念二、函数模版1. 函数模板概念2. 函数模板定义格式3. 函数模板的原理4. 函数模版的实例化&#x1f6a9;隐式实例化&#x1f6a9;显式实例化 5. 函数模板的匹配原则 三、类模板1. 类模板的定义格式2. 类模板的实例化 四、非类型模板参数1. 概念2. 定义…

GPT4模型架构的泄漏与分析

迄今为止&#xff0c;GPT4 模型是突破性的模型&#xff0c;可以免费或通过其商业门户&#xff08;供公开测试版使用&#xff09;向公众提供。它为许多企业家激发了新的项目想法和用例&#xff0c;但对参数数量和模型的保密却扼杀了所有押注于第一个 1 万亿参数模型到 100 万亿参…

Docker是什么?详谈它的框架、使用场景、优势

作者&#xff1a;Insist-- 个人主页&#xff1a;insist--个人主页 作者会持续更新网络知识和python基础知识&#xff0c;期待你的关注 目录 一、什么是 Docker&#xff1f; 二、Docker 的架构 1、Docker客户端 2、Docker守护进程 3、Docker镜像 4、Docker容器 5、Docker…

锚定医学营养 健启星深耕不辍

在生命医学中&#xff0c;营养被称为维持患者生命的物质基础。医学营养&#xff0c;是结合了医学临床营养、营养素与疾病预防等方面&#xff0c;并根据患者的医疗记录、身体检查及心理情况&#xff0c;由医生及专业营养师给出配比完善的营养素&#xff0c;以此来增加患者身体的…

SSM框架的学习与应用(Spring + Spring MVC + MyBatis)-Java EE企业级应用开发学习记录(第三天)动态SQL

动态SQL—SSM框架的学习与应用(Spring Spring MVC MyBatis)-Java EE企业级应用开发学习记录&#xff08;第三天&#xff09;Mybatis的动态SQL操作 昨天我们深入学习了Mybatis的核心对象SqlSessionFactoryBuilder&#xff0c;掌握MyBatis核心配置文件以及元素的使用,也掌握My…

《Zookeeper》源码分析(十九)之 LearnerHandler

目录 LearnerCnxAcceptorrun() LearnerCnxAcceptorHandlerrun() LearnerHandlerrun()syncFollower()SNAP全量同步startSendingPackets() LearnerCnxAcceptor 在Leader.lead()方法中创建并启动LearnerCnxAcceptor线程&#xff0c;该线程主要是建立LearnerCnxAcceptorHandler并将…

介绍两个js补环境项目

1. v-jstools 这个项目是一个浏览器插件&#xff0c;用来补环境的话&#xff0c;是非常好的一个插件。项目地址是&#xff1a;GitHub - cilame/v_jstools: https://github.com/cilame/v_jstools 这里是我的配置 这个是使用后的效果 可以看到&#xff0c;里面调用的环境都被检…

【ARM AMBA AXI 入门 10 - AXI 总线 DATA信号与 STRB 信号之间的关系 】

文章目录 AXI STRB 信号 AXI STRB 信号 AXI总线是ARM公司设计的高性能处理器接口&#xff0c;其中STRB和DATA信号在AXI协议中有特殊的含义和关系。 DATA信号&#xff1a;在AXI中&#xff0c;DATA信号用于在读写操作中传输实际的数据。数据的大小可以根据AXI接口的位宽来变化&…

Redis(缓存预热,缓存雪崩,缓存击穿,缓存穿透)

目录 一、缓存预热 二、缓存雪崩 三、缓存击穿 四、缓存穿透 一、缓存预热 开过车的都知道&#xff0c;冬天的时候启动我们的小汽车之后不要直接驾驶&#xff0c;先让车子发动机预热一段时间再启动。缓存预热是一样的道理。 缓存预热就是系统启动前&#xff0c;提前将相关的…

I2C读写eeprom的问题

接线 在配置I2C的时候要把IO的口设置为开漏模式&#xff0c;为什么要设置开漏模式呢&#xff1f; 答&#xff1a;I2C协议支持多个主设备与多个从设备在一条总线上&#xff0c;如果不用开漏输出&#xff0c;而用推挽输出&#xff0c;会出现主设备之间短路的情况所以总线一般会…

基于闪电搜索算法优化的BP神经网络(预测应用) - 附代码

基于闪电搜索算法优化的BP神经网络&#xff08;预测应用&#xff09; - 附代码 文章目录 基于闪电搜索算法优化的BP神经网络&#xff08;预测应用&#xff09; - 附代码1.数据介绍2.闪电搜索优化BP神经网络2.1 BP神经网络参数设置2.2 闪电搜索算法应用 4.测试结果&#xff1a;5…