JavaScript 数组基本操作全解

目录
  • 一、初识数组
  • 二、创建数组
    • 使用Array对象创建数组
    • 使用“[]”创建数组
  • 三、数组的基本操作
    • 获取数组长度
    • 访问数组元素
    • 元素的添加与修改
      • 添加元素
      • 修改元素
    • 元素的删除
    • 解构赋值

好久不见,甚是想念! 大家好!我是洋哥 芜湖,起飞

一、初识数组

数组构成:数组由一个或多个数组元素组成的,各元素之间使用逗号“,”分割。

数组元素:每个数组元素由“下标”和“值”构成。

下标:又称索引,以数字表示,默认从0开始依次递增,用于识别元素。

值:元素的内容,可以是任意类型的数据,如数值型、字符型、数组、对象等。

数组还可以根据维数划分为一维数组、二维数组、三维数组等多维数组。

一维数组:就是指数组的“值”是非数组类型的数据,如上图。

二维数组:是指数组元素的“值”是一个一维数组,如下图。

数组还可以根据维数划分为一维数组、二维数组、三维数组等多维数组。

多维数组:当一个数组的值又是一个数组时,就可以形成多维数组。它通常用于描述一些信息。

举例:保存一个班级学生信息,每个数组元素都代表一个学生,而每个学生都使用一个一维数组分别表示其姓名、学号、年龄等信息,这样通过一个变量即可有规律的保存一个班级的所有学生信息,方便开发时进行处理。

二、创建数组

数组在JavaScript中的创建方式:

  • 实例化Array对象的方式。
  • 直接使用“[]”的方式。

使用Array对象创建数组

实例化Array对象的方式创建数组,是通过new关键字实现的。

使用“[]”创建数组

直接法“[]”与Array()对象的使用方式类似,只需将new Array()替换为[]即可。

  • 在创建数组时,最后一个元素后的逗号可以存在,也可以省略。
  • 直接法“[]”与Array()对象在创建数组时的区别在于,前者可以创建含有空存储位置的数组,而后者不可以。

三、数组的基本操作

获取数组长度

Array对象提供的length属性可以获取数组的长度,其值为数组元素最大下标加1。

数组arr2中没有值的数组元素会占用空的存储位置。

因此,数组的下标依然会递增。从而arr2调用length属性最后的输出结果即为6。

数组的length属性不仅可以用于获取数组长度,还可以修改数组长度。

在利用length属性指定数组长度时,有以下是三种情况:

若length的值大于数组中原来的元素个数,则没有值的数组元素会占用空存储位置。

若length的值等于数组中原来的元素个数,数组长度不变。

若length的值小于数组中原来的元素个数,多余的数组元素将会被舍弃。

除此之外,在利用Array对象方式创建数组时,也可以指定数组的长度。

注意

JavaScript中不论何种方式指定数组长度后,并不影响继续为数组添加元素,同时数组的length属性值会发生相应的改变。

访问数组元素

数组元素访问方式:“数组名[下标]”。

概念:所谓遍历数组就是依次访问数组中所有元素的操作。

  • 利用下标遍历数组可以使用:for(已学)。
  • 利用下标遍历数组可以使用:for…in语句。

  • for…in中的variable指的是数组下标。
  • for…in中的object表示数组的变量名称。
  • 除此之外,若object是一个对象,for…in还可以用于对象的遍历。

注意

在ES6中,新增了一种for…of语法,可以更方便地对数组进行遍历。

  • 变量value:表示每次遍历时对应的数组元素的值。
  • 变量arr:表示待遍历的数组。
  • 结果:在控制台中依次输出1、2和3。

元素的添加与修改

元素的添加与修改元素的方式:“数组名[下标]”。

提示:与访问数组中的元素的方式相同。

添加元素

  • 添加数组元素:数组名[下标] = 值。
  • 允许下标不按照数字顺序连续添加,未设置具体值的元素,会以空存储位置的形式存在。
  • 数组中元素保存顺序与下标有关,与添加元素的顺序无关。

修改元素

修改元素与添加元素的使用相同,区别在于修改元素是为已含有值的元素重新赋值。

元素的删除

在创建数组后,有时也需要根据实际情况,删除数组中的某个元素值。

例如,一个保存全班学生信息的多维数组,若这个班级中有一个学生转学了,那么在这个保存学生信息的数组中就需要删除此学生。

此时,可以利用delete关键字删除该数组元素的值。

delete关键字只能删除数组中指定下标的元素值,删除后该元素依然会占用一个空的存储位置。

解构赋值

除了前面学习过的变量声明与赋值方式,ES6中还提供了另外一种方式——解构赋值。例如,若把数组[1,2,3]中的元素分别赋值为a、b和c,传统的做法是单独为变量声明和赋值。

  • 当左侧变量的数量小于右侧的元素的个数,则忽略多余的元素。
  • 当左侧变量数量大于右侧的元素个数时,则多余的变量会被初始化为undefined。

  • 解构赋值时右侧的内容还可以是一个变量。
  • 通过解构赋值完成两个变量数值的交换。

由于作者水平有限,如有错误和不准确之处在所难免,本人也很想知道这些错误,恳望读者批评指正!

if (学会了){ 点个赞,给个好评,我祝福你心想事成; }else{ 收藏一下以后慢慢学,我相信你能学会; }

到此这篇关于JavaScript 数组基本操作全解的文章就介绍到这了,更多相关JavaScript 数组内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Javascript数组常用方法你都知道吗

    我用这些方法主要从五个方面去学习. 1.方法是干什么的. 2.谁能用 (当然是数组啦). 3.有没有返回值,返回值是什么. 4.修不修改原来的对象. 5.如何使用. 接下来就是干货了. 1.push 向数组内添加一个或多个元素,添加到数组的最后面,方法返回值是新数组的长度. arr.push(200) arr.push(200,2,32) 2.pop 删除数组末尾的一个元素,不需要传参,方法返回值是被删除的元素 . arr.pop() 3.unshift 向数组中添加一个或多个元素,添加到最前面

  • javascript数组里的27个方法总合详解

    目录 1.concat() 2.copyWithin() 3.Object.entries() 4.every() 5.fill() 6.filter() 7.find()和findIndex() 8.forEach() 9.from() 10.includes() 11.indexOf()和lastIndexOf() 12.isArray() 13.join() 14.keys() 15.map() 16.pop() 17.push() 18.reduce()和reduceRight() 19

  • JS数组在内存中的效率问题浅析

    目录 JS数组 效率比较 举个栗子 非连续内存问题 总结 JS数组 我们所熟知的JS数组的结构和其他语言数组结构类似,即物理内存是连续的,所以这也就导致了数组成员移动次数越少,其效率越高,一般数组会被分配到一段连续的内存中,像这样 大家可能会疑问,你为啥要给画一个边框呢,其实我们的数组在定义的时候默认了它的长度,即当我们像要在数组中添加元素的时候,就需要对它的长度做出改变. 效率比较 JS提供了几个api来让我们便捷地向数组中添加元素,比如说push,unshift push()是添加一个元素在

  • JavaScript 数组常见操作技巧

    目录 一.创建数组 二.判断是不是数组 三.类数组和数组的转换 四.数组去重 1.利用 set 去重 2.双重循环 + splice 3.新建数组 + includes 4.reduce + includes 5.新建数组 + sort 6.新建数组 + 利用对象属性 7.利用 map 8.filter + indexOf 本文主要包括: 创建数组 判断是不是数组 类数组和数组的转换 数组去重 各位看官可根据自身需求选择食用. 一.创建数组 创建数组是基本功,其方法主要包括以下几种: const

  • js数组的基本操作(很全自己整理的)

    用 js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多,自以为js高手的自己居然无从下手,一下狠心,我学!呵呵.学了之后才知道,js数组的功能强大很,远比VB,C#强多了,大家慢慢看吧 1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度 var arr

  • 一起来了解javascript数组的方法

    目录 1.push 2.pop 3.unshift() 4.shift() 5.concat() 6.reverse() 7.sort( ) 8.join() 9.slice() 10.splice() 总结 1.push 在数组末尾添加一个或者多个元素 var arr = [1,2,3,4]; arr.push(5); console.log(arr);// [1, 2, 3, 4, 5] arr.push(6,7); console.log(arr);//[1, 2, 3, 4, 5, 6,

  • JavaScript 数组常见操作技巧 (二)

    目录 一.出数组中的重复元素或非重复元素 二.数组扁平化 / 数组降维 二维数组:双重循环 二维数组:循环 + concat 二维数组:reduce + concat 二维数组:展开 / apply + concat 多维数组:toString + split 多维数组:forEach + 递归 多维数组:reduce + 递归 多维数组:while + some 不确定维数的数组: flat 前言: 数组是 JavaScript 中常见数据类型之一,关于它的一些操作方法,我在这里做一下简单记录

  • JavaScript判断数组的方法总结与推荐

    目录 前言 根据构造函数判断(妈妈) instanceof constructor 根据原型对象判断(爸爸) __ proto __ Object.getPrototypeOf() Array.prototype.isPrototypeOf() 根据 Object 的原型对象判断(祖先) Object.prototype.toString.call() Array.isArray() 总结 前言 无论在工作还是面试中,我们都会遇到判断一个数据是否为数组的需求,今天我们就来总结一下,到底有多少方法

  • JavaScript学习笔记之数组基本操作示例

    本文实例讲述了JavaScript学习笔记之数组基本操作.分享给大家供大家参考,具体如下: 一.数组定义 1.定义 vara=[1,2,3] vara=newArray(1,2,3); 2.长度 返回长度 <script> vara=[1,2,3,4,5,6]; alert(a.length); </script> 设置长度 <script> vara=[1,2,3,4,5,6]; a.length=2; alert(a); </script> 二.数组连接

  • JavaScript 数组基本操作全解

    目录 一.初识数组 二.创建数组 使用Array对象创建数组 使用“[]”创建数组 三.数组的基本操作 获取数组长度 访问数组元素 元素的添加与修改 添加元素 修改元素 元素的删除 解构赋值 好久不见,甚是想念! 大家好!我是洋哥 芜湖,起飞 一.初识数组 数组构成:数组由一个或多个数组元素组成的,各元素之间使用逗号“,”分割. 数组元素:每个数组元素由“下标”和“值”构成. 下标:又称索引,以数字表示,默认从0开始依次递增,用于识别元素. 值:元素的内容,可以是任意类型的数据,如数值型.字符型

  • javascript 数组操作详解

    1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度 var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]); 创建一个数组并赋值 要说明的是,虽然第二种方法创建数组指定了长度,但实际上所有情况下数组都是变长的,也就是说即使指定了长度为5,仍然可以将元素存储在规定长

  • JavaScript数组操作详解

    1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度 var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]); //创建一个数组并赋值 要说明的是,虽然第二种方法创建数组指定了长度,但实际上所有情况下数组都是变长的,也就是说即使指定了长度为5,仍然可以将元素存储在规

  • JavaScript数组复制详解

    前面的话   前面的博文中介绍了对象拷贝,本文将详细介绍数组复制 push function copyArray(arr){ var result = []; for(var i = 0; i < arr.length; i++){ result.push(arr[i]); } return result; } var obj1=[1,2,3]; var obj2=copyArray(obj1); console.log(obj1); //[1,2,3] console.log(obj2); /

  • JavaScript 数组去重详解

    目录 1.数组去重 2.数组去重里面的对象去重 3.根据数组某个字段相同,修改另外字段值 总结 1.数组去重 /********************************************** ╚description: ╚作者: 麒麟社 ╚时间: 2021-09-13 22:26:21 ╚名称: V1.0.5 ***********************************************/ var obj = ['麒麟','社','CC','DD','麒麟','社'

  • JavaScript数组方法实例详解

    目录 简介 创建数组 创建方法 详解 方法大全 join() push()和 pop() shift() 和 unshift() sort() reverse() concat() slice() splice() indexOf()和 lastIndexOf() forEach() map() filter() fill()  (ES6 新增) every() some() includes() (ES7) reduce()和 reduceRight() toLocaleString() 和

  • Python NumPy教程之数组的基本操作详解

    目录 Numpy中的N维数组(ndarray) 数组创建 数组索引 基本操作 数据类型 Numpy中的N维数组(ndarray) Numpy 中的数组是一个元素表(通常是数字),所有元素类型相同,由正整数元组索引.在 Numpy 中,数组的维数称为数组的秩.给出数组沿每个维的大小的整数元组称为数组的形状.Numpy 中的数组类称为ndarray.Numpy 数组中的元素可以使用方括号访问,并且可以使用嵌套的 Python 列表进行初始化. 例子 : [[ 1, 2, 3], [ 4, 2, 5]

  • javascript中Array()数组函数详解

    在程序语言中数组的重要性不言而喻,JavaScript中数组也是最常使用的对象之一,数组是值的有序集合,由于弱类型的原因,JavaScript中数组十分灵活.强大,不像是Java等强类型高级语言数组只能存放同一类型或其子类型元素,JavaScript在同一个数组中可以存放多种类型的元素,而且是长度也是可以动态调整的,可以随着数据增加或减少自动对数组长度做更改. Array()是一个用来构建数组的内建构造器函数.数组主要由如下三种创建方式: array = new Array() array =

  • JavaScript数组类型Array相关的属性与方法详解

    Array数组类型详解 在ECMAScript中除了object类型之外,Array数组用的是最常用的类型.ECMAScript数组可以在每一项存储任何类型的值,无需指定数组的长度,还可以随着数据的增长来增加数组长度,这些是和其他语言的数组不同的. 1.数组的创建方法 数组字面量方式 var arr = [1,2,3,4,5];// 简单直接用中括号包裹构建数组 数组构造函数 var arr = new Array(1,2,3,4,5);// 通过内置Array对象构建数组 2.检测数组 ins

随机推荐