• 【JavaScript-数组全家福】


    目录

    前言

    数组

    1.创建 new Array数组

    2.检测是否为数组

    1.使用instanceof检测是否为数组

     2.使用Array.isArray()来检测

    3.添加删除数组方法

    4.筛选数组

    5.数组排序

    6.数组索引方法

     7.数组去重

    8.数组转字符串

     写在最后


     

    前言

    博主是👦一个帅气的boy,你可以叫我山鱼君
    Aic山鱼的个人主页:Aic山鱼的个人主页

    如果这篇文章对你有帮助的话希望三连下👍⭐✍支持一下博主

    Aic山鱼

    a6aeee771b8b4a92b42be65c6ee920d3.png

     

    数组

    1.创建 new Array数组

    数组可以直接使用字面量创建,也可以使用new Array进行创建,今天主要使用的是new Array

    1. <script>
    2. // 利用数组字面量创建数组
    3. var arr = [1,2,3,4];
    4. console.log(arr);
    5. // 创建空数组
    6. var arr0 = new Array();
    7. // 利用new Array来创建数组
    8. var arr1 = new Array(5);//表示这个数组的长度为5,而并不是这个里面的值是5
    9. console.log(arr1);
    10. var arr2 = new Array(1,2,3,4);//若要在里面盛放数组,则需要添两个及以上的数组哦
    11. console.log(arr2);
    12. console.log(arr1 instanceof Array);
    13. script>

     24be52c1b42e4dd6969800305ec6a57f.png

    2.检测是否为数组

    如何来检测呢?

    1.使用instanceof检测是否为数组

    1. <script>
    2. // 利用数组字面量创建数组
    3. var arr = [1,2,3,4];
    4. console.log(arr);
    5. // 创建空数组
    6. var arr0 = new Array();
    7. // 利用new Array来创建数组
    8. var arr1 = new Array(5);//表示这个数组的长度为5,而并不是这个里面的值是5
    9. console.log(arr1);
    10. var arr2 = new Array(1,2,3,4);//若要在里面盛放数组,则需要添两个及以上的数组哦
    11. console.log(arr2);
    12. console.log(arr1 instanceof Array);
    13. script>

     d72edb2d74f249559283b44daa06d8ce.png

     2.使用Array.isArray()来检测

    1. <script>
    2. // 2.利用Array.isArray来检测是否为数组
    3. var arr = [];
    4. var arr1 = {};
    5. console.log(Array.isArray(arr1));//返回值为false
    6. console.log(Array.isArray(arr));//返回值为true
    7. script>

    013b6085e3e54a79a2744481d7572ff7.png

    3.添加删除数组方法

    2aecc75e993245899bc7ab5f12e54cba.png

     push对应pop,unshift对应shift

    1. <script>
    2. // push()在数组的末尾添加新元素
    3. var arr = [1,2,3,4];
    4. arr.push(5,6);//在数组后面添加新的数组元素
    5. console.log(arr);//返回值为[1, 2, 3, 4, 5, 6]
    6. console.log(arr.push());// push的返回值是新数组的长度
    7. // unshift(),在数组的前面添加新元素
    8. arr.unshift('山鱼');// 在数组前面添加一个新数组元素
    9. console.log(arr);// 返回值为['山鱼', 1, 2, 3, 4, 5, 6]
    10. console.log(arr.unshift());// 返回新的数组长度 7
    11. // pop删除数组元素(删除最后一个,一次只能删除一个)
    12. arr.pop();// 删除最后一个数组
    13. console.log(arr);// 返回值为[1, 2, 3, 4, 5]
    14. console.log(arr.pop());// pop的返回值为
    15. // shift 删除数组的第一个元素 一次只能删除一个
    16. arr.shift();// 删除第一个元素
    17. console.log(arr); // 返回值为[1, 2, 3, 4]
    18. console.log(arr.shift()); // 返回值为所删除的数组元素
    19. script>

    4.筛选数组

    利用push来进行实现

    1. <script>
    2. // 筛选出小于1000的数组元素
    3. // 方法1
    4. var arr = [100,3000,2322,90,999];
    5. var newArr = [];
    6. for(var i = 0;i < arr.length;i++){
    7. if(arr[i]<1000){
    8. newArr[newArr.length] = arr[i];
    9. }
    10. }
    11. console.log(newArr);
    12. // 方法2 ,直接用push添加到新数组中
    13. var arr1 = [100,3000,2322,777,888];
    14. var newArr1 = [];
    15. for(var i = 0;i < arr1.length;i++){
    16. if(arr1[i]<1000){
    17. newArr1.push(arr1[i])
    18. }
    19. }
    20. console.log(newArr1);
    21. script>

    5.数组排序

    利用sort进行数组的排序,多位数可以进行sort的深度使用

    1. <script>
    2. // 1.数组反转
    3. var arr = [1,2,3,4,5];
    4. arr.reverse();
    5. console.log(arr);
    6. //2.数组冒泡排序 注:sort的冒泡排序仅限于个位数
    7. var arr1 = [2,5,3,9,1,0];
    8. arr1.sort();
    9. console.log(arr1);
    10. // 3.怎么才能用sort进行多位数组的排序呢?其实在sort中有一个固定的用法就是下面这么用
    11. var arr2 = [11,21,23,434,554,0];// 如果只用sort肯定会乱序,所以要用到下面这个
    12. arr2.sort(function(a,b){
    13. return a - b; // 按照升序进行排序,如果是b - a那么就是按照降序进行排序
    14. })
    15. console.log(arr2);
    16. script>

    6.数组索引方法

    b06b462105b648628d2042e8382844fa.png

     具体使用方法

    1. <script>
    2. // 获取第一个索引下标
    3. // indexOf() 的作用就是返回数组元素的索引号
    4. var arr = ['山鱼','潘安','唐伯虎'];
    5. console.log(arr.indexOf('山鱼'));// 返回的索引下标为0
    6. // 如果有俩相同的值呢?
    7. var arr1 = ['山鱼','潘安','唐伯虎','山鱼'];
    8. console.log(arr1.indexOf('山鱼'));// 会返回靠前的那个数组元素的索引号哦!
    9. // 如果没有所查找的数组元素呢?
    10. console.log(arr1.indexOf('李逵'));// 如果没有所查找的数组元素,则返回-1
    11. // 获取最后一个索引下标
    12. console.log(arr1.lastIndexOf('山鱼'));// 返回值为3
    13. console.log(arr.lastIndexOf('李逵'));// 如果没有所查找的数组元素,则仍然返回-1
    14. script>

     7.数组去重

    1.目标:把旧数组里面不重复的元素选取出来放到新数组中,重复的元素只保留一个,放到新数组中去重。 2.核心算法:先遍历旧数组,然后拿着旧数组元素去查询新数组,如果该元素在新数组里面没有出现过就添加,否则就不添加。3.利用indexOf()来实现,如果返回值为-1,那么就说明里面没有该数组元素,就把没有的值放到新数组中。

    1. <script>
    2. function unique (arr) {
    3. var newArr = [];
    4. for(var i = 0; i < arr.length;i++){
    5. if(newArr.indexOf(arr[i]) === -1){
    6. newArr.push(arr[i]);
    7. }
    8. }return newArr;
    9. }
    10. var firstArr = unique([1,2,3,4,5,3,2,12,1,4,0]);
    11. console.log(firstArr);
    12. script>

     这里的  newArr.push(arr[i])  也可以换成  newArr[newArr.length] = arr[i]  

    8.数组转字符串

    5cf7a997d17643a49f73ce0655988ecc.png

     一般使用join()的比较多

    1. <script>
    2. // 用toString进行转换
    3. var arr = [1,2,3];
    4. console.log(arr.toString());
    5. // join(分隔符)join()如果括号里什么都不写,默认的是逗号
    6. console.log(arr.join('、'));
    7. script>

    fee14ef63991433699a8b878fa20374a.png

     写在最后

    原创✨:还希望各位大佬支持一下
    点赞👍:您的赞赏是我前进的动力!
    收藏⭐:您的支持我是创作的源泉!
    评论✍:您的建议是我改进的良药!

    山鱼🦈的社区:欢迎大家-山鱼社区 !

     

  • 相关阅读:
    计算机网络笔记
    map和set
    leetcode 71. 简化路径
    Flink之转换算子Transformation
    [modern c++] 函数式编程与 std::ref
    游戏滚动列表的优化(降低drawcall从154降低到14,图片大小,界面逻辑)
    【JAVA程序设计】(C00083)基于SSM+uniapp好物分享小程序及管理系统-有文档
    WPF 项目开发入门(五)ListView列表组件 与 Expander组件
    Profinet转TCP协议转换网关Step7软件配置方法
    ArcGIS:如何利用站点数据(例如臭氧)进行克里金插值得到连续臭氧表面?
  • 原文地址:https://blog.csdn.net/zhaochen1127/article/details/126683159