JavaScript学习笔记四——数组对象

最新推荐文章于 2024-04-03 12:33:59 发布

yoghurt&girl

最新推荐文章于 2024-04-03 12:33:59 发布

阅读量707

点赞数 2

分类专栏： JavaScript web前端开发文章标签：学习

本文链接：https://blog.csdn.net/ywforever/article/details/126726056

版权

web前端开发同时被 2 个专栏收录

25 篇文章 0 订阅

订阅专栏

JavaScript

11 篇文章 1 订阅

订阅专栏

一、数组对象

1、数组的使用

//利用new创建数组
var arr=new Array()   //创建空数组

//利用数组字面量创建数组
var arr=[]        //创建空数组
var arr1=[1,2,'哈哈哈',true]

// 获取数组元素

console.log(arr1[2])

2、数组元素的增加和删除

1、push() 在数组末尾添加一个或多个数组元素

2、unshift() 在数组开头添加一个/多个数组元素

3、shift() 删除数组的第一个元素

4、pop() 删除数组的最后一个元素

   //1.push() 在数组末尾添加一个或多个数组元素
        var arr = [1, 2, 4]
        arr.push(3, 'xhh')
        console.log(arr);
        console.log(arr.push(4));//返回新数组的长度

        //2.unshift 数组开头添加一个/多个数组元素
        arr.unshift('pink');
        console.log(arr);
        //3.pop 删除数组最后一个数组元素
        arr.pop()
        console.log(arr);
        console.log(arr.pop());
        //4.shift 删除数组的第一个元素
        arr.shift('tt')
        console.log(arr);
        console.log(arr.shift());

3、数组排序

方法	说明
reverse()	颠倒数组中元素的顺序，无参数
sort()	对数组的元素进行排序

 var arr = ['hh', 23, 520, 'blue']
        arr.reverse();
        console.log(arr);
        var arr1 = [1, 4, 6, 10, 3, 5, 20]
        arr1.sort()
        console.log(arr1);
        arr1.sort(function (a, b) {
            return a - b;
        })
        console.log(arr1);

4、数组索引

1、indexof（）返回数组元素的索引号

（1）只返回第一个满足条件的索引号

（2）如果元素在数组里找不到，则返回-1

2、lastindexof（）从后面开始查找，返回结果的索引号

        var arr = ['hh', 23, 520, 'blue', 520, 5201]
 console.log(arr.indexOf(52));
        console.log(arr.indexOf(520));
 console.log(arr.lastIndexOf(520));

5、数组去重

  //数组去重
        function unique(arr) {
            var newArr = [];
            for (var i = 0; i < arr.length; i++) {
                if (newArr.indexOf(arr[i]) === -1) {
                    newArr.push(arr[i])
                }
            }
            return newArr;
        }
        var demo = unique(['c', 'b', 'c', 'x', 'e', 'b', 'a'])
        console.log(demo);

二、求某字符的位置及次数

案列展示：求o在字符串中的位置和次数

<!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>
        // 求'O'出现的位置及次数
        var arr = "abcoefoxyozzopp";
        var index = arr.indexOf('o');
        var num = 0;
        var indexStr = '';
        while (index != -1) {
            console.log(index);//这步可以省去
            indexStr += index + ',';
            num++;
            index = arr.indexOf('o', index + 1);
        }
        console.log("o出现的位置有" + indexStr);
        console.log("o出现的次数为:" + num);

  </script>

</body>

</html>

案列二：求red在数组中的次数和位置，同理，所以以后如果遇到让我们求某字符的位置和次数都可以用这个模板，当然也可以有其他做法，这里我们采用的是用indexof索引的方法

<!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>red位置和次数</title>
</head>

<body>
    <script>

//求red出现的位置和次数
        var arr = ['red', 'blue', 'red', 'green', 'pink', 'red']
        var index = arr.indexOf('red')
        var num = 0;
        var indexStr = ''
        while (index != -1) {
         
            indexStr += index + ',';
            num++;
            index = arr.indexOf('red', index + 1)

        }
        console.log('出现的位置' + indexStr);
        console.log('red出现的次数是：' + num);

  </script>

</body>

</html>

三、根据位置返回字符

有三种方法：

1、charAt(idnex)

2、charCodeAt（index）

3、str[index] H5新增的

     //根据位置返回字符
        //1.charAt(index) 根据位置返回字符
        var str = 'andy'
        console.log(str.charAt(3));
        //遍历所有字符
        for (let i = 0; i < str.length; i++) {
            console.log(str.charAt(i));
        }

        //2.charCodeAt（index）返回相应索引号的字符ASCII码 目的：判断按下哪个键
        console.log(str.charCodeAt(2));//d-100
        //3.str[index]  H5新增的
        console.log(str[0]);

统计出现次数最多的字符-（来源黑马程序员）

    var str = 'abcoefoxyozzopp'
        var o = {}
        for (var i = 0; i < str.length; i++) {
            var chars = str.charAt(i)//chars是字符串中的每一个字符
            if (o[chars]) {//得到的是属性值
                o[chars]++;
            } else {
                o[chars] = 1
            }
        }
        console.log(o);

综合案列：【来源于黑马程序员】

<!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>
        //根据位置返回字符
        //1.charAt(index) 根据位置返回字符
        var str = 'abaascdffggghhijkkgfddsssss3444343'

        var o = {}

        document.write('1.字符串的长度为：' + str.length + '<br>');
        document.write('2.取出指定位置的字符：')
        for (var i = 0; i < str.length; i++) {
            //取出0 3 5 9对应的字符
            if (i == 0 | i == 3 | i == 5 | i == 9) {
                document.write(i + '位置的字符是：' + str[i] + ',')
                console.log(i + '位置的字符是：' + str[i]);
            }
            //生成o数组，形成o.[a-字符串]=?
            var chars = str.charAt(i);

            if (o[chars]) {
                //用于判断o数组里是否存在chars元素，有的话就加1，没有就创建一个（这也说明它只出现了一次）
                o[chars]++;
            } else {
                o[chars] = 1;
            }
        }

        document.write('<br>' + '3.是否存在以上字符串：i c b')
        //判断icb是否存在字符串中，由于查找模式一样，所以我们可以采用函数的形式，以此简化代码
        function look(x) {
            if (str.indexOf(x) !== -1) {
                return x + '该字符存在！'
            } else {
                return x + '该字符不存在！'
            }
        }
        //调用函数并打印结果
        var x = look('i')
        var y = look('c')
        var z = look('b')
        console.log(x);
        console.log(y);
        console.log(z);
        document.write(':' + x + y + z)
        //替换指定的字符串，replace只能替换一次，借助循环
        while (str.indexOf('g') !== -1) {

            str = str.replace('g', 22)
        }
        console.log(str);
        while (str.indexOf('s') !== -1) {
            str = str.replace('s', 'b')
        }
        console.log(str);
        document.write('4.替换指定的字符串：' + str)
        document.write('<br>5.截取指定的字符1-5：' + str.substr(1, 5))
        console.log(o);
        //找出字符串中出现最多的字符及次数
        var max = 0;
        var ch = '';
        for (var k in o) {
            if (o[k] > max) {
                max = o[k];
                ch = k
            }
        }
        console.log('出现次数最多的是：' + max + '，最多的字符为：' + ch);
        document.write('<br>6.找出以上字符串中出现次数最多的字符以及次数：' + ch + ' , ' + max)

    </script>

</body>

</html>

yoghurt&girl

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
JavaScript学习笔记四——数组对象

2、lastindexof（）从后面开始查找，返回结果的索引号。2、unshift() 在数组开头添加一个/多个数组元素。1、push() 在数组末尾添加一个或多个数组元素。1、indexof（）返回数组元素的索引号。（2）如果元素在数组里找不到，则返回-1。3、shift() 删除数组的第一个元素。4、pop() 删除数组的最后一个元素。（1）只返回第一个满足条件的索引号。3、str[index] H5新增的。
复制链接

扫一扫