【前端(十三)】JavaScript 数组与字符串笔记

news2026/5/6 12:21:39
文章目录JavaScript 数组与字符串笔记一、数组Array1.1 定义1.2 特点1.3 查询与索引访问1.4 修改与赋值1.5 length 属性与 empty1.6 删除元素1.7 常用方法精讲 添加元素 截取与合并 查找元素 遍历 排序与反转 数组转字符串二、字符串String2.1 定义2.2 特点2.3 索引访问只读2.4 拼接与模板字符串2.5 常用方法精讲 截取 查找与判断 修改生成新串 分割与拼接 填充三、JavaScript 与 Java 核心差异对比JavaScript 数组与字符串笔记一、数组Array1.1 定义语法格式// 字面量推荐let数组名[元素1,元素2,...];// 构造函数了解let数组名newArray();// 空数组let数组名newArray(长度);// 稀疏数组全是 emptylet数组名newArray(值1,值2,...);// 等价于字面量例子letnums[10,20,30];letmix[1,hello,true,{name:Tom}];// 混合类型1.2 特点无类型限制同一个数组可存放任意类型的元素。动态长度自动伸缩length属性可读写。索引从 0 开始越界访问不会抛出异常返回undefined。1.3 查询与索引访问直接使用[ ]获取元素支持at()负索引letarr[10,20,30];console.log(arr[0]);// 10console.log(arr[5]);// undefined 不抛异常console.log(arr.at(-1));// 301.4 修改与赋值赋值可修改已有元素也可扩容数组。letarr[1,2,3];// 修改索引在 length 范围内arr[1]100;// 改变原数组[1, 100, 3]// 扩容赋值索引 ≥ lengtharr[5]hello;// 改变原数组[1, 100, 3, empty × 2, hello]// length 变为 6修改索引位于0 ~ length-1直接覆盖原值。扩容赋值索引 ≥length数组自动扩展中间未赋值的索引成为empty。1.5 length 属性与 emptylength可直接修改来截断或扩展数组letarr[1,2,3,4,5];console.log(arr.length);// 5// 减小 length → 截断数组arr.length2;console.log(arr);// [1, 2]// 增大 length → 增加空位arr.length5;console.log(arr);// [1, 2, empty × 3]什么是 emptyempty不是undefined不是null也不是0它表示数组中的空位hole。访问空位时会返回undefined但这两者并不相等empty是“没有值”的占位遍历时会被跳过undefined是一个真实的值遍历时不会被跳过leta[1,,3];// 中间是一个 emptyconsole.log(a[1]);// undefineda.forEach(vconsole.log(v));// 输出 1 和 3跳过空位letb[1,undefined,3];b.forEach(vconsole.log(v));// 输出 1、undefined、31.6 删除元素方法描述是否改变原数组示例与结果delete arr[i]删除指定索引值留下 empty是length 不变delete arr[1]→[1, empty, 3]splice(start, n)删除从 start 开始的 n 个元素是arr.splice(1,2)→ 删除并返回被删元素数组pop()删除最后一个元素返回该元素是arr.pop()shift()删除第一个元素返回该元素是arr.shift()⚠️ 日常开发中用splice、pop、shift执行真正删除避免delete造成稀疏数组。letarr[a,b,c,d];deletearr[1];// 变成 [a, empty, c, d]不推荐arr.splice(1,2);// 从索引1删2个变成 [a, d]arr.pop();// 移除 darr.shift();// 移除 a1.7 常用方法精讲 添加元素方法描述是否改变原数组push(...items)末尾添加返回新 length是unshift(...items)开头添加返回新 length是letarr[2,3];arr.push(4);// arr 变成 [2,3,4]arr.unshift(1);// arr 变成 [1,2,3,4] 截取与合并方法描述是否改变原数组slice(start, end)浅拷贝一段返回新数组❌ 否splice(start, n, ...items)删除/插入/替换万能修改器是letarr[1,2,3,4];letsubarr.slice(1,3);// 返回 [2, 3]arr 不变arr.splice(1,2,a);// arr 变成 [1, a, 4] 查找元素方法描述是否改变原数组indexOf(item)严格相等查找返回索引-1 找不到❌ 否includes(item)是否包含返回 boolean❌ 否find(callback)返回第一个满足条件的元素❌ 否letarr[10,20,30];arr.indexOf(20);// 1arr.includes(40);// falsearr.find(xx15);// 20 遍历方法描述是否改变原数组forEach(callback)对每个元素执行回调无返回值❌ 不改变原数组但回调内可修改元素letarr[1,2,3];arr.forEach((v,i)console.log(i,v));// 输出 0 1, 1 2, 2 3// arr 本身不变除非在回调中赋值 arr[i]... 排序与反转方法描述是否改变原数组sort(compareFn)排序默认按字符串顺序是reverse()反转顺序是letarr[1,2,10];arr.sort();// [1, 10, 2]字符串排序arr.sort((a,b)a-b);// [1, 2, 10]数字升序arr.reverse();// [10, 2, 1] 数组转字符串方法描述是否改变原数组join(分隔符)将数组用分隔符连接成字符串❌ 否toString()默认用逗号连接❌ 否[1,2,3].join(-);// 1-2-3[1,2,3].toString();// 1,2,3二、字符串String2.1 定义lets1hello;lets2world;lets3模板字符串;// 支持多行与嵌入变量2.2 特点不可变任何操作都返回新字符串原字符串不会改变。类数组索引可用[index]或charAt(index)读取单个字符但只能读。2.3 索引访问只读letstrJavaScript;console.log(str[0]);// Jconsole.log(str[10]);// undefinedstr[0]j;// 无效str 不变2.4 拼接与模板字符串传统拼接使用运算符letresultHello, name!;模板字符串使用反引号支持多行字符串直接换行即可变量或表达式用${}嵌入。letmulti第一行 第二行;// 保留换行2.5 常用方法精讲 截取方法描述返回slice(start, end)截取 [start, end)支持负索引新字符串letsJavaScript;s.slice(0,4);// Javas.slice(-6);// Script从倒数第6到末尾 查找与判断方法描述返回indexOf(sub)查找子串首次出现位置索引或 -1includes(sub)判断是否包含子串booleanstartsWith(sub)是否以 sub 开头booleanendsWith(sub)是否以 sub 结尾booleanletshello world;s.indexOf(o);// 4s.includes(world);// trues.startsWith(he);// true 修改生成新串方法描述返回replace(old, new)替换第一个匹配可用正则全局替换新字符串replaceAll(old, new)替换所有匹配新字符串toLowerCase()全小写新字符串toUpperCase()全大写新字符串trim()去除两端空格新字符串lets JS ;s.trim();// JSapple, apple.replaceAll(apple,orange);// orange, orange 分割与拼接方法描述返回split(分隔符)将字符串拆为数组数组数组的join()将数组拼回字符串字符串2025-01-01.split(-);// [2025,01,01][a,b,c].join();// abc 填充方法描述返回padStart(len, str)在前填充至指定长度新字符串padEnd(len, str)在后填充至指定长度新字符串5.padStart(3,0);// 005ab.padEnd(5,!);// ab!!!三、JavaScript 与 Java 核心差异对比对比维度JavaScriptJava数组类型元素可混合无固定类型强类型元素必须同一类型数组长度动态伸缩length属性可读写长度固定length只读越界访问返回undefined不抛异常抛出ArrayIndexOutOfBoundsException直接索引赋值扩容支持索引≥length 时自动扩容不支持只能修改现有索引数组删除splice、pop、shift直接删除无内置直接删除需用集合类字符串不可变性是所有操作返回新串是String不可变字符访问str[i]直接读只读必须charAt(i)字符串比较直接比值equals()比较内容比较引用数组排序默认按字符串排序基本类型自然排序对象需Comparator内容相等数组内容比较不能直接用Arrays.equals()深度比较以上为个人学习总结旨在梳理个人理解。如有疏漏或不当之处欢迎指正与交流。

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

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

相关文章

SpringBoot-17-MyBatis动态SQL标签之常用标签

文章目录 1 代码1.1 实体User.java1.2 接口UserMapper.java1.3 映射UserMapper.xml1.3.1 标签if1.3.2 标签if和where1.3.3 标签choose和when和otherwise1.4 UserController.java2 常用动态SQL标签2.1 标签set2.1.1 UserMapper.java2.1.2 UserMapper.xml2.1.3 UserController.ja…

wordpress后台更新后 前端没变化的解决方法

使用siteground主机的wordpress网站,会出现更新了网站内容和修改了php模板文件、js文件、css文件、图片文件后,网站没有变化的情况。 不熟悉siteground主机的新手,遇到这个问题,就很抓狂,明明是哪都没操作错误&#x…

网络编程(Modbus进阶)

思维导图 Modbus RTU(先学一点理论) 概念 Modbus RTU 是工业自动化领域 最广泛应用的串行通信协议,由 Modicon 公司(现施耐德电气)于 1979 年推出。它以 高效率、强健性、易实现的特点成为工业控制系统的通信标准。 包…

UE5 学习系列(二)用户操作界面及介绍

这篇博客是 UE5 学习系列博客的第二篇,在第一篇的基础上展开这篇内容。博客参考的 B 站视频资料和第一篇的链接如下: 【Note】:如果你已经完成安装等操作,可以只执行第一篇博客中 2. 新建一个空白游戏项目 章节操作,重…

IDEA运行Tomcat出现乱码问题解决汇总

最近正值期末周,有很多同学在写期末Java web作业时,运行tomcat出现乱码问题,经过多次解决与研究,我做了如下整理: 原因: IDEA本身编码与tomcat的编码与Windows编码不同导致,Windows 系统控制台…

利用最小二乘法找圆心和半径

#include <iostream> #include <vector> #include <cmath> #include <Eigen/Dense> // 需安装Eigen库用于矩阵运算 // 定义点结构 struct Point { double x, y; Point(double x_, double y_) : x(x_), y(y_) {} }; // 最小二乘法求圆心和半径 …

使用docker在3台服务器上搭建基于redis 6.x的一主两从三台均是哨兵模式

一、环境及版本说明 如果服务器已经安装了docker,则忽略此步骤,如果没有安装,则可以按照一下方式安装: 1. 在线安装(有互联网环境): 请看我这篇文章 传送阵>> 点我查看 2. 离线安装(内网环境):请看我这篇文章 传送阵>> 点我查看 说明&#xff1a;假设每台服务器已…

XML Group端口详解

在XML数据映射过程中&#xff0c;经常需要对数据进行分组聚合操作。例如&#xff0c;当处理包含多个物料明细的XML文件时&#xff0c;可能需要将相同物料号的明细归为一组&#xff0c;或对相同物料号的数量进行求和计算。传统实现方式通常需要编写脚本代码&#xff0c;增加了开…

LBE-LEX系列工业语音播放器|预警播报器|喇叭蜂鸣器的上位机配置操作说明

LBE-LEX系列工业语音播放器|预警播报器|喇叭蜂鸣器专为工业环境精心打造&#xff0c;完美适配AGV和无人叉车。同时&#xff0c;集成以太网与语音合成技术&#xff0c;为各类高级系统&#xff08;如MES、调度系统、库位管理、立库等&#xff09;提供高效便捷的语音交互体验。 L…

(LeetCode 每日一题) 3442. 奇偶频次间的最大差值 I (哈希、字符串)

题目&#xff1a;3442. 奇偶频次间的最大差值 I 思路 &#xff1a;哈希&#xff0c;时间复杂度0(n)。 用哈希表来记录每个字符串中字符的分布情况&#xff0c;哈希表这里用数组即可实现。 C版本&#xff1a; class Solution { public:int maxDifference(string s) {int a[26]…

【大模型RAG】拍照搜题技术架构速览:三层管道、两级检索、兜底大模型

摘要 拍照搜题系统采用“三层管道&#xff08;多模态 OCR → 语义检索 → 答案渲染&#xff09;、两级检索&#xff08;倒排 BM25 向量 HNSW&#xff09;并以大语言模型兜底”的整体框架&#xff1a; 多模态 OCR 层 将题目图片经过超分、去噪、倾斜校正后&#xff0c;分别用…

【Axure高保真原型】引导弹窗

今天和大家中分享引导弹窗的原型模板&#xff0c;载入页面后&#xff0c;会显示引导弹窗&#xff0c;适用于引导用户使用页面&#xff0c;点击完成后&#xff0c;会显示下一个引导弹窗&#xff0c;直至最后一个引导弹窗完成后进入首页。具体效果可以点击下方视频观看或打开下方…

接口测试中缓存处理策略

在接口测试中&#xff0c;缓存处理策略是一个关键环节&#xff0c;直接影响测试结果的准确性和可靠性。合理的缓存处理策略能够确保测试环境的一致性&#xff0c;避免因缓存数据导致的测试偏差。以下是接口测试中常见的缓存处理策略及其详细说明&#xff1a; 一、缓存处理的核…

龙虎榜——20250610

上证指数放量收阴线&#xff0c;个股多数下跌&#xff0c;盘中受消息影响大幅波动。 深证指数放量收阴线形成顶分型&#xff0c;指数短线有调整的需求&#xff0c;大概需要一两天。 2025年6月10日龙虎榜行业方向分析 1. 金融科技 代表标的&#xff1a;御银股份、雄帝科技 驱动…

观成科技:隐蔽隧道工具Ligolo-ng加密流量分析

1.工具介绍 Ligolo-ng是一款由go编写的高效隧道工具&#xff0c;该工具基于TUN接口实现其功能&#xff0c;利用反向TCP/TLS连接建立一条隐蔽的通信信道&#xff0c;支持使用Let’s Encrypt自动生成证书。Ligolo-ng的通信隐蔽性体现在其支持多种连接方式&#xff0c;适应复杂网…

铭豹扩展坞 USB转网口 突然无法识别解决方法

当 USB 转网口扩展坞在一台笔记本上无法识别,但在其他电脑上正常工作时,问题通常出在笔记本自身或其与扩展坞的兼容性上。以下是系统化的定位思路和排查步骤,帮助你快速找到故障原因: 背景: 一个M-pard(铭豹)扩展坞的网卡突然无法识别了,扩展出来的三个USB接口正常。…

未来机器人的大脑:如何用神经网络模拟器实现更智能的决策?

编辑&#xff1a;陈萍萍的公主一点人工一点智能 未来机器人的大脑&#xff1a;如何用神经网络模拟器实现更智能的决策&#xff1f;RWM通过双自回归机制有效解决了复合误差、部分可观测性和随机动力学等关键挑战&#xff0c;在不依赖领域特定归纳偏见的条件下实现了卓越的预测准…

Linux应用开发之网络套接字编程(实例篇)

服务端与客户端单连接 服务端代码 #include <sys/socket.h> #include <sys/types.h> #include <netinet/in.h> #include <stdio.h> #include <stdlib.h> #include <string.h> #include <arpa/inet.h> #include <pthread.h> …

华为云AI开发平台ModelArts

华为云ModelArts&#xff1a;重塑AI开发流程的“智能引擎”与“创新加速器”&#xff01; 在人工智能浪潮席卷全球的2025年&#xff0c;企业拥抱AI的意愿空前高涨&#xff0c;但技术门槛高、流程复杂、资源投入巨大的现实&#xff0c;却让许多创新构想止步于实验室。数据科学家…

深度学习在微纳光子学中的应用

深度学习在微纳光子学中的主要应用方向 深度学习与微纳光子学的结合主要集中在以下几个方向&#xff1a; 逆向设计 通过神经网络快速预测微纳结构的光学响应&#xff0c;替代传统耗时的数值模拟方法。例如设计超表面、光子晶体等结构。 特征提取与优化 从复杂的光学数据中自…