从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语言中,错…

C# 之对象与Xml序列化工具类

写在前面 一个常用的对象与Xml序列化工具类&#xff0c;使用系统类库System.Xml&#xff0c;序列化时需要注意只能将对象的公共字段和读/写属性转换为 XML。不转换方法、索引器、私有字段或只读属性。另外XmlSerializer 类无法序列化ArrayList数组和List<T>数组。 using…

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

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

springsecurity5.7.x和springsecurity6.x配置文件对比

springsecurity5和springsecurity6如何要实现多种登录方式&#xff0c;自定义登录方式都是一样的操作步骤&#xff0c;主要有四个步骤。 一、自定义登录用户实体实现springsecurity中的UserDetails接口 二、自定义登录用户实现类实现springsecurity中的UserDetailsService接口 …

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

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

代码随想录-刷题第七天

454. 四数相加II 题目链接&#xff1a;454. 四数相加II 思路&#xff1a;哈希法。使用map集合&#xff0c;key存放ab的值&#xff0c;value存放ab出现的次数。使用两层循环&#xff0c;循环前两个数组&#xff0c;找出ab&#xff0c;对map赋值。再用两层循环&#xff0c;遍历…

唯创知音WT2605C-A001音频蓝牙语音芯片:小巧体积,高品质音频播放的创新

在现今的科技繁荣时代&#xff0c;音频技术作为人类感知世界的重要方式&#xff0c;已经变得越来越重要。唯创知音WT2605C-A001音频蓝牙语音芯片&#xff0c;以其卓越的特性和创新性&#xff0c;正在为音频技术领域带来一场革命。 首先&#xff0c;这款芯片以其极小的体积—仅…

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

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

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基于微信小程序的家教信息管理系统

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

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

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

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

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

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

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

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

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

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

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

【Python 训练营】N_2 打印乘法口诀表

题目 借助格式化输出长方形、左上三角形、右上三角形、左下三角形、右下三角形5种格式的九九乘法口诀表。 答案 长方形格式 for i in range(1,10):for j in range(1,10):print(%d*%d%2d%(i,j,i*j),end ) # %2d 整数站两个字节print()左上三角形 for i in range(1,10):for …

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

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