JS-06-数组

news2024/11/17 7:54:17

一、数组的创建与访问

见:JS-04-javaScript数据类型和变量

JavaScript的Array可以包含任意数据类型,并通过索引来访问每个元素。

要取得Array的长度,直接访问length属性:

let arr = [1, 2, 3.14, 'Hello', null, true];
console.log(arr.length); // 6

Array可以通过索引把对应的元素修改为新的值,因此,对Array的索引进行赋值会直接修改这个Array!!!

let arr = ['A', 'B', 'C'];
arr[1] = 99;
console.log(arr); // arr现在变为['A', 99, 'C']
console.log(arr[1]); // 99

二、改变数组的长度

1、直接给Array的length赋一个新的值会导致Array大小的变化:

let arr = ['A', 'B', 'C'];
console.log(arr.length); // 3

// 调整数组大小:
arr.length = 6;
console.log(arr); // arr变为['A', 'B', 'C', undefined, undefined, undefined]

// 调整数组大小:
arr.length = 2;
console.log(arr); // arr变为['A', 'B']

不建议直接修改数组的大小! 

2、如果通过索引赋值时,索引超过了范围,同样会引起Array大小的变化

let arr = ['A', 'B', 'C'];

// 索引超出范围会导致数组大小自动调整:
arr[5] = 'x';
console.log(arr); // arr变为['A', 'B', 'C', undefined, undefined, 'x']

不建议,访问索引时要确保索引不会越界。 

大多数其他编程语言不允许直接改变数组的大小,越界访问索引会报错。然而,JavaScript的Array却不会有任何错误。

三、数组的相关操作

3-1、indexOf搜索一个指定的元素的位置

var arr = [10, 20, '30', 'xyz'];
arr.indexOf(10); // 元素10的索引为0
arr.indexOf(20); // 元素20的索引为1
arr.indexOf(30); // 元素30没有找到,返回-1
arr.indexOf('30'); // 元素'30'的索引为2

3-2、slice截取Array的部分元素,然后返回一个新的Array

slice()就是对应String的substring()版本

var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];

arr.slice(0, 3); // 从索引0开始,到索引3结束,但不包括索引3: ['A', 'B', 'C']
arr.slice(3); // 从索引3开始到结束: ['D', 'E', 'F', 'G']

注意到slice()的起止参数包括开始索引,不包括结束索引

如果不给slice()传递任何参数,它就会从头到尾截取所有元素。利用这一点,我们可以很容易地复制一个Array:

var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];

var aCopy = arr.slice();
aCopy; // ['A', 'B', 'C', 'D', 'E', 'F', 'G']

aCopy === arr; // false

3-3、push和pop

push()向Array的末尾添加若干元素,pop()则把Array的最后一个元素删除掉:

var arr = [1, 2];
arr.push('A', 'B'); // 返回Array新的长度: 4
arr; // [1, 2, 'A', 'B']

arr.pop(); // pop()返回'B'
arr; // [1, 2, 'A']

arr.pop(); arr.pop(); arr.pop(); // 连续pop 3次
arr; // []

arr.pop(); // 空数组继续pop不会报错,而是返回undefined
arr; // []

3-4、unshift和shift

如果要往Array的头部添加若干元素,使用unshift()方法,shift()方法则把Array的第一个元素删掉:

var arr = [1, 2];
arr.unshift('A', 'B'); // 返回Array新的长度: 4
arr; // ['A', 'B', 1, 2]

arr.shift(); // 'A'
arr; // ['B', 1, 2]

arr.shift(); arr.shift(); arr.shift(); // 连续shift 3次
arr; // []

arr.shift(); // 空数组继续shift不会报错,而是返回undefined
arr; // []

3-5、数组的排序

1、sort()方法

sort()可以对当前Array进行排序,它会直接修改当前Array的元素位置,直接调用时,按照默认顺序排序:

var arr = ['B', 'C', 'A'];
arr.sort();
arr; // ['A', 'B', 'C']

2、reverse()方法

reverse()把整个Array的元素给调个个,也就是反转

var arr = ['one', 'two', 'three'];
arr.reverse(); 
arr; // ['three', 'two', 'one']

3、splice()方法

将数组按照我们自己指定的顺序排序。

splice()方法是修改Array的“万能方法”,它可以从指定的索引开始删除若干元素,然后再从该位置添加若干元素:

        var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
        // 只删除,不添加:
        arr.splice(2, 2);
        console.log(arr); // ['Microsoft', 'Apple', 'Excite', 'Oracle']

        // 只添加,不删除:
        arr.splice(2, 0, 'Google', 'Facebook'); // 返回[],因为没有删除任何元素
        console.log(arr); // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Excite', 'Oracle']

        // 从索引2开始删除3个元素,然后再添加两个元素:
        arr.splice(2, 3, 'Google', 'Facebook'); // 返回删除的元素 ['Microsoft', 'Apple', 'Oracle']
        console.log(arr); // ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']

3-6、concat连接两个Array

var arr = ['A', 'B', 'C'];
var added = arr.concat([1, 2, 3]);
added; // ['A', 'B', 'C', 1, 2, 3]
arr; // ['A', 'B', 'C']

【注意】:

concat()方法并没有修改当前Array,而是返回了一个新的Array

实际上,concat()方法可以接收任意个元素和Array,并且自动把Array拆开,然后全部添加到新的Array里:

var arr = ['A', 'B', 'C'];
arr.concat(1, 2, [3, 4]); // ['A', 'B', 'C', 1, 2, 3, 4]

只能拆开一维数组:

3-7、join用指定元素连接数组并返回字符串 

join()方法把当前Array的每个元素都用指定的字符串连接起来,然后返回连接后的字符串:

var arr = ['A', 'B', 'C', 1, 2, 3];
arr.join('-'); // 'A-B-C-1-2-3'

如果Array的元素不是字符串,将自动转换为字符串后再连接。

四、多维数组

数组的某个元素又是一个Array,则可以形成多维数组,例如:

var arr = [[1, 2, 3], [400, 500, 600], '-'];

// 通过索引取到500这个值
var x = arr[1][1];

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

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

相关文章

单头注意力机制(ScaledDotProductAttention) python实现

输入是query和 key-value,注意力机制首先计算query与每个key的关联性(compatibility),每个关联性作为每个value的权重(weight),各个权重与value的乘积相加得到输出。 import torch import tor…

AS-V1000 视频监控平台产品介绍:web客户端功能介绍(上)

目 录 一、引言 1.1 AS-V1000视频监控平台介绍 1.2 平台服务器配置说明 二、软件概述 2.1 软件用途 2.2 登陆界面 2.3 主界面 2.4 视频浏览 三、web端主要功能介绍 3.1 多画面风格 3.1.1风格切换 3.1.2 切换效果 3.2截屏 3.2.1 单画面截屏 3.2.2 …

【当前全网最详细】WebUI中使用Instant_ID来控制生成对象面部的用法

🎈为什么有这篇文章 中文网络上或者B站很多UP,在讲述WebUI中使用这个controlnet来换脸的时候,要么讲的过于复杂,要么就是没有讲清楚,所以这里整理下详细的使用方法,并记录下生成的内容。 如果懒得看文字可…

微信小程序-day01

文章目录 前言微信小程序介绍 一、为什么要学习微信小程序?二、微信小程序的历史创建开发环境1.注册账号2.获取APPID 三、下载微信开发者工具1.创建微信小程序项目2.填写相关信息3.项目创建成功 四、小程序目录结构项目的主体组成结构 总结 前言 微信小程序介绍 微信小程序&…

visa卡支持美区苹果Apple id绑定

苹果手机我相信大家都很熟悉,所以很多小伙伴都需要绑定卡来进行一系列的体验,这里我使用的是559666 在绑定之前我们需要先开一张visa卡,点击获取 开卡步骤如下,按图片步骤即可开卡 卡片信息在卡中心cvc安全码里面

STM32F407_外部中断

这里写目录标题 前言1、EXTI概述2、外部中断配置流程完整代码 前言 注释很详细,放心食用。 1、EXTI概述 STM32F4的每个IO都可以作为外部中断的中断输入口,这点也是STM32F4的强大之处。STM32F407的中断控制器支持22个外部中断/事件请求。每个中断线上都设…

hex文件格式解析

本文框架 1. hex文件格式1.1 数据长度1.2 地址域1.3 数据类型1.4 数据域1.5 CRC校验域 本文对hex文件格式进行解析,介绍各部分组成及其含义,在此mark下,方便后续开发脚本对hex文件进行操作。 1. hex文件格式 Intel HEX文件是由一行行符合Int…

Explain详解与索引优化最佳实践

Explain工具介绍 使用EXPLAIN关键字可以模拟优化器执行SQL语句,分析你的查询语句或是结构的性能瓶颈 在select语句之前增加explain关键字,MySQL会在查询前设置一个标记,执行查询会返回执行计划的信息,而不是执行这条SQL 注意: 如果from中包含子查询,仍会执行该子查询,将结果…

Gemma: Open Models Based on Gemini Research and Technology

Gemma: Open Models Based on Gemini Research and Technology 相关链接:arxiv 关键字:Gemma、Google DeepMind、open models、language understanding、reasoning 摘要 这项工作介绍了Gemma,一系列轻量级、最先进的开放模型,基于…

笔记本的显示器都是核显输出,还要独显干啥呢?

前言 今天小白还在睡梦中,就接到一个朋友发来的消息:笔记本的显示器都是直接在核显上的,没有改独显的选项。 如果是这样,那笔记本还有独立显卡什么事情?笔记本加了独显难道就只是为了圈钱? 其实并不是这样…

06双体系Java学习之算术运算符,赋值运算符,关系运算符

// 二元运算符//CtrlD : 复制当前行到下一行int a 10;int b 20;int c 25;int d 25;System.out.println(ab);System.out.println(a-b);System.out.println(a*b);System.out.println(a/(double)b);赋值运算符 关系运算符 package operator;public class Demo03 {public stati…

ModuleNotFoundError: No module named ‘sklearn.cross_validation‘

一、问题分析 ModuleNotFoundError: No module named sklearn.cross_validation 英文先翻译一遍,模块未找到问题,这里涉及到sklearn这个模块,Sklearn (全称 SciKit-Learn),是基于 Python 语言的机器学习工…

力扣每日一题 合并后数组中的最大元素 贪心

Problem: 2789. 合并后数组中的最大元素 思路 贪心:从右向左合并,尽可能的多合并,直到不能合并,更新答案,找前一阶段的最大合并值 复杂度 时间复杂度: O ( n ) O(n) O(n) 空间复杂度: O ( 1 ) O(1) O(1) Code …

1456.定长子串中元音的最大数目

题目:给你字符串 s 和整数 k 。 请返回字符串 s 中长度为 k 的单个子字符串中可能包含的最大元音字母数。 英文中的 元音字母 为(a, e, i, o, u)。 解题思路: 1.右侧新进入窗口的字母为元音字母,左侧移出窗口的字母…

C语言【典型算法编程题】总结

以下最全总结! 一,分支结构 1,if 编写程序,从键盘上输入三角形的三个边长(实数),判断这三个边能否构成三角形(构成三角形的条件为:任意两边之和大于第三边),如果能构成三角形,则计算三角形的面积并输出(保留2位小数);如果不能构成三角形,则输出“Flase”字符…

AJAX 03 XMLHttpRequest、Promise、封装简易版 axios

AJAX 学习 AJAX 3 原理01 XMLHttpRequest① XHR 定义② XHR & axios 关系③ 使用 XHR④ XHR查询参数案例:地区查询(URLSearchParams)⑤ XHR数据提交 POST 02 PromisePromise 使用Promise - 三种状态案例:使用Promise XHR 获取…

解析找不到msvcr120.dll无法继续执行此代码的多种修复方法

在计算机使用过程中,我们经常会遇到一些错误提示,其中之一就是“msvcr120.dll丢失”。这个错误通常会导致某些程序无法正常运行。为了解决这个问题,本文将介绍5种修复msvcr120.dll丢失的方法。 一,msvcr120.dll丢失会出现哪些问题…

sql注入重学

sql基本操作 基本查询语句 union (必须得是前面的列与后面的列相同才可以查询) 看第二局uses表中的列有3列,而emails中的列只有两列,所有无法成功查询 这就相当于我们再加了一列 group by (分组) 相当于将其分为10列…

Python 闭包和nonlocal声明

闭包是针对嵌套函数环境的概念,它的作用是延伸函数的作用域。简单来说,闭包就是一个函数,但它可以保存着上层函数作用域中的变量,使得这些变量可以在函数中使用。而nonlocal声明的作用就是允许函数重新绑定局部作用域以外且非全局…

3、鸿蒙学习-在AGC创建HarmonyOS 项目或应用

项目和应用介绍 关于项目 项目是资源、应用的组织实体。资源包括服务器、数据库、存储,以及您的应用、终端用户的数据等。在您使用部分服务时,您是数据的控制者,数据将按照您设置的数据处理位置来存储在指定区域。 通常,您不需…