js的数组

1. 概念

1.1. 含义

数组是指一组数据的集合,其中的每个数据被称作元素,在数组中可以存放任意类型的元素

1.2. 作用

  • 数组可以用一个变量名存储所有的值,并且可以用变量名访问任何一个值。
  • 数组中的每个元素都有自己的的 ID(索引),以便它可以很容易地被访问到。
  • 如果有多个数据可以用数组保存起来,然后放到一个变量中,管理非常方便。

1.3. 语法

// 使用[]创建空数组
let  数组名 = []// 定义非空数组
let  数组名 = ['小白','小黑','小胖'];
//或者使用new Array创建数组。
const array2 = new Array(1, 4, 6, 7);

通过 [] 定义数组,数据中可以存放真正的数据,如小白、小黑、小胖等这些都是数组中的数据,我们这些数据称为数组单元,数组单元之间使用英文逗号分隔。

2. 访问元素

通过下标(索引)访问数组元素, 下标从 0 开始。

arr[新的索引] =;

3. 数组长度属性

数组对应着一个 length 属性,它的含义是获取数组的长度,数组属于对象类型。

4. 操作数组

  1. push 动态向数组的尾部添加一个单元
  2. unshit 动态向数组头部添加一个单元
  3. pop 删除最后一个单元
  4. shift 删除第一个单元
  5. splice 动态删除任意单元

4.1. 增加

push( ) 向数组的末尾添加一个或更多元素,并返回新的长度。

特点:

  1. 可以添加一个值,也可以添加多个。
  2. 不能去拼接数组。
let arr = [0, 1, 2, 3];
arr.push(4);
console.log(arr); //[0, 1, 2, 3, 4]

push不能去传入一个数组,需要将数组(用…来展开)展开,否则会将整个数组都放进去。

let arr = [0, 1, 2, 3];
arr.push(...[7, 8]);
console.log(arr); //[0, 1, 2, 3, 7, 8]

unshift( ) 向数组的开头添加一个或更多元素,并返回新的长度。

let arr2 = ["a", "b", "c"];
arr2.unshift("d");
console.log(arr2); //["d", "a", "b", "c"]

concat( ) 连接两个数组 (不改变原数组的内容)。

let arr = [1, 2, 3];
let c = [4, 5, 6];
let b = arr.concat(c);

console.log(arr); // [1,2,3]
console.log(b); // [1,2,3,4,5,6]

4.2. 删除

使用pop()来删除,跟 push 对应,pop从尾巴删除一个元素并返回删除的元素。

let arr = [1, 2, 3];
arr.pop();
console.log(arr); //[1, 2]

shift从头部删除,与 unshift 对应。

let arr = [1, 2, 3];
arr4.shift();
console.log(arr); // [2, 3]

splice(索引,要删除元素的个数,要添加的元素) 从数组中添加或删除元素。

  • 第一个参数:必需。规定从何处添加/删除元素。
  • 第二个参数:可选。规定应该删除多少元素,如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
  • 第三个参数:可选。要添加到数组的新元素。
let arr = [1, 2, 3, 4, 5];
arr.splice(2, 1); // 从索引值为2的位置开始删除1个单元
console.log(arr); // 输出 [1, 2, 4, 5]

4.3. 查询

获取值对应的下标 indexOf
判断数组是否包含某个值,返回boolean includes
截取数组中的某一段 slice(startIndex,endIndex)

arr[index] 查询对应下标的值。

let array = ["a", "b", "c"];
let b = array[1];
console.log(b); //b

indexOf(value)查询对应值的下标。

const index = array.indexOf("c");
console.log(index); //返回 2

includes(value) 判断数组是否包含某个值 。

let array = ["a", "b", "c"];
const isInArr1 = array.includes("b"); //返回true
const isInArr2 = array.includes("d"); //返回false
console.log(isInArr1, isInArr2);

slice(start,end) 截取,包左不包右,包头不包尾。

// slice(startIndex,endIndex) 截取 包含开始不含结束
// slice(startIndex) 截取从startIndex开始到后面的所有值
let arr = [1, 2, 3, 4];
console.log(arr.slice(1, 3)); // [2,3]
console.log(arr.slice(1)); // [2,3,4]

4.4. 修改

splice(startIndex,长度,元素...) 修改 先删除后插入。

var a = [1, 2, 3, 4, 5];
a.splice(2, 1, 9);
console.log(a); // [1,2,9,4,5]

5. 遍历数组

依次访问数组的每一个元素。

let arr = ["red", "green", "blue"];
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

6. 求元素所在的索引

获取用户的输入的数据,求这个数据在数组中第一次出现的索引,如果不存在,得到的结果为-1。

    <script>

      const arr = [11, 55, 22, 33, 44];

      // 用户输入需要查找的数据
      const num = +prompt("请输入要查找的数据");

      // 定义一个变量,用于保存查找的结果
      let index = -1;

      // 遍历数组,查找用户输入的数据
      for (let i = 0; i < arr.length; i++) {
        if (arr[i] == num) {
          index = i;
          break;
        }
      }
      console.log(index);

      //根据最终的索引值,给出提示信息
      if (index == -1) {
        console.log("数组中查无此元素");
      } else {
        console.log("要查找的元素在数组中第一次出现的索引为:" + index);
      }
    </script>

7. 二维数组

数组的数组,二维数组里面的元素都是一维数组。

定义:

let arr = [
  [100, 90, 96],
  [88, 99, 68],
  [92, 55, 98],
];

GIS 使用二维数组存储多边形的点元素(多边形有很多个点组成每一个点都是有经纬度使用一维数组存储每一个点的经纬度使用二维数组存储这些点。

比如:

//首尾连接在一起,形成了一个封闭的三角形
let arr = [
  [100, 150],
  [200, 250],
  [300, 350],
  [100, 150],
];

8. 制作扑克牌

分析:

  1. 定义花色 和数字。
  2. 定义一个牌盒用来存放扑克牌。
  3. 循环花色和数组放入牌盒。
  4. 添加大王和小王。
    <script>
      // 定义花色 和数字
      const array1 = ["♠", "♥", "♦", "♣"];
      const array2 = [
        "2",
        "3",
        "4",
        "5",
        "6",
        "7",
        "8",
        "9",
        "10",
        "J",
        "Q",
        "K",
        "A",
      ];

      // 定义一个牌盒用来存放扑克牌
      let poker = [];

      // 循环放入牌盒
      let index = 0;
      for (let i = 0; i < array1.length; i++) {
        for (let j = 0; j < array2.length; j++) {
          poker[index] = array1[i] + array2[j];
          index++;
        }
      }

      //打印数组
      console.log(poker);

      // 添加大王和小王
      poker.push("大王", "小王");
    </script>

相关推荐

  1. js数组

    2024-03-29 00:44:01       21 阅读
  2. js 数组排序方式

    2024-03-29 00:44:01       35 阅读
  3. js关于数字方法

    2024-03-29 00:44:01       6 阅读
  4. 面试专题一:js数组

    2024-03-29 00:44:01       34 阅读
  5. js 关于数组排序方法

    2024-03-29 00:44:01       11 阅读
  6. js数组返回带children递归数组

    2024-03-29 00:44:01       11 阅读
  7. js数组合并方法,以及各方法区别

    2024-03-29 00:44:01       33 阅读
  8. 前端开发中js数据劫持

    2024-03-29 00:44:01       36 阅读
  9. 数据类型转换(js问题)

    2024-03-29 00:44:01       41 阅读
  10. js判断是否为数字方法

    2024-03-29 00:44:01       36 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-03-29 00:44:01       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-03-29 00:44:01       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-03-29 00:44:01       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-03-29 00:44:01       18 阅读

热门阅读

  1. webpack为什么要使用loader,如何手写loader

    2024-03-29 00:44:01       17 阅读
  2. webpack快速基础

    2024-03-29 00:44:01       17 阅读
  3. Linux双向链表相关API的使用及事例Demo

    2024-03-29 00:44:01       16 阅读
  4. 添加了ssh keys还是无法git push

    2024-03-29 00:44:01       21 阅读
  5. 数据库底层原理

    2024-03-29 00:44:01       16 阅读
  6. mysql null值相减还是null

    2024-03-29 00:44:01       17 阅读
  7. 电机转速&转矩计算公式

    2024-03-29 00:44:01       29 阅读
  8. Go语言教程和案例

    2024-03-29 00:44:01       16 阅读