初识javaScript（六）数组(一)

最新推荐文章于 2022-11-13 14:15:18 发布

打酱油的女孩子

最新推荐文章于 2022-11-13 14:15:18 发布

阅读量346

点赞数

分类专栏： js 文章标签： javascript

本文链接：https://blog.csdn.net/weixin_38341556/article/details/107778293

版权

js 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

数组

1引入数组

需求：随机得到10个学生的分数。然后求学生的总分和平均分。

<body>
<script>
   const COUNT = 10;
   const MIN_SCORE = 60;
   const MAX_SCORE = 101;

   //定义数组,空数组。
   var scores = [];

   function random(min, max) {
       return ~~(Math.random () * (max - min) + min);
   }

   var sum = 0;
   var avg = 0;
   //使用循环得到学生的分数，累加
   for (let i = 0; i < COUNT; i++) {
       var score = random (MIN_SCORE, MAX_SCORE);
       sum += score;
       //将得到的随机数，添加到数组中。
       scores[i] = score;
       console.log (`第${i+1}个学生的分数为:${score}`);
   }
   avg = sum / COUNT;

   console.log ("sum = " + sum);
   console.log ("avg = " + avg);

   //访问每一个学生的分数。
   //打印数组
   console.log (scores);
   for (let i = 0; i < COUNT; i++) {
       console.log (`第${i+1}个学生的分数为:${scores[i]}`);
   }
</script>
</body>

2 数组的定义和特点

数组的概念： array
数组是一组【有序的】【变量】的【集合】。
数组的简单定义形式：
var 数组变量 = [数据1,数据2,…];
特点：
1：数组是我们接触到的第二种引用(reference)数据类型。数组的所有的数据在堆内存（heap）中。数据是连续的。
2：数组中的数据是有顺序的。有序号。序号是连续的，从0开始的。依次递增。最大到32bits的最大值 - 2。序号一般称为：索引(index)、下标、角标。
4: 数组中的数据一般称为元素(element)；数组中的每个元素都是有下标的。
5: 数组访问元素，通过: 数组名[下标] （代表了数组中的一个变量）。
6：数组是一种特殊的对象。使用typeof 返回 object。
7: 数组是一种特殊的对象，也是键值对的集合。所有的键都是数值型的字符串。从0开始。
对象中的键都是字符串。
8：数组中的元素的类型可以是js支持的任意类型。元素可以重复。元素的数据类型可以不同。
9：数组有一个属性，length。代表了数组的元素的个数。是一个整数值。取值范围是[0~2**32 - 1],通过数组名.length 来访问该属性。所以，元素的下标的取值范围是[0~length-1];

<body>
<script>
 var arr = [0,1,2,3,4,5,6,7,8,9];

 //length
 console.log (arr.length);//10
 //length的最大值。下标的最大值。2**32 - 2。
 arr.length = 2**32 - 1;
 //如果下标超过了length，那么就当做字符串来处理了。
 arr[2**32] = 100;

 var num = 10;
 num ++;
 num += 10;
 //之前的变量如何使用，数组的元素就如何使用。
 arr[0] ++;
 arr[0] += 10;
 console.log (arr[0]);//11
 console.log (arr["0"]);//11

 var obj = {
     "0":10,
     "1":11,
     "2":10
 };

 console.log (typeof arr);//object

 var arr1 = [
     1,
     "千万里我追寻着你",
     true,
     undefined,
     null,
     [1,2,true,null],
     function () {
         console.log ("hello");
     },
     {
         name:"刘奇",
         age:21
     }
 ];
 console.log (arr1[0]);
 console.log (arr1[1]);
 console.log (arr1[5][2]);
 arr1[6]();
 console.log (arr1[7].name);
 console.log (arr1[7]["name"]);

</script>
</body>

3 in关键字介绍

in 关键字：
作用：用来判断某一个值是否是某个对象的属性(key)。
语法：key in obj ： key 是否是obj对象的一个键。如果是返回true，否则返回fasle。

<body>

<script>
 var arr = [1, 2, 3, 4, 5];
 console.log (0 in arr);//true
 console.log ("4" in arr);//true
 console.log (5 in arr);//false

 var obj = {
     name:"小刚",
     age:19,
     gender:"男"
 };
 console.log ("name" in obj);//true
 console.log ("age" in obj);//true
 var gen = "gender";
 console.log (gen in obj);//true
</script>
</body>

4 数组的length属性

length:是数组的一个属性.
1: length 作为数组对象的一个特殊的key ，值是数组中键值对的个数。
是一个大于等于0的值。最大值为 2**32 - 1; 最小值为0.
该值不需要开发者来管理，数组这种数据类型底层自行维护。该值会
自动的调整，是一个动态的值。
最大值：4294967295
2：访问length属性的方式：数组名.length
3: 可以通过修改length属性的值，实现对数组的扩容和缩容。
a：通过修改length属性，扩容。没有赋值的元素的值为：undefined
b: 缩容，直接保留低索引的元素，超过数量的高索引元素直接被截断。

<body>
<script>
   var arr = ["a","b","c"];

   console.log (arr);
   console.log (arr.length);//3
   arr[3] = "d";
   console.log (arr.length);//4

   //修改length属性
   arr.length = 2**32 - 1;
   console.log (arr);
   console.log (arr[4]);
   //缩容
   arr.length = 2;
   console.log (arr);

   //中间有若干个元素没有赋值。中间的元素的值为undefined。
   //不建议使用如下的方式。
   arr[10] = "g";
   console.log (arr);
   console.log (arr.length);
   console.log (arr[5]);
</script>
</body>

<body>
<!--
    练习：求2-100之间所有的素数，存入一个数组中。并打印数组的内容。
    质数：又称为素数，只能被1和自身整除的数。
-->
<script>
    /**
     * 判断num是否是素数
     * @param num
     */
    function isPrime(num) {
        if (num <= 1)
            return false;
        for (let i = 2; i < num; i++) {
            if (num % i === 0)
                return false;
        }
        return true;
    }

    /**
     * 得到区间的所有的素数
     * @param min 区间包含
     * @param max 区间不包含
     */
    function getPrimes(min, max) {
        var arr = [];
        var index = 0;
        //遍历区间，将素数i添加到数组中
        for (let i = min; i <max ; i++) {
            if(isPrime(i)){
                arr[index++] = i;
                // index ++;
            }
        }
        //最后返回数组
        return arr;
    }

    //测试方法
    function test() {
        var primes = getPrimes(2,101);
        console.log (primes);
    }

    test();

</script>
</body>

5 数组的初始化方式

数组的初始化方式：
1：表达式直接赋值的方式（一般情况）
//1 比较常用的方式。
var arr = [1,2,3,4];
var arr = [];
arr[0] = 1;
arr[1] =2;
arr[2] = 3;
2：构造函数式（少用的情况）
//2 构造函数方式
//创建了数组对象，初始化元素个数为6，并指定了每个元素的值。
var arr = new Array(1,2,3,4,5,6);
console.log (arr);
//创建了数组对象，初始化元素个数为6，每个元素的默认值为undefined。
var arr = new Array(6);
console.log (arr);

6 数组的元素的操作

<body>
<!--
   数组元素的操作：
       增：
           数组名[新下标] = 值;
           会动态的修改数组的length属性。
       删:
           delete 数组名[删除元素的下标];
           删除之后，该位置的值被删除，修改元素的默认值undefined。
           不会修改length属性。
       改:
           数组名[下标] = 新的值;

       查:
           数组名[下标];

-->
<script>
   var arr = ["a","b","c","d"];
   //增加元素的操作
   arr[4] = "e";//下标连续增加
   arr[10] = "x";//下标不连续，中间会有undefined的元素。
   // ["a", "b", "c", "d", "e", empty × 5, "x"]
   console.log (arr);

   //删除某个元素
   delete arr[3];
   console.log (arr);

   //修改
   arr[1] = "B";
   console.log (arr);

   //获取
   console.log (arr[0]);

</script>
</body>

7 数组传引用

基本数据类型作为参数，传参的过程：给形参分配内存，并将实参的【值】赋值给形参的过程。
传值的过程。pass by value。
数组作为实参，参数传递介绍：
数组是引用数据类型，数组变量保存的是数组对象的引用(地址)。
数组作为参数，传参的过程是：给形参分配内存，并将实参的【引用】赋值给形参的过程。
传引用的过程：pass by reference。

<body>

<script>
   var arr = [1, 100];

   //交换数组中的两个元素的值
   function change(arr) {
       arr[0] = arr[0] ^ arr[1];
       arr[1] = arr[0] ^ arr[1];
       arr[0] = arr[0] ^ arr[1];
   }

   change (arr);

   console.log (arr);

   //传值的例子
   var num1 = 10;
   //将num1的值赋值给了num2.
   var num2 = num1;
   num2++;
   console.log (num1);//10 没有变
   console.log (num2);//11 变了。

   var arr1 = [1];
   //将arr1的引用赋值给了arr2.
   //arr1 和 arr2 同时指向了同一个对象。
   var arr2 = arr1;
   arr2[0]++;
   console.log (arr1);//[2];
   console.log (arr2);//[2];

</script>

</body>

8 数组的遍历

遍历数组的方式：
1：基本的for循环使用最多的一种。
2: for in 循环。用来遍历对象。
3：for of 循环。
4：for-each 实例方法

<body>
<script>
   var arr = ["a", "b", 'c', "d", "e", "f", "g"];
   const LEN = arr.length;
   //1 使用基本的for循环遍历数组的元素
   for (let i = 0; i < LEN; i++) {
       console.log (arr[i]);
   }
   console.log ("-----------------");
   //2 for in 循环  i代表了数组元素的所有的下标。
   for (var i in arr){
       console.log (arr[i]);
   }
   console.log ("-----------------");
   //3 for of 循环  不能直接得到ele元素所对应的下标。
   for (var ele of arr){
       console.log (ele);
   }
   console.log ("-----------------");
   //4 for-each 遍历 实例方法，想遍历哪个数组，就用哪个数组对象去调用该方法
   var fn = function(ele,index){
       //ele : 数组的元素。
       //index 是ele的元素的下标。
       console.log (`第${index+1}个元素是：${ele}`);
   };
   arr.forEach(fn);

   console.log ("-----------------");
   arr.forEach(function(ele,index){
       //ele : 数组的元素。
       //index 是ele的元素的下标。
       console.log (`第${index+1}个元素是：${ele}`);
   });
   console.log ("-----------------");
   arr.forEach(function (ele,index) {
       console.log (`第${index+1}个元素是：${ele}`);
   });



</script>
</body>

9 类数组对象介绍

类数组对象：类似于数组对象的对象。
类数组对象的条件：
1：所有的key都是数值型的字符串。
2：还有length属性。
类数组对象和数组对象的区别：
1：length属性的区别。数组的length 是动态的。
类数组对象的length，不会自动修改个数。
2：数组作为js的内置数据类型，js提供了大量的操作数组的方法供它使用。
类数组对象是不存在这些函数的。

相同点：
1：都是对象
2：都可以添加非数值型的键key。数组中添加非数值型的键，不会影响length属性。

补充：
可以通过一个函数来判断任意对象是否是数组对象。
Array.isArray(obj); 如果obj是数组返回true，否则返回false。

<body>

<script>
 var obj = {
     0 : "a",
     1 : "b",
     2 : "c",
     length:3
 };
 console.log (Array.isArray(obj));//false
 console.log (obj[0]);
 console.log (obj[1]);
 console.log (obj[2]);
 obj[3] = "d";
 console.log (obj.length);

 //给对象添加属性。
 obj.name = "对象";
 console.log (obj);

 //给数组添加非数值型的key。不会影响数组的长度。
 var arr = ["a","b"];
 arr.name = "数组";
 console.log (arr);
 console.log (arr.length);
 console.log (Array.isArray(arr));//true

</script>
</body>

10 数组练习

1：自定义函数实现，获得一个随机数组的方法，数组元素的个数是任意的，元素的取值区间是任意的。
2：自定义函数实现：求任意数组中的元素的最大值。
3：自定义函数实现：统计任意数组中的元素等于某个值的个数。
4：自定义函数实现：统计任意数组中的元素等于某个值的所有的下标。需要返回一个数组。

<body>

<script>
  /**
   *
   * @param length
   * @param min
   * @param max
   */
  function getRandomArray(length, min, max) {
      var arr = [];
      for (let i = 0; i < length; i++) {
          arr[i] = random (min, max);
      }
      return arr;
  }

  function random(min, max) {
      return ~~(Math.random () * (max - min) + min);
  }

  //2
  function max(arr) {
      if (!Array.isArray (arr)) {
          return undefined;
      }
      var max = arr[0];
      //max和后续的所有的元素比较
      for (let i = 1; i < arr.length; i++) {
          if (arr[i] > max)
              max = arr[i];
      }
      return max;
  }

  /**
   * 统计arr中有多少个value值
   * @param arr
   * @param value
   */
  function counterValue(arr, value) {
      if (!Array.isArray (arr)) {
          return 0;
      }
      const LEN = arr.length;
      if (LEN === 0)
          return 0;
      //遍历数组，挨个和value比较，相等计数加一
      var counter = 0;
      for (let i = 0; i < LEN; i++) {
          if(arr[i] === value)
              counter++;
      }
      return counter;
  }

  //4
  /**
   * 统计arr中值为value的所有的索引
   * @param arr
   * @param value
   */
  function counterIndexes(arr,value) {
      if (!Array.isArray (arr)) {
          return [];
      }
      const LEN = arr.length;
      if (LEN === 0)
          return [];

      var indexes = [];
      var index = 0;
      //遍历数组，挨个比较，和value相等，将该元素的下标添加到indexes中
      for (let i = 0; i <LEN ; i++) {
          if(arr[i] ===  value){
              indexes[index ++] = i;
          }
      }
      return indexes;
  }

  var arr = getRandomArray (20, 0, 10);
  console.log (arr);
  console.log (max (arr));
  console.log (counterValue(arr,7));
  console.log (counterIndexes(arr,7));

</script>
</body>

打酱油的女孩子

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
初识javaScript（六）数组(一)

数组1引入数组2 数组的定义和特点3 in关键字介绍4 数组的length属性5 数组的初始化方式6 数组的元素的操作7 数组传引用8 数组的遍历9 类数组对象介绍10 数组练习1引入数组需求：随机得到10个学生的分数。然后求学生的总分和平均分。<body><script> const COUNT = 10; const MIN_SCORE = 60; const MAX_SCORE = 101; //定义数组,空数组。 var scores
复制链接

扫一扫

专栏目录