JS中的常见数组方法和循环

最新推荐文章于 2024-05-24 23:45:01 发布

强生健体竺天菜

最新推荐文章于 2024-05-24 23:45:01 发布

阅读量175

点赞数 1

分类专栏：前端文章标签： javascript 前端

本文链接：https://blog.csdn.net/weixin_72724407/article/details/126021410

版权

前端专栏收录该内容

7 篇文章 1 订阅

订阅专栏

数组

定义：具有相同数据类型的一个或多个值的集合

数组的创建

1、创建数组 new 对象，下标赋值

let arr = new Array(5);
    arr[0] = "html";
    arr[1] = "css";
    arr[2] = "js";
    arr[3] = "vue";
    arr[4] = "wechat";
   console.log(arr);

2、创建数组 new 对象，创建时直接赋值

let arr = new Array("HTML","CSS",'JS',"VUE","WECHAT");
console.log(arr);

3、字面量创建数组

let arr = ["html","css","js","vue","java"];
    console.log(arr);

数组常用方法和属性

属性

length ：设置或返回数组中元素的数目

方法

join( )：把数组的所有元素放入一个字符串，通过一个的分隔符进行分隔

let arr = ["html","css","js","wechat",true,false,18];
    console.log(arr);
    // alert(Array.isArray(arr));
    let newstr = arr.join("+");
    console.log(newstr,typeof(newstr));

sort()：对数组排序

     arr.sort(function(a,b){
        //return a-b;  //正序
        return b-a;  // 倒序
    });

    console.log(arr);

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

 let arr = ["html","css","js","wechat"];
    //向数组末尾追加元素
    //arr.push("java","mysql","linux");

pop()：删除数组末尾元素,返回值是删除元素

let arr = ["html","css","js","wechat"];
 console.log(arr.pop());
     console.log(arr);

unshift()：向数组头部添加元素，返回新数组的长度

let arr = ["html","css","js","wechat"];
console.log(arr.unshift("周三","周四"));

shift()：删除数组头部元素，删除原数组第一项，返回删除数组元素；如果数组为空返回undefined

let arr = ["html","css","js","wechat"];
console.log(arr.shift());
console.log(arr);

splice()：数组万能方法，删除、添加、替换都可以进行

let arr = ["html","css","js","wechat"]; 
//删除任意位置元素
    arr.splice(1,2);
 //替换任意位置元素
    arr.splice(1,1,"csssssss");
 //新增元素
    arr.splice(5,3,"java","mysql","linux","spring");

    console.log("新数组",arr);

循环

定义：循环就是在满足条件的情况下，去不断重复的执行某一个操作。

1、for循环下标 / key / 键【已知条件，已知范围（先判断，后执行）】

for (初始部分; 循环条件; 条件迭代) { //循环执行的语句 }

for(let i = 0; i < arr.length;i++){
        document.write(arr[i]+"<br/>");
    }

2、 while()循环下标 / key / 键【未知条件，未知范围（先判断，后执行）】

//初始部分

while( 循环条件 ) {

//循环操作

//迭代部分 }

let i = 0;
    while(i < arr.length){
        document.write(arr[i]+"<br/>");
        i++;
}

3、do while()循环下标 / key / 键【至少执行一次（先执行，后判断）】

 let i = 0;
    do{
        //循环代码块
        document.write(arr[i]+"<br/>");
        i++;
    }

    while(i < arr.length);

4、for of() 循环值 / value / 元素【循环遍历数组】

for(let value of arr){
        document.write(value+"<br/>");
    }

5、 for in() 循环下标 / key / 键

 for(let i in arr){
        document.write(arr[i]+"<br/>");
    }

6、 forEach() 数组方法匿名回调函数

arr.forEach(function(value,index,oldarr){
   document.write(index+"------"+value+"------"+oldarr+"<br/>");
  });

7、 map() 数组方法，有返回值，返回了一个新的和老数组长度一定一致新数组，新数组有可能是二维数组

     let newarr = arr.map(function(value,index,oldarr){
        document.write(index+"---"+value+"----"+oldarr+"<br/>");
        
        if(index == 0){
            value = "123456";
        }
        return [value];
    });

    console.log(newarr);

8、flatMap() 数组方法，有返回值.返回了一个新的和老数组长度有可能不一致新数组，新数组一定是一维数组

    console.log(arr);

    let newarr = arr.flatMap(function(value,index,oldarr){
        document.write(index+"---"+value+"----"+oldarr+"<br/>");
        if(index == 0){
            value = "123456";
        }
        return [value,index];
    });

    console.log(newarr);