JS常用对象

发芽吧

于 2022-11-28 15:23:53 发布

阅读量87

点赞数

文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/qq_46134223/article/details/127916375

版权

前言

又搁置了好久才继续学JS，前面学习了JS一些最基础的语法点，接下来学习JS中的常用对象之一数组，包括数组的创建以及数组的一些常用方法等

正文

一.数组对象

JS是弱类型语言,在JS开发中，经常使用数组来存储一些数据，数组也是对象的一种。在JS中支持数组存储不同类型的值，但大多数时候都是相同类型值的集合。数组内的各个值被称作元素，每一个元素都可以通过索引（下标）来快速读取。

下面来简单了解数组的创建，遍历以及数组常用的一些方法。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
/* 
数组的创建有两种方法，第一种：var arr = new Array();（使用对象创建）
                    第二种：var arr = [1, 2];（使用字面量创建）

 */
      var arr = new Array();
            arr[0] = 1;
            arr[1] = 2;
            arr[2] = 3;
    //用FOR循环来遍历数组
    for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
   //用FOReach来遍历数组，此方法只支持IE8以上的浏览器
    //第一个参数：就是当前正在遍历的元素
    //第二个参数：就是当前正在遍历的元素的索引
    //第三个参数：就是正在遍历的数组
  /*  arr.forEach(function (value, index, obj) {
    console.log(value + " #### " + index + " #### " + obj);
}); */
}
/* 
数组的属性
 */
console.log(arr.constructor);//constructor属性演示：返回创建数组对象的原型函数
console.log(arr.length);//length属性演示：设置或返回数组元素的个数

/* 
数组方法
 */

  //向数组的末尾添加一个或多个元素，并返回数组的新的长度:push
    var arr = ["香蕉", "苹果", "梨子"];
    var result = arr.push("水蜜桃", "火龙果");
    console.log(arr);
    console.log(result);
  //删除数组的最后一个元素，并将被删除的元素作为返回值返回:pop
    var arr = ["香蕉", "苹果", "梨子"];
    var result = arr.pop("水蜜桃", "火龙果");
    console.log(arr);
    console.log(result);
  //
   //将新元素加入到数组，并返回新的数组长度：unshift
    var arr = ["孙悟空", "猪八戒", "沙和尚"];
    var result = arr.unshift("牛魔王", "二郎神");
    console.log(arr);
    console.log(result);
   //删除数组的第一个元素，并将被删除的元素作为返回值返回：shift
   var arr = ["1","2","3"];
   var result = arr.shift();
   console.log(arr);
   console.log(result);
   //从数组提取指定元素，该方法不会改变元素数组，而是将截取到的元素封装到一个新数组中返回:slice
   //第一个参数：截取开始的位置的索引，包含开始索引
   //第二个参数：截取结束的位置的索引，不包含结束索引，第二个参数可以省略不写，此时会截取从开始索引往后的所有元素
   //注意：索引可以传递一个负值，如果传递一个负值，则从后往前计算，-1代表倒数第一个，-2代表倒数第二个。
   var arr = ["孙悟空", "猪八戒", "俞","ty", "偶偶", "图"];
   var result = arr.slice(0, 2);
   console.log(arr);
   console.log(result);
   //删除数组中的指定元素，该方法会影响到原数组，会将指定元素从原数组中删除，并将被删除的元素作为返回值返回:splice
   //第一个参数：表示开始位置的索引
   //第二个参数：表示要删除的元素数量
   //第三个参数及以后参数：可以传递一些新的元素，这些元素将会自动插入到开始位置索引前边
   var arr = ["香蕉", "苹果", "梨子","水蜜桃", "火龙果"];
   var result = arr.splice(1,3,"龙眼","西瓜","菠萝");
   console.log(arr);
   console.log(result);
   //连接两个或多个数组，并将新的数组返回，该方法不会对原数组产生影响:concat
   var arr1 = ["香蕉", "苹果", "梨子","水蜜桃", "火龙果"];
   var arr2 = ["孙悟空", "猪八戒", "俞"];
   var result = arr.concat(arr1,arr2);
   console.log(arr1);
   console.log(arr2);
   console.log(result);
  //将数组转化为字符串，对原数组不会产生影响，将转换后的字符串作为结果返回：join
  //在join方法中，可以指定一个字符串作为参数成为数组元素的连接符，如未指定参数，则默认使用“，”作为连接符
  var arr = ["蛋糕", "水果", "饮料"];
  var result = arr.join("@-@");
  console.log(result);
  var arr = ["蛋糕1", "水果1", "饮料1"];
  var result = arr.join();
  console.log(result);
 //将数组反转,该方法会改变原数组：reverse
   var arr = ["蛋糕2", "水果2", "饮料2"];
   var result = arr.reverse();
   console.log(result);
 //将数组中元素进行排序：sort
 //该方法会影响原数组，默认按照Unicode编码进行排序
   var arr = ["蛋糕3", "水果3", "饮料3"];
   var result = arr.sort();
   console.log(result);
   var arr = ["d", "c", "f"];
   var result = arr.sort();
   console.log(result);
 </script>
</body>
</html>

实现结果如下：