JS常见的数组方法有哪些,循环操作如何实现
Admin 2022-10-09 群英技术资讯 1070 次浏览
这篇文章主要讲解了“JS常见的数组方法有哪些,循环操作如何实现”,文中的讲解内容简单、清晰、详细,对大家学习或是工作可能会有一定的帮助,希望大家阅读完这篇文章能有所收获。下面就请大家跟着小编的思路一起来学习一下吧。JavaScript 数组用于在单一变量中存储多个值。是一个具有相同数据类型的一个或多个值的集合
(1)使用JavaScript关键词 new 一个Array对象,并且单独赋值
//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"];
出于简洁、可读性和执行速度的考虑,请使用第三种方法(数组文本方法)。
(1)通过引用索引号(下标号)来引用某个数组元素,[0] 是数组中的第一个元素。[1] 是第二个。数组索引从 0 开始;
document.write(arr1[0]);
(2)可通过引用数组名来访问完整数组
console.log(arr1);
(3)修改数组元素。
arr[1] = "css";
length 属性返回数组的长度(数组元素的数目)。
console.log(arr,arr.length);//控制台输出数组和数组长度
(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));

(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]); 

利用上面两个方法可以实现消除字符串之间的所有空格
//功能 剔除字符串里的所有空格 function trimAll(str){ let nowstr = str.trim();//先剔除两端的空格 let arr = nowstr.split(" ");//split() 转换为数组 用空格分隔 for(let i = 0;i
(3)sort():对数组排序
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);注意:以下方法是对数组自身进行操作
(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);
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);
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
这篇文章主要给大家分享js包装对象的内容,下文有具体的介绍和实例,对新手学习和理解js包装对象有一定的帮助,有需要的朋友可以参考借鉴,下面我们一起来学习一下吧。
转换方法:1、利用split()方法将字符串转为字符数组;2、遍历字符数组,利用charCodeAt()和toString()方法将每个字符元素转为二进制值;3、使用join()方法拼接数组元素,转为完整的二进制值即可。
这篇文章主要给大家介绍了关于在vue3.0中如何友好使用antdv的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
JavaScript即将推出两个新的数据类型:Record 和 Tuple ,这俩是啥呢?其实就是一个只读的 Object 和 Array,其实在其它语言中已经有类似的数据类型了,例如 Python 中也有 Tuple(元祖)这一类型,作用也是一个只读的数组(在Python里叫只读的列表),一起来了解一下,这个特性是一个第2阶段提案(即差不多稳了),想要提前体验的,文末也有 polyfill 的使用教程!
这篇文章主要介绍了JavaScript中 querySelector 与 getElementById 方法与区别,围绕querySelector 与 getElementById 的相关资料展开文章内容,需要的朋友可以参考一下
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 ICP核准(ICP备案)粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008