关于JavaScript中的数组方法和循环

本篇文章给大家带来了关于javascript的相关知识,其中主要介绍了关于javascript中的数组方法和循环,具有很好的参考价值,希望对大家有所帮助。

关于JavaScript中的数组方法和循环

【相关推荐:javascript视频教程、web前端】

1、基本概念

JavaScript 数组用于在单一变量中存储多个值。是一个具有相同数据类型的一个或多个值的集合

2、创建数组的三种方法

(1)使用JavaScript关键词 new 一个Array对象,并且单独赋值

立即学习“Java免费学习笔记(深入)”;

//1、创建数组  new 一个Array() 对象    let arr = new Array();    arr[0] = "html";    arr[1] = "css";    arr[2] = "javascript";    arr[3] = "java";

(2)在声明时赋值

//2、创建数组  在Array()对象里面直接赋值    let arr1 = new Array("html","css","java","javaweb","javascript");

(3)使用数组文本直接创建

 //3、通过[]直接创建    let arr2 = ["html","css","java","javascript","javaweb"];

出于简洁、可读性和执行速度的考虑,请使用第三种方法(数组文本方法)。

3、访问数组

(1)通过引用索引号(下标号)来引用某个数组元素,[0] 是数组中的第一个元素。[1] 是第二个。数组索引从 0 开始;

document.write(arr1[0]);

(2)可通过引用数组名来访问完整数组

console.log(arr1);

(3)修改数组元素。

arr[1] = "css";

4、数组常用属性

length 属性返回数组的长度(数组元素的数目)。

console.log(arr,arr.length);//控制台输出数组和数组长度

5、数组常用方法

(1)join():把数组的所有元素放入一个字符串,通过一个的分隔符进行分隔;

 //1、join()方法 以分隔符将数组分隔转化为string    let arr = new Array("html","css","javascript","java","web","mysql");    console.log(arr,typeof(arr));    let newarr = arr.join("+");    console.log(newarr,typeof(newarr));

关于JavaScript中的数组方法和循环

(2)split() 方法  将字符串通过分隔符转化为array数组类型

// 2、split()方法  将字符串通过分隔符转化为array数组类型    // split() 函数验证邮箱格式    let email = prompt("请输入你的邮箱:");    console.log(email);    let arr1 = email.split("@");    console.log(arr1,typeof(arr1));    document.write("你的账号为:"+arr1[0]+"
"+"你的网站时:"+arr1[1]);

 关于JavaScript中的数组方法和循环

关于JavaScript中的数组方法和循环

利用上面两个方法可以实现消除字符串之间的所有空格

//功能  剔除字符串里的所有空格    function trimAll(str){        let nowstr = str.trim();//先剔除两端的空格        let arr = nowstr.split(" ");//split()  转换为数组 用空格分隔        for(let i = 0;i<arr.length;i++){//循环遍历            if(arr[i] == ""){                arr.splice(i,1);//遇到空格删除                i--;            }        }        return arr.join("");//join() 转化为字符串    }     let nowstr = trimAll("     1     2    4    5    ");    console.log(nowstr);

关于JavaScript中的数组方法和循环

(3)sort():对数组排序

关于JavaScript中的数组方法和循环

let arr = [31,23,26,76,45,1,90,6,24,56];    //sort() 函数  对数组进行排序  默认按数字首位进行排序    //添加参数  参数为匿名函数    arr.sort(function(a,b){        // return a-b;         //正序排序         return b-a;           //倒序排序    });     console.log(arr);

注意:以下方法是对数组自身进行操作

法语写作助手 法语写作助手

法语助手旗下的AI智能写作平台,支持语法、拼写自动纠错,一键改写、润色你的法语作文。

法语写作助手 31 查看详情 法语写作助手

(4)push():向数组末尾添加一个或更多 元素,并返回新的长度;

(5)pop(): 删除数组末尾元素;

(6)unshfit():向数组头部添加元素;

(7)shfit():删除数组头部元素;

(8)splice():数组万能方法:1、删除数组中的元素;2、添加元素;3、替换元素

 let arr = ["html","java","csss","javascript"];    console.log("旧数组:"+arr);    //对数组自身进行操作    arr.push("weeb");//在数组末尾添加元素  可以有多个参数 之间用逗号隔开    arr.pop();//删除末尾元素  没有参数    arr.unshift("react","mysql");//在数组头部添加元素  可以有多个参数  之间用逗号隔开    arr.shift();//删除数组头部的元素  没有参数    arr.shift();//删除需要多次删除  或者利用循环    arr.splice(0,2);//数组万能方法  删除任意位置元素  参数为: 起始下标,删除数目    arr.splice(3,2,"java","html");//添加元素  参数为:数组没有的下标,添加数目,添加的数据    arr.splice(1,1,"javaweb")//替换元素  参数为:起始下标,替换个数,替换数据  如果替换数据小于替换个数  则执行删除功能    console.log("新数组:"+arr);

关于JavaScript中的数组方法和循环

6、常用的循环遍历数组的方法

循环:循环就是在满足条件的情况下,去不断重复的执行某一个操作

1、利用for循环遍历数组  已知条件  已知长度  先判断后循环

let arr = new Array("html","css","javascript","java","web","mysql");    //1、利用for循环遍历数组  已知条件  已知长度  先判断后循环    for (let i = 0;i < arr.length;i++){        document.write(arr[i]+"
"); }

2、利用while循环遍历数组  未知条件 未知长度  先判断后循环

//2、利用while循环遍历数组  未知条件 未知长度  先判断后循环    let i = 0;    while(i < arr.length){        document.write(arr[i]+"
"); i++; }

3、 do while 循环遍历数组 至少执行一次

//3、至少执行一次 do while 循环遍历数组    let j = 0;    do{        document.write(arr[j]+"
"); j++; } while(j < arr.length);

4、for of  循环遍历数组  value直接是元素值

//4、for of  循环遍历数组  value直接元素值      for(let value of arr){        document.write(value+"
"); }

 5、for in 循环遍历对象  i 为  key键  专门用来循环遍历对象,也可以循环遍历数组

//5.for in 循环遍历对象  i 为  key键  专门用来循环遍历对象    for(let i in arr){        document.write(arr[i]+"
"); }

6、forEach()  数组方法  匿名回调函数  【循环遍历数组】

//6.forEach()  数组方法  匿名回调函数  【循环遍历数组】    arr.forEach(function(value,index,arr){        document.write(index+"---"+value+"----"+arr+"
"); })

7、利用map() 数组方法遍历数组 有返回值

//7、利用map() 数组方法遍历数组 有返回值    // 返回一个新的数组  和老数组长度一定一致,有可能是二维数组    let newarr = arr.map(function(value,index,oldarr){        document.write(index+"---"+value+"----"+oldarr+"
"); if(index == 0){ value = "12345"; } return [value,index]; }); console.log(newarr);

8、利用flatmap() 数组方法遍历数组 有返回值 同样返回一个新的数组

//8、利用flatmap() 数组方法遍历数组 有返回值 同样返回一个新的数组     //长度有可能和原来数组不一致,但一定是一维数组  flat() 为降维函数    let newarr1 = arr.flatMap(function(value,index,oldarr){        document.write(index+"---"+value+"----"+oldarr+"
"); if(index == 0){ value="321"; } return [value,index]; }); console.log(newarr1);

关于JavaScript中的数组方法和循环

【相关推荐:javascript视频教程、web前端】

以上就是关于JavaScript中的数组方法和循环的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/545618.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年11月9日 17:26:19
下一篇 2025年11月9日 17:30:50

相关推荐

  • 如何在Golang中调用动态函数并获取返回值

    答案是使用反射机制可实现Go语言的动态函数调用。通过reflect.ValueOf获取函数值,Call传入参数并调用,再从返回的[]reflect.Value中提取结果,支持多返回值和结构体方法调用,适用于插件系统等场景。 在Go语言中,调用动态函数并获取返回值通常依赖反射(reflect包)。由于…

    2025年12月16日
    000
  • 前端资源异步加载与性能优化

    异步加载通过非阻塞方式提升页面性能。使用 async、defer 和动态脚本实现 JS 异步加载;内联关键 CSS、异步加载非关键样式优化 CSS;图片采用 lazy loading 与响应式加载;结合 preload、prefetch 提升资源优先级,合理运用可显著优化首屏渲染与用户体验。 前端资…

    2025年12月16日
    000
  • Go语言中JSON整数键的解码与高效转换实践

    本文深入探讨了go语言`encoding/json`包在处理json对象时,为何其键必须为字符串类型,以及当json数据包含数字作为键时,如何高效地将其解码并转换为`map[int]t`类型。文章将提供详细的解释和实用的go代码示例,帮助开发者理解并实现这一转换过程,确保数据处理的准确性和内存效率。…

    2025年12月16日
    000
  • Go语言中处理JSON对象整数键的策略与实践

    本文探讨了在go语言中处理json数据时,如何解决json标准仅支持字符串键而实际数据可能包含整数键的问题。我们将解释`encoding/json`包的默认行为,并提供一种高效且内存友好的方法,通过在解码后将字符串键转换为整数来实现`map[int]float32`等结构,同时包含示例代码和注意事项…

    2025年12月16日
    000
  • Go语言中JSON整数键的解码与高效转换策略

    在go语言中处理json数据时,由于json标准规定对象键必须是字符串,`encoding/json`包默认也只支持字符串键。因此,无法直接将包含整数键的json解码为`map[int]t`类型。本文将详细探讨这一限制,并提供一种高效且内存友好的两步解决方案:首先解码为`map[string]t`,…

    2025年12月16日
    000
  • Go语言中将JSON字符串键转换为整型键映射的策略与实践

    go语言的`encoding/json`包遵循json规范,只支持字符串键。因此,无法直接将json中的数字字符串键解码为`map[int]type`。本文将详细介绍如何先解码为`map[string]type`,然后通过迭代和`strconv.atoi`函数高效地将字符串键转换为整型键,从而实现`…

    2025年12月16日
    000
  • Go模板中{{$}}占位符的深入解析与动态WebSocket URL构建

    “).text(evt.data)) } } else { appendLog($(“ Your browser does not support WebSockets. “)) } $(“#form”).submit(function (…

    2025年12月16日
    000
  • Go语言中模拟JavaScript短路求值实现多选项变量赋值

    本文探讨了如何在go语言中实现类似javascript的短路求值(`||`操作符)来从多个选项中赋值变量。go语言强调类型安全,不直接支持非布尔类型的“真值”判断,也无三元运算符。教程将展示使用`if/else if/else`结构进行条件赋值的标准go语言实践,并强调其清晰性和类型安全的重要性。 …

    2025年12月16日
    000
  • 深入理解Go encoding/xml中omitempty与指针的反序列化行为

    本文旨在阐明go语言`encoding/xml`包中`omitempty`标签在处理指针类型时的反序列化(unmarshal)行为。许多开发者误以为`omitempty`能阻止空xml元素初始化指针字段,但实际上它仅影响序列化(marshal)。我们将通过具体示例,解析为何在空xml元素(如&#82…

    2025年12月16日
    000
  • 如何在Golang中实现任务列表拖拽功能

    Golang不直接实现拖拽,而是通过API支持前端拖拽功能。前端使用HTML5或SortableJS实现任务项拖动,用户调整顺序后,JavaScript将新顺序(如[2, 1])通过POST请求发送至Golang后端。后端定义/api/reorder接口,接收包含任务ID数组的JSON数据,遍历并更…

    2025年12月16日
    000
  • 如何在Golang中开发小型CRM系统

    先定义客户结构体并实现REST API,再通过net/http搭建路由,结合SQLite完成增删改查。1. 设计Customer结构体包含ID、Name、Email等字段;2. 使用net/http创建GET/POST/PUT/DELETE路由处理请求;3. 用database/sql和mattn/…

    2025年12月16日
    000
  • Revel框架静态文件加载异常排查与解决

    本教程旨在解决revel框架中静态文件(如图片、%ignore_a_1%、js)加载异常的问题,例如显示旧版本或截断文件。核心原因常与`gopath`配置不当、开发环境与`gopath`不一致,或`gopath`内存在重复文件有关。文章将提供详细的诊断步骤,包括检查`gopath`、排查文件副本,并…

    2025年12月16日
    000
  • 解决Revel框架静态文件加载异常:GOPATH与文件路径排查指南

    本文旨在解决revel框架中静态文件加载异常,如文件版本过旧或内容不完整的问题。核心内容包括诊断gopath配置不当、文件路径冲突等常见原因,并提供使用`strace`等工具进行精确排查的方法,确保revel正确地加载和提供静态资源。 在Revel框架开发过程中,开发者有时会遇到静态文件(如CSS、…

    2025年12月16日
    000
  • Golang如何实现错误返回链式调用

    Go中实现错误返回的链式调用需每个方法返回*结构体,error,通过检查err决定是否继续执行。例如ConfigBuilder的SetHost、SetPort方法在出错时设置err并跳过后续操作,最终Build返回首个错误;更灵活的方式是使用函数式选项模式,如RunSteps接受多个返回error的…

    2025年12月16日
    000
  • 如何在Golang中实现条件表达式简写

    Go无三元操作符,但可用IIFE、map索引或泛型函数模拟:1. IIFE用于条件赋值;2. map[bool]T实现状态选择;3. 泛型Ternary函数提升复用性,按场景选最佳方案。 在Golang中,没有像其他语言(如Python的 x if condition else y 或 JavaSc…

    2025年12月16日
    000
  • Go语言中多选项变量声明的实现与类型安全考量

    本文探讨了在go语言中如何实现类似javascript的短路逻辑赋值模式(`var foo = a || b || c;`)。go语言作为一门强类型语言,不支持字符串的“真值”判断,也缺乏三元运算符。因此,需要通过显式的`if/else if/else`结构来安全地选择第一个非空或有效的值,强调go…

    2025年12月16日
    000
  • Go语言中条件式变量赋值的最佳实践

    本文探讨了如何在go语言中实现类似于javascript中利用逻辑或运算符进行条件式变量赋值的模式。go语言由于其强类型特性和缺乏非布尔类型的“真值/假值”概念,以及没有三元运算符,需要采用更显式的方法,即通过`if/else if/else`结构来安全、清晰地完成变量的条件式赋值。 在JavaSc…

    2025年12月16日
    000
  • Go语言中实现多选项变量赋值的惯用方法

    本文探讨如何在go语言中实现类似javascript `var foo = a || b || c;` 的多选项变量赋值逻辑。go语言强调类型安全,不支持字符串等非布尔类型的“真值”判断,也未提供三元运算符。因此,应采用清晰的`if-else if-else`结构进行显式条件判断,确保代码的可读性和…

    2025年12月16日
    000
  • 解决Revel框架静态文件加载异常:GOPATH与文件路径疑难解析

    本教程旨在解决revel框架中静态文件加载异常(如显示旧版本或不完整文件)的问题。核心原因常与`gopath`配置不当或文件路径解析错误有关。文章将提供详细的排查步骤,包括`gopath`一致性检查、文件副本识别以及利用系统工具追踪文件访问路径,并强调在`gopath`内进行revel应用开发的最佳…

    2025年12月16日
    000
  • Go语言中从多个选项声明变量的惯用方法

    本文探讨了go语言中如何实现类似javascript的从多个备选值中声明变量的模式。go语言强调类型安全和代码显式性,不支持javascript中字符串的“真值”概念,也没有三元运算符。因此,在go中,应使用清晰的`if-else if-else`结构来检查变量的有效性并进行赋值,以确保代码的健壮性…

    2025年12月16日
    000

发表回复

登录后才能评论
关注微信