js如何定义一个数组?js中对数组的定义及操作实例总结

落芳君_1590

落芳君_1590

2018-07-20

19992人浏览

原创

js中定义数组以及数组操作的方式分别是什么?js数组定义的方式有两种:字面量定义数组和使用new关键字定义数组,js中数组的操作有添加数组元素,删除数组元素,修改数组元素,遍历数组元素,下面就具体来看一下这些内容。

1、js数组的定义

1、字面量定义数组如下:

<script>
    var arr = (1,2,3,[4,5,6],{}); //其中数组元素可以是number,string,object
    console.log(arr);//在控制台输出数组</script>

2、使用new关键字定义数组如下:

<script>var arr = new Array[1,2,3,[4,5,6],{}];
console.log(arr);</script>

3、注意事项:

使用new定义数组时,如果定义为:var arr = new Array(n);则表示定义的是数组长度为n的数组,如果为空值,则表示定义了一个空数组。

2、js数组的操作

1、添加数组元素如下:

方法1:

<script>
    var arr = [1,2,3,4,"A"];
    arr[5] = "M"; //如果为数组元素赋值的索引i大于数组长度,则添加数组元素后的数组长度为 i+1
    console.log(arr);</script>

方法2:使用push()方法;

<script>
    var arr = [1,2,3,4,"A"];
    arr.push("BB","cc");//在数组元素的后面添加,可以追加多个元素,
    console.log(arr);</script>

方法3:使用unshift()方法;

<script>
    var arr = [1,2,3,4,"A"];
    arr.unshift("BB","cc");//在数组元素的前面添加,可以追加多个元素,
    console.log(arr);</script>

2、删除数组元素:

方法1:使用pop()方法,删除最后一个数组元素;

<script>
    var arr = ["A", "B", "C", "D"];
    arr.pop(); //删除最后一个元素,没有参数,每次只能删除一个
    console.log(arr);</script>

方法2:使用shift()方法,删除第一个元素

<script>
    var arr = ["A", "B", "C", "D"];
    arr.shift(); //删除第一个数组元素,没有参数,每次只能删除一个
    console.log(arr); </script>

3、修改数组

 <script>
    var arr = ["A", "B", "C", "D"];
    arr[2] = "E";
    console.log(arr); </script>

4、遍历一维数组

<script>
    var arr = ["A", "B", "C", "D"];
    console.log(arr.length);    for(var i = 0; i<arr.length;i++){
        console.log(arr[i]);
    }</script>

5、遍历二维数组

   <script>
        var arr = [
            [1, 2, 3],
            [4, 5, 6],
            [7, 8, 9]
        ]        for(var i = 0;i<arr.length;i++){ //先遍历arr
            for(var j = 0;j<arr[i].length;j++){ //遍历arr元素中的数组元素
                console.log(arr[i][j]);
            }
        }    </script>

3、js数组中常见的方法

1、join():将数组中的元素,使用某种符号连接起来,形成一个字符串

 <script>    
 var arr = ["A","B","C","D"]    var a = arr.join("*")    console.log( a);    
 var a = arr.join("+")    console.log( a);    var a = arr.join("-")    console.log( a);    
 var a = arr.join("/")    console.log(a);    console.log(typeof a);
</script>

2、reverse():将数组中的元素倒置顺序;

  <script>
      var arr = ["A","B","C","D"]      
      var a = arr.reverse();  //倒置数组顺序
      for(var i = 0; i< arr.length; i++) //遍历数组
      {
        console.log(a[i]);
      }      
    </script>

3、concat() :将多个数组拼接成一个数组,其中的多维数组是不会展开的

 <script>
     var arr = ["A","B","C","D"];     
     var arr1 = ["A","B","C","D"];     
     var arr2 = ["A","B","C","D"];     
     var arr3 = ["A","B","C","D" ,[1,2,3]];     
     var a = arr.concat(arr1,arr2,arr3) //concat将多个数组拼接成一个数组,其中的多维数组是不会展开的 
     console.log(a);
     console.log(typeof a)  
    </script>

4、sort():将数组中的元素按照ASCII从小到大排序

 <script>
       var arr = ["d","AbC","AaC","D",1,8,6];       
       var a = arr.sort(); //sort是单个字符比较 例如AbD和AaC 先比较第一个字母,在比较第二个字母,第二个字母那个小就排在前面,之后就不比较后面的字母大小了
       console.log(a);    </script>

5、slice():截取数组中的元素;

   <script>
         var arr = ["A","B","C","D"];         
         var a = arr.slice(1,3); //截取的元素包括开始截取的元素,但是不包括最后截取的元素
         console.log(a);         
         var a = arr.slice(1); //只写一个则表示截取到最后一个元素
         console.log(a);    </script>

6、toString():将数组转换成字符串类型

<script>
      var arr = ["A","B","C","D"];      
      var a = arr.toString();
      console.log(a);
      console.log(typeof a);    
 </script>

相关推荐:

JavaScript jQuery 中定义数组与操作及jquery数组操作

Jquery操作js数组及对象示例代码_jquery

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
AI视频生成软件推荐
AI视频生成软件推荐

本专题汇总了当前主流的AI视频生成软件推荐与排行榜单,涵盖seko、AniShort、剧云、Lovart、LiblibAI及立刻mv等热门工具。同时整理了各软件在文生视频、图生视频、时长限制、画质表现及免费额度等方面的差异对比,助您快速选对适合创作需求的AI视频生成工具。

2026.09.16

140

9

ai生成视频的工具免费版合集
ai生成视频的工具免费版合集

本专题汇总了当前免费AI生成视频工具的排行榜与推荐清单,涵盖seko、讯飞智作、AniShort及剧云、Lovart等多模型集成平台。同时整理了各工具的免费额度、输出时长、水印政策及适用场景差异,助您快速选择合适工具开启AI视频创作。

2026.09.16

60

10

Pandas时间序列分析与可视化报表
Pandas时间序列分析与可视化报表

本专题整理Pandas日期转换、时间索引、重采样、滚动窗口、时区处理、plot绘图、Styler表格样式和报表输出方法。

2026.09.16

60

23

Pandas数据筛选索引与清洗处理
Pandas数据筛选索引与清洗处理

本专题整理Pandas中的loc、iloc、条件筛选、query查询、缺失值处理、重复值删除、类型转换和字符串列清洗方法。

2026.09.16

40

25

Pandas数据读取导入与文件导出处理
Pandas数据读取导入与文件导出处理

本专题整理Pandas读取CSV、Excel、JSON、SQL、Parquet等文件的方法,以及to_csv、to_excel、to_sql和to_parquet等常用数据导出流程。

2026.09.16

40

27

GDB怎么设置断点
GDB怎么设置断点

本专题介绍GDB按照函数名、源代码行号和文件位置设置断点的方法,详细说明run、continue、next、step等命令的配合使用,帮助定位程序崩溃、逻辑异常及代码未按预期执行的问题。

2026.09.11

340

28

GDB怎么查看变量值
GDB怎么查看变量值

本专题介绍GDB调试过程中查看变量值的具体方法,涵盖局部变量、函数参数、数组、结构体和指针内容查询,同时整理变量持续显示、格式化输出及无法读取变量时的排查思路。

2026.09.11

100

22

GDB C++程序怎么调试
GDB C++程序怎么调试

本专题围绕GDB调试C++程序的实际过程,详细说明程序编译、调试器启动、命令行参数传入、断点命中和程序继续运行等步骤,并介绍条件断点、临时断点和观察点的设置方法,方便开发者跟踪复杂代码的执行状态。

2026.09.11

120

20

Iris框架MVC架构与依赖注入合集
Iris框架MVC架构与依赖注入合集

本专题讲解Iris框架MVC开发模式,包含控制器注册、方法命名与路径映射、By参数绑定、BeforeActivation自定义路由,以及依赖注入容器注册、数据库依赖注入、返回值序列化及MVC下WebSocket与gRPC整合实践。

2026.09.11

80

15

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
热门推荐
/
最新课程
phpStudy极速入门视频教程
phpStudy极速入门视频教程

共6课时 | 54.6万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时 | 133万人学习