从0开始学习JavaScript--JavaScript数据类型与数据结构

JavaScript作为一门动态、弱类型的脚本语言,拥有丰富的数据类型和数据结构,这些构建了语言的基础,为开发者提供了灵活性和表达力。本文将深入探讨JavaScript中的各种数据类型,包括基本数据类型和复杂数据类型,并介绍常用的数据结构,以丰富的示例代码帮助读者更好地理解和应用这些概念。

基本数据类型

JavaScript有七种基本数据类型,分别是:

  • Number(数字)
  • String(字符串)
  • Boolean(布尔)
  • Null(空)
  • Undefined(未定义)
  • Symbol(符号,ES6新增)
  • BigInt(大整数,ES2020新增)
// 示例:基本数据类型
let num = 42; // Number
let str = 'Hello, World!'; // String
let isTrue = true; // Boolean
let empty = null; // Null
let notDefined = undefined; // Undefined
let sym = Symbol('unique'); // Symbol
let bigInt = 9007199254740991n; // BigInt

引用数据类型

引用数据类型包括:

  • Object(对象)
  • Array(数组)
  • Function(函数)
  • Date(日期)
  • RegExp(正则表达式)
  • Map(映射)
  • Set(集合)
// 示例:引用数据类型
let obj = { key: 'value' }; // Object
let arr = [1, 2, 3]; // Array
let func = function() { /* 函数体 */ }; // Function
let today = new Date(); // Date
let regex = /pattern/; // RegExplet map = new Map();
map.set('name', 'John'); // Maplet set = new Set();
set.add(1).add(2).add(3); // Set

类型转换

JavaScript是一门弱类型语言,它会自动进行类型转换。了解类型转换有助于我们更好地理解代码的执行过程。

// 示例:类型转换
let numAsString = '42';
let convertedNum = Number(numAsString);
console.log(convertedNum); // 输出:42let boolAsString = 'true';
let convertedBool = Boolean(boolAsString);
console.log(convertedBool); // 输出:true

数据结构

1 数组(Array)

数组是一种有序的集合,可以包含任意类型的数据。

// 示例:数组
let fruits = ['apple', 'orange', 'banana'];
console.log(fruits[0]); // 输出:apple
console.log(fruits.length); // 输出:3

2 对象(Object)

对象是一种无序的集合,由键值对组成。

// 示例:对象
let person = {name: 'John',age: 30,city: 'New York'
};
console.log(person.name); // 输出:John

3 Map和Set

Map是一种键值对的集合,而Set是一种值的集合,它们提供了更灵活的数据组织方式。

// 示例:Map和Set
let userMap = new Map();
userMap.set('name', 'Alice').set('age', 25);let uniqueNumbers = new Set([1, 2, 3, 4, 5, 5, 5]);

JSON

JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,常用于前后端数据传输。

// 示例:JSON
let jsonData = '{"name": "Bob", "age": 28}';
let parsedData = JSON.parse(jsonData);
console.log(parsedData.name); // 输出:Boblet dataToBeSent = { status: 'success', code: 200 };
let jsonString = JSON.stringify(dataToBeSent);

迭代与遍历

JavaScript提供了多种迭代和遍历数据结构的方式,如for...of循环、forEach方法等。

// 示例:迭代与遍历
let numbers = [1, 2, 3, 4, 5];
for (let num of numbers) {console.log(num);
}numbers.forEach(num => {console.log(num);
});

数据类型与数据结构的选择

在实际开发中,选择合适的数据类型和数据结构至关重要。例如,使用数组来存储有序的数据集合,使用对象或Map来存储键值对。

// 示例:数据类型与数据结构的选择
let student1 = { name: 'Alice', age: 20, grade: 'A' };
let student2 = { name: 'Bob', age: 22, grade: 'B' };
let studentsArray = [student1, student2];let studentsMap = new Map();
studentsMap.set('Alice', { age: 20, grade: 'A' });
studentsMap.set('Bob', { age: 22, grade: 'B' });

常见问题与解决方案

在处理JavaScript数据类型和数据结构时,常常会遇到一些常见的问题,例如如何遍历嵌套对象、如何判断数据类型等。以下是一些常见问题的解决方案。

1 遍历嵌套对象

遍历嵌套对象需要使用递归或其他迭代方法。

// 示例:遍历嵌套对象
function recursiveIteration(obj) {for (let key in obj) {if (typeof obj[key] === 'object' && obj[key] !== null) {recursiveIteration(obj[key]);} else {console.log(obj[key]);}}
}let nestedObject = {key1: 'value1',key2: {key3: 'value3',key4: {key5: 'value5'}}
};recursiveIteration(nestedObject);

2 判断数据类型

判断数据类型可以使用typeof运算符,但对于对象和数组,更准确的方式是使用Array.isArrayObject.prototype.toString方法。

// 示例:判断数据类型
let data = [1, 2, 3];console.log(typeof data); // 输出:object
console.log(Array.isArray(data)); // 输出:true
console.log(Object.prototype.toString.call(data)); // 输出:[object Array]

实战示例

结合实际场景,可以使用数据类型和数据结构来解决具体问题。比如,在一个学生信息管理系统中,可以使用对象存储学生信息,数组存储所有学生,通过遍历和查询实现各种功能。

// 示例:学生信息管理系统
let students = [{ name: 'Alice', age: 20, grade: 'A' },{ name: 'Bob', age: 22, grade: 'B' },// 更多学生...
];function addStudent(student) {students.push(student);
}function findStudentByName(name) {return students.find(student => student.name === name);
}// 其他功能函数...// 添加新学生
addStudent({ name: 'Charlie', age: 21, grade: 'A' });// 查找学生信息
let foundStudent = findStudentByName('Bob');
console.log(foundStudent); // 输出:{ name: 'Bob', age: 22, grade: 'B' }

总结

深入理解JavaScript的数据类型与数据结构对于编写高效、清晰的代码至关重要。通过对基本数据类型、引用数据类型、常见数据结构以及类型转换的深入学习,能够更好地应用这些知识解决实际问题。

随着JavaScript语言的发展,可以期待更多新的数据类型和数据结构的出现,以及更多方便的数据操作方法,进一步提高开发效率。希望本文能够为大家提供对JavaScript数据类型与数据结构的深入了解,为日后的编程实践提供有力的支持。

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

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

相关文章

nginx知识梳理及配置详解

软件开发全文档获取:点我获取 nginx安装 #nginx安装 yum -y install gcc pcre-devel openssl-devel #依赖包 useradd -s /sbin/nologin nginx ./configure --prefix/usr/local/nginx #指定安装目录 --usernginx #指定用户 --with-http_ss…

【数据库篇】关系模式的表示——(1)问题的提出

1、关系模式的表示 R:表示关系的名字比如:sc选课表,student学生表。 U:表示一个关系模式的所有属性,比如student表:U(sno,sname,sage,ssex)。 …

LedControl 库说明文档

LedControl 库最初是为基于 8 位 AVR 处理器的 Arduino 板编写的。但由于该代码不使用处理器的任何复杂的内部功能,因此具有高度可移植性,并且应该在任何支持 和 功能的 Arduino(类似)板上pinMode()运行digitalWrite() 。 单个 M…

C练习题_3

一、单项选择题(本大题共20小题,每小题2分,共40分。在每小题给出的四个备选项中,选出一个正确的答案,并将所选项前的字母填写在答题纸的相应位置上。 以下正确的C语言自定义标识符是() A. la B. 2a C. do D. a.12 2.在C语言中,错…

3、Qt使用windeploy工具打包可执行文件

新建一个文件夹,把要打包的可执行文件exe拷贝过来 点击输入框,复制一下文件夹路径 点击电脑左下角,找到Qt文件夹, 点击打开 “Qt 5.12.0 for Desktop” (我安装的是Qt 5.12.0版本) 输入“cd bin”&#xff…

vivado产生报告阅读分析20-QOR

Report QoR Suggestions report_qor_suggestions 命令是处理 QoR 建议对象时使用的主要命令。 QoR 建议对象会创建命令和属性来改善设计的时序性能( 欲知详情 , 请参阅 QoR 建议 ) 。 report_qor_suggestions 命令可执行两项任务 &am…

chatGPT4机器学习数据后最终保留在机器里的是什么? 机器是怎么产生智能的? TensorFlow没有直接开发出类似GPT-4这样的模型

机器学习数据后最终保留在机器里的是机器学习模型。机器学习模型是机器学习系统中的核心,它是机器学习系统能够进行推理和预测的基础。 机器学习模型通常由参数组成。参数是机器学习模型的权重和偏差。机器学习系统通过训练来学习这些参数。训练是指让机器学习系统…

webpack 打包优化

在vue.config.js中配置 下载 uglifyjs-webpack-plugin 包 const { defineConfig } require("vue/cli-service"); var path require("path");module.exports defineConfig({transpileDependencies: true,filenameHashing: false, // 去除Vue打包后.cs…

0003Java程序设计-ssm基于微信小程序的家教信息管理系统

文章目录 摘要目 录系统实现开发环境 编程技术交流、源码分享、模板分享、网课分享 企鹅🐧裙:776871563 摘要 本文讲述了基于微信小程序的家教信息管理系统的设计与实现。结合线上管理的特点,分析了家教信息管理系统的现状,给出…

外汇天眼:香港监管机构对AMTD Global Markets Limited启动法律诉讼

香港证监会(SFC)已经启动了法律程序,要求首次审裁法院调查AMTD Global Markets Limited(AMTD,目前以orientiert XYZ Securities Limited为名)及其前高管在与首次公开发行(IPO)相关的…

【经典小练习】修改文件中的数据

文章目录 🌹例子🌺思路🛸方法一✨报错解决 🛸方法二 🌹例子 文本文件中有下面的数据 2-1-9-4-7-8 将文件中的数据进行排序,变成下面的数据 1-2-4-7-8-9 🌺思路 要对这些数据进行排序&#xf…

智慧楼宇可视化视频综合管理系统,助力楼宇高效安全运行

随着互联网技术的进步和发展,智能化的楼宇建设也逐步成为人们选择办公场所是否方便的一个重要衡量因素。在智能化楼宇中,安全管理也是重要的一个模块。得益于互联网新兴技术的进步,安防视频监控技术也得到了快速发展并应用在楼宇的安全管理中…

Python武器库开发-前端篇之html概述(二十八)

前端篇之html概述(二十八) html概述 HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准,是构建以及呈现互联网内容的一种语言方式.被认为是互联网的核心技术之一。HTML产生于1990年,1997年HTML4成为互联网标准,…

虹科Pico汽车示波器 | 汽车免拆检修 | 2011款瑞麒M1车发动机起动困难、加速无力

一、故障现象 一辆2011款瑞麒M1车,搭载SQR317F发动机,累计行驶里程约为10.4万km。该车因发动机起动困难、抖动、动力不足、热机易熄火等故障进厂维修。用故障检测仪检测,发动机控制单元(ECU)中存储有故障代码“P0340相…

Vue框架学习笔记——事件处理

文章目录 前文提要事件处理的解析过程样例代码如下:效果展示图片:v-on:click"响应函数"v-on:click简写形式响应函数添加响应函数传参占位符"$event"注意事项 前文提要 本人仅做个人学习记录,如有错误,请多包…

2、git进阶操作

2、git进阶操作 2.1.1 分支的创建 命令参数含义git branch (git checkout -b)<new_branch> <old_branch>表示创建分支-d <-D>删除分支 –d如果分支没有合并&#xff0c;git会提醒&#xff0c;-D强制删除-a -v查看分支-m重新命名分支commit id从指定的commi…

如何打造“面向体验”的音视频能力——对话火山引擎王悦

编者按&#xff1a;随着全行业视频化的演进&#xff0c;我们置身于一个充满创新与变革的时代。在这个数字化的浪潮中&#xff0c;视频已经不再只是传递信息的媒介&#xff0c;更是重塑了我们的交互方式和体验感知。作为字节跳动的“能力溢出”&#xff0c;火山引擎正在飞速奔跑…

RK3588平台 USB框架与USB识别流程

一.USB的基本概念 在最初的标准里&#xff0c;USB接头有4条线&#xff1a;电源&#xff0c;D-,D,地线。我们暂且把这样的叫做标准的USB接头吧。后来OTG出现了&#xff0c;又增加了miniUSB接头。而miniUSB接头则有5条线&#xff0c;多了一条ID线,用来标识身份用的。 热插拔&am…

最新AIGC创作系统ChatGPT网站源码,Midjourney绘画系统,支持GPT-4图片对话能力(上传图片并识图理解对话),支持DALL-E3文生图

一、AI创作系统 SparkAi创作系统是基于OpenAI很火的ChatGPT进行开发的Ai智能问答系统和Midjourney绘画系统&#xff0c;支持OpenAI-GPT全模型国内AI全模型。本期针对源码系统整体测试下来非常完美&#xff0c;可以说SparkAi是目前国内一款的ChatGPT对接OpenAI软件系统。那么如…

2023亚太杯数学建模B题完整原创论文讲解

大家好呀&#xff0c;从发布赛题一直到现在&#xff0c;总算完成了2023亚太地区数学建模竞赛B题玻璃温室的微气候调控完整的成品论文。 本论文可以保证原创&#xff0c;保证高质量。绝不是随便引用一大堆模型和代码复制粘贴进来完全没有应用糊弄人的垃圾半成品论文。 论文共6…