7.JS笔记-数组

news2024/11/18 3:34:57

1.数组的概念

使用数组Array可以把一组相关的数据存放在一起,并提供方便的获取方式。
数组是一组数据的集合,其中的每个数据被称作是元素,在数组中可以存放任意类型的元素。数组是一种将数据存储在单个变量名下的方式

2.创建数组

  • 利用new关键字
var arr=new Array();
  • 利用数组字面量创建数组[]
    数组里元素用逗号分开,js中数组元素类型不限
var arr1=[];
var arr2=[1,2,true,"avc"];

3.获取数组中的元素

索引(下标):用来访问数组元素的序号(下标从0开始)
数组可以通过索引访问、设置、修改数组元素
当下标超出数组最大下标时,因为不存在该数组元素,索引获取的值是undefined

//数组名[下标]
arr[1];

4.遍历数组

遍历:把数组中每个元素从头到尾访问一次

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var arr=[1,2,3,4,5];
        for(var i=0;i<arr.length;i++){
            console.log(arr[i]);
        }
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

4.1 数组长度

数组长度:数组名.length可以得到数组中元素的个数
练习:求数组的元素和以及平均值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var sum=0;
        var arr=[2,6,1,7,4];
        for(var i=0;i<arr.length;i++){
            sum+=arr[i];
        }
        var average=sum/arr.length;
        console.log("数组和="+sum);
        console.log("数组平均值="+average)
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

5.数组中新增元素

5.1通过修改length长度

增加数组长度后,新增的元素默认是undefined,可以重新赋值进行覆盖

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var arr=['onr','two'];
        arr.length=4;
        console.log(arr);
        console.log(arr[2]);
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

5.2索引号增加数组元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var arr=['onr','two'];
        arr.length=4;
        console.log(arr);
        console.log(arr[2]);
        arr[4]='five';
        console.log(arr);
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

6.练习

筛选出数组中大于10的一组数字
方法1:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // 选出大于10的一组数字
        var arr=[2,0,6,1,77,0,52,0,25,7];
        var newArr=[];
        var j=0;
        for(var i=0;i<arr.length;i++){
            if(arr[i]>10){
                newArr[j]=arr[i];
                j++;
            }
        }
        console.log(newArr);
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述
第2种:
使用数组长度

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        // 选出大于10的一组数字
        var arr=[2,0,6,1,77,0,52,0,25,7];
        var newArr=[];
        for(var i=0;i<arr.length;i++){
            if(arr[i]>10){
                newArr[newArr.length]=arr[i];
            }
        }
        console.log(newArr);
    </script>
</head>
<body>
    
</body>
</html>

7.冒泡排序

把数据按照一定的顺序排列展示(从大到小或从小到大)
一次比较两个元素,进行交换

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var arr=[5,2,4,1,3];
        for(var i=0;i<arr.length;i++){
            for(var j=0;j<arr.length-i;j++){
                if(arr[j]>arr[j+1]){
                    var tmp=arr[j];
                    arr[j]=arr[j+1];
                    arr[j+1]=tmp;
                }
            }
        }
        console.log(arr);
    </script>
</head>
<body>
    
</body>
</html>

在这里插入图片描述

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

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

相关文章

【Linux】Linux进程的理解 --- 进程状态、优先级、切换…

如果不改变自己&#xff0c;就别把跨年搞的和分水岭一样&#xff0c;记住你今年是什么吊样&#xff0c;明年就还会是什么吊样&#xff01;&#xff01;&#xff01; 文章目录一、冯诺依曼体系结构&#xff08;硬件&#xff09;二、操作系统&#xff08;软件&#xff09;1.操作…

git笔记2:Git基本理论,项目创建及克隆

目录 一、工作区域 二、工作流程 三、本地仓库搭建 1、创建全新的仓库 2、克隆远程仓库 一、工作区域 Git本地有三个工作区域&#xff1a; 工作目录&#xff08;Working Directory&#xff09;&#xff1a;平时存放代码的地方暂存区&#xff08;Stage/Index&#xff09;&a…

sec6-可派生类型和抽象类型

可派生类型 有两种类型&#xff0c;final类型和derivable类型。final类型没有任何子对象。derivable有子对象。 这两个对象之间的主要区别是它们的类。final类型对象没有自己的类区域。类的唯一成员是它的父类。 派生对象在类中有自己的区域。该类对其子类开放。 G_DECLARE…

【python系列】第三章 基本数据类型

*该系列内容来自于&#xff1a;中国大学MOOC&#xff08;幕客&#xff09;-python语言程序设计 ​​​​​​Python语言程序设计_北京理工大学_中国大学MOOC(慕课) 第三章 基本数据类型 方法论&#xff1a;Python语言数字及字符串类型 实践能力&#xff1a;初步学会编程进行…

236. 二叉树的最近公共祖先 - 力扣[LeetCode]

目录 如果二叉树是二叉搜索树&#xff1a; 如果是普通的二叉树 【方法一】子树判断法 【方法二】路径确定 【方法三】递归 面对此类型的公共祖先问题&#xff0c;可以分为以下几类情况讨论 如果二叉树是二叉搜索树&#xff1a; a. 如果树是空&#xff0c;直接返回nullpt…

分布式存储系统 Ceph 介绍与环境部署

文章目录一、概述二、Ceph 架构三、Ceph核心组件介绍四、Ceph 三种存储类型1&#xff09;块存储服务(RBD)2&#xff09;文件系统存储服务(CephFS)3&#xff09;对象存储服务(RGW)五、Ceph版本发行生命周期六、Ceph 集群部署1&#xff09;集群部署规划2&#xff09;前期准备1、关…

Python--让我们秀翻算法中的二进制

我相信大家在leetcode刷题或者更好的国外天梯刷题的时候应该经常能看到 **<<,>>,|,&**在我们的if里面构成了一个判断的条件. 然后在大家看不懂情况下就莫名其妙的把题目作对了!!! 所以我们准备持续的更新一下,二进制的用法. 大家要明白一个道理.一切的工具它…

Excel聚光灯--双箭头指示

实例需求&#xff1a;在工作表中核对数据时&#xff0c;虽然行列标题都会高亮显示&#xff0c;但是似乎并不明显&#xff0c;因此添加两个列标到活动单元格的箭头&#xff0c;以便于更好的定位。 选中单个单元格效果如下图所示。 选中多个单元格的效果如下图所示。 示例代码如…

51单片机——输出可调PWM

PWM控制在很多地方都会用到&#xff0c;比如使用PWM来控制电机的速度&#xff0c;使用PWM来生成想要的波形。 一、PWM PWM即脉冲宽度调制&#xff0c;在具有惯性的系统中&#xff0c;可以通过对一系列脉冲的宽度进行调制&#xff0c;来等效的获得所需要的模拟参量&#xff1b…

[JavaEE]线程的状态与安全

专栏简介: JavaEE从入门到进阶 题目来源: leetcode,牛客,剑指offer. 创作目标: 记录学习JavaEE学习历程 希望在提升自己的同时,帮助他人,,与大家一起共同进步,互相成长. 学历代表过去,能力代表现在,学习能力代表未来! 目录 1. 线程状态 1.1 观察线程的所有状态 1.2 线程的…

k-means算法进行数据分析应用

简介 kmeans算法又名k均值算法,K-means算法中的k表示的是聚类为k个簇&#xff0c;means代表取每一个聚类中数据值的均值作为该簇的中心&#xff0c;或者称为质心&#xff0c;即用每一个的类的质心对该簇进行描述。 其算法思想大致为&#xff1a;先从样本集中随机选取 k…

【王道操作系统】2.3.3 实现临界区进程互斥的硬件实现方法

实现临界区进程互斥的硬件实现方法 文章目录实现临界区进程互斥的硬件实现方法1.中断隐藏方法2.TestAndSet指令3.Swap指令1.中断隐藏方法 2.TestAndSet指令 执行TSL指令时&#xff0c;它的内部运转逻辑&#xff1a;假设lock现在为false&#xff0c;代表临界资源A空闲&#xff…

AssertionError: Torch not compiled with CUDA enabled解決方案

在執行pytorch代碼的時候&#xff0c;突然看到報錯 AssertionError: Torch not compiled with CUDA enabled 這說明了 1. 你pytoch确实安装了 2. 你安装的是cpu版本 作为验证&#xff0c;你可以在python编辑器输入下列代码 解决方案 首先&#xff0c;安装Nvidia toolkit su…

(深度学习快速入门)第二章:从线性神经网络入手深度学习(波士顿房价案例)

文章目录一&#xff1a;波士顿房价预测数据集说明二&#xff1a;Pytorch搭建模型&#xff08;1&#xff09;数据处理&#xff08;2&#xff09;网络结构&#xff08;3&#xff09;损失函数&#xff08;4&#xff09;优化方法&#xff08;5&#xff09;训练预测&#xff08;6&am…

pytorch应用(入门4)MLP实现MNIST手写数字分类

深层神经网络 前面一章我们简要介绍了神经网络的一些基本知识&#xff0c;同时也是示范了如何用神经网络构建一个复杂的非线性二分类器&#xff0c;更多的情况神经网络适合使用在更加复杂的情况&#xff0c;比如图像分类的问题&#xff0c;下面我们用深度学习的入门级数据集 M…

MyBatisPlus ---- 条件构造器和常用接口

MyBatisPlus ---- 条件构造器和常用接口1. wapper介绍2. QueryWrappera>例1&#xff1a;组装查询条件b>例2&#xff1a;组装排序条件c>例3&#xff1a;组装删除条件d>例4&#xff1a;条件的优先级e>例5&#xff1a;组装select子句f>例6&#xff1a;实现子查询…

dubbo源码实践-SPI扩展-自适应扩展机制

目录 1 前提必备知识 2 术语定义 3 自适应扩展机制的特点 4 扩展点实践 4.1 用户自定义自适应扩展 4.2 dubbo生成自适应扩展 4 自适应扩展类的用途 1 前提必备知识 具体的使用和原理就不说了&#xff0c;网上有人写的挺好的了。 可以参考&#xff1a; Dubbo SPI之自适…

【北京理工大学-Python 数据分析-1.1】

数据维度 维度&#xff1a;一组数据的组织形式 一维数据&#xff1a;由对等关系的有序或无序数据构成&#xff0c;采用线性组织形式。包括列表、集合和数组&#xff08;python中不常见&#xff0c;但在C和Java中比较常见&#xff09;类型。 列表&#xff1a;数据类型可以不同…

讲座笔记:Representation Learning on Networks

1 传统机器学习 传统机器学习需要进行很多的特征工程 我们希望模型自动学习特征&#xff0c;而不是用人为特征工程的方式1.1 目标 1.2 难点 graph更复杂&#xff0c;CNN和RNN很难直接应用 ——>复杂的拓扑结构&#xff08;不像CNN有网格的概念&#xff09;——>没有固定…

国家队入场,中国数字资产交易市场或将迎来新一轮“洗牌”

‍‍数据智能产业创新服务媒体——聚焦数智 改变商业数字化已经成为中国文化产业的催化剂&#xff0c;一大批文化资源在数字技术的赋能下焕发了崭新的生机。随着数字化的升级与科技进步&#xff0c;数字经济正在成为改变全球竞争格局的关键力量&#xff0c;各国家都争先出台相…