9.数组

最新推荐文章于 2023-05-29 09:15:04 发布

Keeling1720

最新推荐文章于 2023-05-29 09:15:04 发布

阅读量92

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/weixin_44741023/article/details/113059255

版权

JavaScript 专栏收录该内容

32 篇文章 3 订阅

订阅专栏

文章目录

数组的栈方法和队列方法

<!DOCTYPE html>
<html lang="UTF-8">
<head>
    <meta charset="UTF-8">
    <title>数组常用的方法</title>
</head>
<body>
    <script type="text/javascript">
        //Array（数组）的定义
        //let colors = new Array('red', 'blue', 'green');
        let colors = ['red', 'blue', 'green'];
        //使用'|'分割字符串然后合并成一个String给a
        let a = colors.join('|');
        console.log(a);

        //栈lifo，先进后出 push() pop队列方法
        //push()往数组的末尾加数据
        let newlength = colors.push('orange');
        console.log('The length is '+newlength);
        console.log(colors);
        //pop()把数组的末尾弹出
        let lastItem = colors.pop();
        console.log(lastItem);
        console.log(colors);

        //队列，先进先出 shift() 和 unshift()
        //unshift()放进队列的头
        newlength = colors.unshift('yellow');
        console.log(newlength);
        console.log(colors);
        //shift()把队列的头取出，yellow
        //let firstItem = colors.shift();
        console.log(firstItem);

        console.log(colors);

    </script>
</body>
</html>

数组的排序

<!DOCTYPE html>
<html lang="UTF-8">
<head>
    <meta charset="UTF-8">
    <title>数组方法</title>
</head>
<body>
    <script type="text/javascript">
        let values = [0, 2, 10, 8, 7, 5, 1];
        //reverse() 倒序
        values.reverse();
        console.log(values);
        //sort() 排序，升序、降序
/*        //这里直接升序是按照字符比较的，也就是1，10会比2排得靠前
        values.sort();
        console.log(values);*/
        //正确得升序的写法
        function compareUp(a, b) {
            /*
            if (a < b){
                return -1;
            }else if (a > b){
                return 1;
            }else {
                return 0;
            }*/
            return a - b;
        }
        //正确的降序的写法
        function compareDown(a, b){
/*            if (a < b){
                return 1;
            }else if (a > b){
                return -1;
            }else {
                return 1;
            }*/
            return b - a;
        }
        values.sort(compareUp);
        console.log(values);
        values.sort(compareDown);
        console.log(values);
    </script>
</body>
</html>

数组的操作方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数组的操作方法</title>
</head>
<body>
    <script type="text/javascript">
        //操作方法
        //1.concat() 数组合并
        let colors = ['red', 'green'];
        let newColors = colors.concat('blue');
        console.log(newColors);
        //数组的合并还可以这么用：
        newColors = colors.concat('blue',{name:"Mike",age:18},['orange', 'pink']);
        console.log(newColors);

        //2.slice() 数组切割，返回切割后的数组
        //一个参数表示切除后从第n个开始
        newColors = newColors.slice(1);
        console.log(newColors);
        //两个参数则表示切片，比如(m,n)，那么切出来的就是(m —— n-1)
        newColors = newColors.slice(1,3);
        console.log(newColors);
        //参数也可以是负数，倒数第一个是-1（其实就类似于python的切片）
        newColors = newColors.slice(-2,-1);
        console.log(newColors);

        //3.splice() 删除、插入、替换
        //3.1.删除
        let names = ['zhangsan', 'lisi', 'wangwu', 'liliu'];
        //删除，第一个参数0表示从0开始，第二个参数2表示删除两个数据
        names.splice(0,2);
        console.log(names);

        //插入,第一个参数1表示从1开始，第二个参数0表示删除0个数据，第三个参数开始都是插入的数据。
        names.splice(1,0,'sunwukong', 'zhubajie');
        console.log(names);

        //替换,第一个参数表示从0开始，第二个参数表示删除一个数据，第三个数据则是插入的数据，如此就实现了替换功能
        //如果要替换其他的，那么只需要更改开始位置即可
        //如果要替换多个，也只需要定位到相应位置，删除后再插入新的数据来做到替换即可
        names.splice(0,1,'王小二');
        console.log(names);
    </script>
</body>
</html>
## 数组的迭代方法

数组的迭代方法

<!DOCTYPE html>
<html lang="UTF-8">
<head>
    <meta charset="UTF-8">
    <title>数组的迭代方法</title>
</head>
<body>
    <script type="text/javascript">
        //迭代方法
        //1.filter
        let numbers = [1,2,3,11,12,13,20,99];
        //function中item是每个数据，index是他的索引，也就是他的位置（从0开始），array是原数组
        let filterResult = numbers.filter(function (item, index, array) {
/*
            //想要看的话可以取消注释
            console.log(item);
            console.log(index);
            console.log(array);*/
            return item > 10;
        });
        console.log(filterResult);

        //2.map
        let mapResult = numbers.map(function (item, index, array) {
            return item * 2;
        });
        console.log(mapResult);

        //3.forEach()
        numbers.forEach(function (item, index) {
            console.log(index+": "+item);
        });

        //4.使用for语句逐个遍历
        for (let i = 0; i < numbers.length; i++){
            console.log(numbers[i]);
        }
    </script>
</body>
</html>

map方法的应用

<!DOCTYPE html>
<html lang="UTF-8">
<head>
    <meta charset="UTF-8">
    <title>map方法的应用</title>
</head>
<body>
    <script type="text/javascript">
        let oldArray = [
            {
                name:'张三',
                age:17
            },
            {
                name:'李四',
                age:18
            },
            {
                name:'王五',
                age:20
            }
        ];
        //现在我们分别取所有对象的name和所有对象的age
        let newNames = oldArray.map(function (item, index) {
            return item.name;
        });
        let newAges = oldArray.map(function (item, index) {
            return item.age;
        });
        console.log(newNames);
        console.log(newAges);
    </script>
</body>
</html>

Keeling1720

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
9.数组

文章目录数组的栈方法和队列方法数组的栈方法和队列方法<!DOCTYPE html><html lang="UTF-8"><head> <meta charset="UTF-8"> <title>数组常用的方法</title></head><body> <script type="text/javascript"> //Array（数组）的定义
复制链接

扫一扫