【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

这篇具有很好参考价值的文章主要介绍了【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

🐚 作者: 阿伟
💂 个人主页: Flyme awei

🐋 希望大家多多支持😘一起进步呀!

💬 文章对你有帮助👉关注✨点赞👍收藏📂

JavaScript数组的使用

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

一、数组的创建

第一种:
var 数组名 = new Array();创建一个空数组

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
	
			var arr=new Array();
			console.log(arr)//打印到浏览器控制台
			
		</script>
	</head>
	<body>
	</body>
</html>

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用
第二种:
var arr2 = new Array(10);创建一个定长为10的数组

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
	
			var arr2 = new Array(10);
			arr2[0]="h";
			arr2[9]="l"
			console.log(arr2)
			
		</script>
	</head>
	<body>
	</body>
</html>

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

第三种
var arr3 = new Array(a,b,c);创建时直接指定元素值

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			
			var arr3 = new Array("hello","world","JavaScript",10,true)
			console.log(arr3)
			
		</script>
	</head>
	<body>
	</body>
</html>

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用
第四种
var arr4 = ["hello","world","Flyme awei"];相当于第三种的简写

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			
			var arr4 = ["hello","world","Flyme awei"]
			console.log(arr4)
			
		</script>
	</head>
	<body>
	</body>
</html>

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

二、数组的元素和长度

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			var arr = [1,2,3,4,5];
			console.log(arr);
			console.log(arr[0]);
			console.log(arr.length)
		</script>
	</head>
	<body>
	</body>
</html>

控制台
【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

1.通过修改length属性来改变数组长度的。
【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

2.通过索引改变数组长度。
【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用
【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

三、数组的遍历

1.普通for循环遍历数组

!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			var arr = [0,1,2,3,4,5,6,7,8,9];
			
			for(var i=0;i<=arr.length;i++){
				console.log(i)
			}
		</script>
	</head>
	<body>
	</body>
</html>

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

2.for each遍历数组
js中的for each写法:for( var i in 数组)i不是元素,是索引
【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用

四、数组的常用方法

1.查询元素索引
2.合并两个数组
3.合并多个数组
4.合并字符串
5.删除数组最后一个元素
6.在数组结尾添加元素
7.反转数组
8.删除数组第一个元素
9.向第一个位置添加元素
10.截取子数组
11.删除数组中的某些元素

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			var arr = [0,1,2,3,4,5,6,7,8,9];
			var index = arr.indexOf(7);//查询元素索引的方法
			console.log(index);
			
			//合并两个数组
			var hege = ["Cecilie","Lone"];
			var stale = ["Email","Tobias","Linus"];
			var childer = hege.concat(stale);
			console.log(childer);
			
			//合并三个数组
			var family = hege.concat(stale,childer);
			console.log(family);
			
			//合并字符串
			var fruits = ["Banana","Orange","Apple"];
			var fs = fruits.join();
			console.log(fs);
			
			//删除数组的最后一个元素
			fruits.pop();
			console.log(fruits);
			
			//在数组结尾增加元素
			fruits.push("Grape");
			console.log(fruits);
			
			//翻转数组
			fruits.reverse();
			console.log(fruits);
			
			//删除数组第一个元素
			var ss = fruits.shift();
			console.log(fruits);
			console.log(ss);
			
			//向第一个位置添加元素
			fruits.unshift("Per");
			console.log(fruits);
			
			//截取子数组;
			//从三开始,到六结束
			fruits.slice(3,6);
			console.log(fruits);
			
			//删除数组中某些元素
			//从2开始,删除5个
			numbers = [1,2,3,4,5,6,7,8,9]
			numbers.splice(2,5);
			console.log(numbers);	

			//如果第二个元素是0,那么就变成在指定索引位置添加元素
			numbers.splice(2,0,100);
			console.log(numbers);
	</script>
	</head>
	<body>
	</body>
</html>

【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用
好啦,文章到这里就结束啦!
【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用文章来源地址https://www.toymoban.com/news/detail-402991.html

到了这里,关于【前端灵魂脚本语言JavaScript⑤】——JS中数组的使用的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 前端Javascript | 数组值随机选择函数

    为了解决 postman 传参数据定制化,需要写一点前置脚本,有用到随机选取数组中的值来造数据。

    2024年02月07日
    浏览(48)
  • 【javascript】js获取数组中数值最大的数

    一、借助apply()的参数,获得最大值 由于max()里面参数不能为数组,所以借助apply(funtion,args)方法调用Math.max(),function为要调用的方法,args是数组对象,当function为null时,默认为上文,即相当于apply(Math.max,arr) 二、借助call()的参数,获得最大值 call()与apply()类似,区别是传入参数

    2024年02月11日
    浏览(40)
  • 安卓手机怎么运行js脚本,手机的javascript怎么开

    大家好,小编为大家解答手机怎么启用javascript功能的问题。很多人还不知道安卓手机怎么运行js脚本,现在让我们一起来看看吧!         最近在研究c++与JavaScript的交互,有朋友问我安卓怎样与JavaScript交互,今天找到一个之前写的小demo,实现的是安卓webview里面的JavaScript和

    2024年01月23日
    浏览(49)
  • 重生前端之我在javascript敲代码(03-数组)

    一. 数组(重点) 思考:如何保存一个班级的所有学生的姓名? 回答:一种方法利用前面学习过的知识,则每一条信息都需要一个变量去保存,缺点是这样做很麻烦,而且容易出错,又不合理;另一种方法就是利用数组。 概念:数组是存储一系列值的变量集合,可以存储多

    2024年04月11日
    浏览(48)
  • 【技巧】ScriptEngine--Java动态执行JS Javascript脚本(可调用java的方法)

    开发手册 Java Platform, Standard Edition Nashorn User\\\'s Guide, Release 14 用户手册 Nashorn User\\\'s Guide (oracle.com) https://docs.oracle.com/en/java/javase/14/nashorn/ 甚至可以让前端来写后端业务代码 可以通过js调用java的方法, 通过传参的方式将java对象传给js 可以单独写个JsUtil 让js来调用 里边写常用的方法

    2024年02月01日
    浏览(47)
  • perl脚本语言学习1——基础篇:变量、数组、哈希数组、循环、文件、函数

    2023.3.18 今天下载虚拟机把电脑磁盘内容弄到乱七八糟,难受 发现每次学习遇到一个坎,感觉面前是一座大山,越过去之后又对前途充满了希望 perl:practical extraction report language 实用提取和报表语言 从字面上看主要与文本处理相关 变量定义: my 存储 数字、字符、字符

    2024年02月12日
    浏览(72)
  • 【云原生 | 36】Docker快速部署主流脚本语言JavaScript

    🍁 博主简介 :         🏅云计算领域优质创作者         🏅新星计划第三季python赛道第一名         🏅阿里云ACE认证高级工程师         🏅阿里云开发者社区专家博主 ✒️ 博主微信 :15575411187 💊 交流社区 :小鹏linux(个人社区)欢迎您的加入! 目录

    2024年02月02日
    浏览(48)
  • 大型医院云HIS系统:采用前后端分离架构,前端由Angular语言、JavaScript开发;后端使用Java语言开发 融合B/S版电子病历系统

    一套医院云his系统源码 采用前后端分离架构,前端由Angular语言、JavaScript开发;后端使用Java语言开发。融合B/S版电子病历系统,支持电子病历四级,HIS与电子病历系统均拥有自主知识产权。 文末卡片获取联系! 基于云计算技术的B/S架构的医院管理系统(简称云HIS),采用前后

    2024年02月03日
    浏览(50)
  • jQuery.js - 前端必备的Javascript库

    作者: WangMin 格言: 努力做好自己喜欢的每一件事 jQuery.js 是什么? jQuery是一个快速简洁、免费开源易用的JavaScript框架, 倡导写更少的代码,做更多的事情 。它封装JavaScript常用的功能代码,提供了一种简便的JavaScript设计模式,以及我们开发中常用到的操作DOM的API,优化HTML文

    2024年02月05日
    浏览(76)
  • web前端框架JS学习之JavaScript类型转换

    vascript有多种数据类型,如字符串、数字、布尔等,可以通过typeof语句来查看变量的数据类型。数据类型转换就是数据类型之间相互转换,比如把数字转成字符串、把布尔值转成字符串、把字符串转成数字等,这在工作也是经常碰到的。 本期我们就给大家说说web前端框架JS学

    2024年02月10日
    浏览(63)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包