广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >一篇文章带你详细了解JavaScript数组
  • 535
分享到

一篇文章带你详细了解JavaScript数组

2024-04-02 19:04:59 535人浏览 泡泡鱼
摘要

目录一、数组的作用:二、数组的定义:1.通过构造函数创建数组2.通过字面量的方式创建数组三、数组元素四、数组长度五、数组索引(下标)六、数组注意的问题1.数组中存储的数据可以是不一样

数组:是一组有序的数据

一、数组的作用:

可以一次性存储多个数据

二、数组的定义:

1.通过构造函数创建数组

语法:

var 数组名=new Array();
var array=new Array();//定义了一个数组


//通过构造函数的方式定义一个数组
var array=new Array();//没有数据的空数组

数组中的数据如果直接输出,那么就可以直接把数组中的数据显示出来;如果没有数据就看不到数据。


var 数组名=new Array(长度);

如果数组中没有数据,但是有长度,数组中的每个值就是undefined。

用构造函数的方式创建数组的时候,如果是Array(一个数字)→指数组的长度(即数组元素的个数);如果是Array(多个值)→指这个数组中就有数据了,数组的长度就是这些数据的个数。

2.通过字面量的方式创建数组

语法:

var 数组名=[ ];//空数组


var arr=[];
console.log(arr);//Array[0]

总结:

无论是构造函数的方式,还是字面量的方式定义的数组,如果有长度,那么默认是undefined

三、数组元素

数组中存储的每个数据,都可以叫数组的元素

比如:数组中存储了3个数组,那么这个数组就有3个元素

四、数组长度

数组长度就是元素的个数

比如:有3个元素,就说这个数组的长度是3


var arr1=new Array();//用构造函数的方式创建了一个空数组
var arrr2=new Array(5);//用构造函数的方式创建了一个长度为5的数组,这个数组有5个值,且都为undefined
var arr3=new Array(10,20,30,40,50);//构造函数的方式创建了一个长度为5,每个值都有意义的数组

五、数组索引(下标)

数组的索引,或者数组的下标。是用来存储或访问我数组中的数据,从0开始到长度-1结束

如何设置数组中某个位置的值:

数组名[下标]=值;

例如:arr[3]=100;

如何获取数组中某个位置的值:

var result=数组名[下标];

console.log(result);


//获取数组中第4个值
var arr =new Array(10,20,30,40,100);
console.log(arr[4]);//100
//将下标为3的值改为1000
arr[3]=1000;
//用字面量的方式获取数组的长度
var arr1=[10,20,30,40,50,12];
console.log(arr.length);//6

数组长度和索引的关系:

长度-1=索引

六、数组注意的问题

1.数组中存储的数据可以是不一样的


arr=[10,"哈哈",true,null,undefined,new Object()];

2.数组的长度是可以改变的


var arr = [];
    // 通过索引来设置数组中的元素的值
    arr[0] = 10;
    arr[1] = 20;
    console.log(arr.length); //2
    // 通过索引的方式获取元素的值
    console.log(arr[2]); //undefined

3.总之


var arr1 = new Array(); //空数组
var arr2 = new Array(5); //长度为5的数组,每个数组的值是undefined
var arr3 = new Array(1, 2, 3, 4, 5); //长度为5的数组,每个值都有意义
var arr4 = []; //空数组
var arr5 = [1, 2, 3]; //长度为3的数组
var arr6 = ["red", "blue", 1, true]; //长度为4,元素数据类型不一样的数组
var arr7 = [];
// 声明一个空数组,给数组中添加值
arr7[0] = 10;
arr7[1] = 30;

七、遍历数组

1.正序遍历


var arr=[10,20,30,40,50,60,70,80,90,100];
// i表示数组的下标
// 最后一个数的下标等于数组的长度减一
for(var i=0;i<arr.length;i++){
    console.log(arr[i]);
}

2.倒序遍历


var arr = [10, 20, 30, 40, 100];
// i最开始输出最后一个数,到0的时候结束循环
for (var i = arr.length - 1; i >= 0; i--) {
    console.log(arr[i]);
}

八、数组中常见的案例

1.求数组中所有元素的和


var arr = [10, 20, 30, 40, 100];
// 用来存储相加后的总和
 var sum = 0;
 for (var i = 0; i < arr.length; i++) {
     sum += arr[i];
 }
 console.log(sum);//200

2.求数组的平均数


var arr = [10, 20, 30, 40, 100];
// 用来存储相加后的总和
var sum = 0;
for (var i = 0; i < arr.length; i++) {
    sum += arr[i];
}
console.log(sum / arr.length); //40

3.求数组的最大值和最小值


var arr = [10, 20, 30, 40, 100];
// 假设数组中第一个数是最大的,并将它赋值给一个变量
var max = arr[0];
// 假设数组中第一个数是最小的,并将它赋值给一个变量
var min = arr[0];
for (var i = 0; i < arr.length; i++) {
    //用数组中的值和max进行比较,如果比max大,则将那个数赋值给max
    if (max < arr[i]) {
        max = arr[i];
    }
    //用数组中的值和min进行比较,如果比min小,则将那个数赋值给min
    if (min > arr[i]) {
        min = arr[i];
    }
}
console.log(max); //100
console.log(min); //10

4.冒泡排序


var arr = [10, 30, 20, 65, 40, 8, 100];
//由小到大排序
for (var i = 0; i < arr.length; i++) {
    for (var j = 0; j < arr.length - i; j++) {
        if (arr[j] > arr[j + 1]) {
            var temp = arr[j];
            arr[j] = arr[j + 1];
            arr[j + 1] = temp;
        }
    }
}
console.log(arr);
//由大到小排序
for (var i = 0; i < arr.length; i++) {
    for (var j = 0; j < arr.length - i; j++) {
        if (arr[j] < arr[j + 1]) {
            var temp = arr[j];
            arr[j] = arr[j + 1];
            arr[j + 1] = temp;
        }
    }
}
console.log(arr);

冒泡排序

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注编程网的更多内容!

--结束END--

本文标题: 一篇文章带你详细了解JavaScript数组

本文链接: https://www.lsjlt.com/news/136911.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 一篇文章带你详细了解JavaScript数组
    目录一、数组的作用:二、数组的定义:1.通过构造函数创建数组2.通过字面量的方式创建数组三、数组元素四、数组长度五、数组索引(下标)六、数组注意的问题1.数组中存储的数据可以是不一样...
    99+
    2022-11-12
  • 一篇文章带你了解JavaScript-对象
    目录创建对象对象直接量通过new创建对象原型Object.create()属性的查询和设置继承属性访问错误删除属性检测属性序列化对象总结创建对象 对象直接量 对象直接量是由若干名/值...
    99+
    2022-11-12
  • 一篇文章带你了解JavaScript-语句
    目录表达式语句复合语句和空语句复合语句空语句声明语句varfunction条件语句ifif/elseelse ifswitch循环whiledo/whileforfor/in跳转标签...
    99+
    2022-11-12
  • 一篇文章带你详细了解python中一些好用的库
    目录时间库—arrow使用背景安装arrowarrow使用游标卡尺shift获取arrow对象arrow的类型转换和时区修改总结时间库—arrow 使用背景 日期时间处理在实际应用场...
    99+
    2022-11-12
  • 一篇文章带你了解python元组基础
    目录1. 元组基本知识1.元组的基本格式和用法2. 元组操作实例1.建立元组2.查找元素:通过元组下标实现。3.删除元组:对元组的删除时不允许的,可以通过del函数,实现对整个元组对...
    99+
    2022-11-12
  • 一篇文章带你了解JavaScript的解构赋值
    目录1. 什么是解构赋值 ?2. 数组的解构赋值2.1) 数组解构赋值的默认值2.2) 数组解构赋值的应用类数组中的应用交换变量的值3. 对象的解构赋值...
    99+
    2022-11-13
  • 一篇文章带你了解JavaScript的包装类型
    目录1、简介2、String1、创建语法2、常用方法3、更多方法3、Number1、语法2、属性3、常用方法4、Boolean总结1、简介 【解释】: 在 JavaScri...
    99+
    2022-11-13
  • 一篇文章带你了解初始Spring
    目录为什么要使用SpringSpring概述Spring容器使用流程1.启动容器2.完成bean的初始化3.注册bean到容器中4.装配bean的属性bean的注册bean属性注入总...
    99+
    2022-11-12
  • 一篇文章带你了解Java SpringBoot Nacos
    目录1、什么是Nacos 1.1与eureka对比1.2与zookeeper对比1.3与springcloud config 对比 2、Spring Cloud Alibaba 套件...
    99+
    2022-11-12
  • 一篇文章带你了解Java Stream流
    目录一、Stream流引入现有一个需求:1.用常规方法解决需求2.用Stream流操作集合,获取流,过滤操作,打印输出二、Stream流的格式三、获取流四、Stream流的常用方法方...
    99+
    2022-11-12
  • 一篇文章带你了解XGBoost算法
    目录1. 什么是XGBoost1.1 XGBoost树的定义1.2 正则项:树的复杂度1.3 树该怎么长1.4 如何停止树的循环生成2. XGBoost与GBDT有什么不同3. 为什...
    99+
    2022-11-12
  • 一篇文章带你了解jQuery动画
    目录1.控制元素的显示与隐藏 show() hide()2.控制元素的透明度 fadeIn() fadeOut()3:控制元素的高度 slideUp() slideDown()总结 ...
    99+
    2022-11-12
  • 一篇文章带你了解vue路由
    目录概念Vue Router简介Vue Router的特性Vue Router的使用步骤分类嵌套路由动态路由命名路由编程式导航总结概念 路由的本质就是一种对应关系,比如说我们在url...
    99+
    2022-11-13
  • 一篇文章带你了解C++智能指针详解
    目录为什么要有智能指针?智能指针的使用及原理RALLshared_ptr的使用注意事项创建多个 shared_ptr 不能拥有同一个对象shared_ptr 的销毁shared_pt...
    99+
    2022-11-12
  • 一篇文章带你了解C++模板编程详解
    目录模板初阶泛型编程函数模板函数模板概念函数模板格式函数模板的原理函数模板的实例化模板参数的匹配原则类模板类模板的定义格式类模板的实例化总结模板初阶 泛型编程 在计算机程序设计领域...
    99+
    2022-11-12
  • 一篇文章带你了解SpringMVC数据绑定
    目录1.配置web.xml2.在resources目录下配springmvc_servlet.xml3.在WEB-INF目录下新建jsp文件夹4.在java目录下新建com.sxau...
    99+
    2022-11-12
  • 一篇文章带你了解Python递归函数
    递归是一种常见的编程技巧,在Python中也可以通过递归函数来实现。递归函数是指在函数的定义中调用函数本身的情况。通过递归函数,我们...
    99+
    2023-09-22
    Python
  • 一篇文章带你详解Spring的AOP
    目录1、AOP 什么?2、需求3、解决办法1:使用静态代理第一步:创建 UserService 接口第二步:创建 UserService的实现类第三步:创建事务类 MyTransac...
    99+
    2022-11-13
  • 一篇文章带你了解SpringBoot Web开发
    目录SpringBoot Web开发静态资源定制首页thymeleaf模板引擎1、导入依赖2、controller书写源码分析Thymeleaf语法基本语法:MVC配置原理总结Spr...
    99+
    2022-11-12
  • 一篇文章带你了解清楚Mysql 锁
    一丶为什么数据库需要锁 数据库锁设计的初衷是处理并发问题。作为多用户共享 的资源,当出现并发访问的时候,数据库需要合理地控制资源的访问规则。而锁就是用来实 现这些访问规则的重要数据结构。 根据加锁的范围,mysql 里面...
    99+
    2022-11-29
    mysql锁机制 mysql锁机制应用场景 mysql锁表和解锁语句
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作