【温故而知新-Javascript】使用数组

简介:

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 对象定义了许多方法。下图罗列了一些最常用的方法。

 

复制代码
<!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
复制代码





本文转自叶超Luka博客园博客,原文链接:http://www.cnblogs.com/yc-755909659/p/5928019.html,如需转载请自行联系原作者
目录
相关文章
|
3月前
|
自然语言处理 前端开发 JavaScript
🛠️ JavaScript数组操作指南:20个精通必备技巧🚀
本文详细介绍了 JavaScript 中的 20 个高效数组操作技巧,涵盖了从基本的添加、移除元素,到数组转换和去重等高级操作。强调了不可变性的重要性,提供了清晰的代码示例,帮助开发者编写更整洁和高效的代码。无论是新手还是经验丰富的开发者,这些技巧都将显著提升您的编码能力,使您在项目中更具竞争力。
46 2
|
3月前
|
JavaScript 前端开发 测试技术
JS都有哪些操作数组的方法
JS都有哪些操作数组的方法
43 3
|
3月前
|
JavaScript
js删除数组中已知下标的元素
js删除数组中已知下标的元素
57 4
|
3月前
|
缓存 JavaScript 前端开发
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
52 1
|
3月前
|
JavaScript 前端开发 Java
【javaScript数组,函数】的基础知识点
【javaScript数组,函数】的基础知识点
33 5
|
3月前
|
JavaScript 前端开发 索引
探索JavaScript数组:基础
探索JavaScript数组:基础
21 3
|
3月前
|
JavaScript 前端开发 索引
JS 删除数组元素( 5种方法 )
JS 删除数组元素( 5种方法 )
83 1
|
3月前
|
JavaScript 前端开发
如何在JS中声明一个数组
如何在JS中声明一个数组
35 0
|
3月前
|
存储 JavaScript 前端开发
JavaScript Array(数组) 对象
JavaScript Array(数组) 对象
36 3
|
4月前
|
JavaScript 前端开发
js删除数组最后一个元素
js删除数组最后一个元素