JavaScript
搜索
分类

Javascript基础之数组的使用

作者：Luka.Ye 时间：2024-04-30 08:54:33　

Javascript 数组的工作方式与大多数编程语言的数组类似。


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>learn4Array</title>
</head>
<body>
<script type="text/javascript">
//创建和填充数组
var myArray = new Array();
myArray[0] = 100;
myArray[1] = "Luka";
myArray[2] = true;
</script>
</body>
</html>

创建数组的时候不需要声明数组中元素的个数。 Javascript数组会自动调整大小以便容纳所有元素。

不必声明数组所含数据的类型。JavaScript数组可以混合包含各种数据的类型 。

1. 使用数组字面量

使用字面量，可以在一条语句中创建和填充数组。


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>learn4Array</title>
</head>
<body>
<script type="text/javascript">
var myArray = [100,"Luka",true];
</script>
</body>
</html>

此例通过在一对方括号（[ 和 ]）之间指定所需要数组元素的方法创建了一个新数组，并将其赋给变量 myArray 。

2. 读取和修改数组内容

要读取指定索引位置的数组元素值，应使用一对方括号（[ 和 ]）并将索引值放在方括号间。JavaScript数组的索引值从0开始。


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>learn4Array</title>
</head>
<body>
<script type="text/javascript">
var myArray = [100,"Luka",true];
//读取指定索引位置的数组元素值
document.writeln("Index 0:"+myArray[0]+"<br />");
//修改数组
myArray[0] = "Monday";
document.writeln("Index 0:"+myArray[0]);
</script>
</body>
</html>

输出结果：

Index 0:100
Index 0:Monday

3. 枚举数组内容

可以用 for 循环枚举数组内容。


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>learn4Array</title>
</head>
<body>
<script type="text/javascript">
var myArray = [100,"Luka",true];
for(var i= 0;i < myArray.length;i++){
document.writeln("Index "+i+": "+myArray[i]+"<br />")
}
</script>
</body>
</html>

输出结果：

Index 0: 100
Index 1: Luka
Index 2: true

3. 使用内置的数组方法

Javascript 中的Array 对象定义了许多方法。下图罗列了一些最常用的方法。

Javascript基础之数组的使用


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>learn4Array</title>
</head>
<body>
<script type="text/javascript">
var myArray1 = [100,"Luka"];
var myArray2 = [true];
//concat(<otherArray>)
var myArray = myArray1.concat(myArray2);
for(var i= 0;i < myArray.length;i++){
document.writeln("myArray["+i+"]: "+myArray[i]+"<br />")
}
document.writeln("<br />");
//join(<separator>)
var strArray = myArray.join('-');
document.writeln(strArray+"<br />");
document.writeln("<br />");
//pop()
myArray.pop();
document.writeln(myArray+"<br />");
document.writeln("<br />");
//push(<item>)
myArray.push("Hello Javascript",200);
document.writeln(myArray+"<br />");
document.writeln("<br />");
//reverse()
myArray = myArray.reverse();
document.writeln(myArray+"<br />");
document.writeln("<br />");
//shift()
myArray.shift();;
document.writeln(myArray+"<br />");
document.writeln("<br />");
//slice(<start>,<end>)
document.writeln( myArray.slice(1,3)+"<br />");
document.writeln( myArray.slice(0)+"<br />");
document.writeln("<br />");
//sort()
function sortNumber(a,b)
{
return b - a;
}
var myArray3 = ["George","John","Thomas","James","Adrew","Martin"];
var myArray4 = [10,5,40,25,1000,1];
document.writeln( myArray3.sort()+"<br />");
document.writeln( myArray4.sort()+"<br />");
//使用一个排序函数,按照数值的大小对数字进行排序
document.writeln( myArray4.sort(sortNumber)+"<br />");
document.writeln("<br />");
//unshift(<item>)
myArray.unshift(1,2);
document.writeln(myArray+"<br />");
</script>
</body>
</html>

输出结果：

myArray[0]: 100
myArray[1]: Luka
myArray[2]: true
100-Luka-true
100,Luka
100,Luka,Hello Javascript,200
200,Hello Javascript,Luka,100
Hello Javascript,Luka,100
Luka,100
Hello Javascript,Luka,100
Adrew,George,James,John,Martin,Thomas
1,10,1000,25,40,5
1000,40,25,10,5,1
1,2,Hello Javascript,Luka,100

以上内容是小编给大家介绍的Javascript基础之数组的使用，希望对大家有所帮助！

标签：js,数组,数组使用
0
投稿

猜你喜欢

  • PHP设计模式之命令模式示例详解

    2024-05-11 10:11:06

  • ASP.NET中URL Routing和IIS上URL Rewriting的区别

    2024-06-05 09:25:27

  • pycharm 使用anaconda为默认环境的操作

    2023-10-08 12:37:25

  • 详解Python对某地区二手房房价数据分析

    2022-04-07 04:47:30

  • 小型分页的设计

    2011-08-18 18:32:26

  • Ubuntu16.04 安装多个python版本的问题及解决方法

    2021-05-26 05:27:11

  • MySQL5.7 windows二进制安装教程

    2024-01-24 04:10:01

  • Div+CSS网页布局对SEO的影响漫谈

    2008-08-22 12:58:00

  • Fibonacci数，Θ(log n)

    2010-03-28 13:28:00

  • Flask模拟实现CSRF攻击的方法

    2023-11-18 16:21:39

  • pytorch自定义不可导激活函数的操作

    2022-07-05 10:09:13

  • 浅谈flask中的before_request与after_request

    2021-05-10 01:29:11

  • Python如何合并多个字典或映射

    2023-11-07 17:20:51

  • Bootstrap实现响应式导航栏效果

    2023-08-13 15:32:13

  • 一文教会你用python连接并简单操作SQLserver数据库

    2024-01-17 14:11:34

  • pythonfor循环中range与len区别

    2023-06-22 03:17:10

  • 对PyTorch中inplace字段的全面理解

    2022-11-15 13:52:24

  • JS应用正则表达式转换大小写示例

    2024-04-26 17:11:14

  • python 输入字符串生成所有有效的IP地址(LeetCode 93号题)

    2022-09-06 00:16:57

  • python实现合并两个有序列表的示例代码

    2021-06-02 20:07:29
    • asp之家 网络编程 m.aspxhome.com