工作中对于数组的应用 -- 转换、截取、移动、新增、求和

本文链接：https://blog.youkuaiyun.com/weixin_37064409/article/details/82501195

本文分享了作者在实际工作中使用数组的多种操作技巧，包括数组的创建、修改、转换以及数组中元素的移动和求和等关键操作。通过具体示例，如拨码开关状态存储、数组与字符串的相互转换、数组元素的循环移动等，详细展示了JavaScript中数组操作的具体实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近荒废了，没有写博客。今天上线突然发现有1W+的阅读量了，希望我真的能够帮助到别人。

记录下我在实际工作中用到的数组的操作。

举个例子：
这里写图片描述

图示功能是这样的：
1. 开关在哪个档位，对象档位上的数据允许发送开关状态存储在数组上
2. 拨码开关上的状态是存储在数组中的在上为1在下为0
3. 下拉选框中的数值更改及拨码开关显示
4. 左右移动即存储在数组中的数值循环移动

字符串转换为数组1

拨码开关中的每个按钮都可以点击，1/0切换状态并记录在DOM上。
每次点击都循环获取该组数据即可。

    var arr = [];  // 用于存放该组数据
    $(selector).each(function(){
        var sign = parseInt($(this).attr("sign"));
        arr.push(sign);
    })
    // 注意： push操作在数组中的存放位置为末尾

    arr // [1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]

字符串转换为数组2

直接将字符串转为数组

 var str = '010101010011';
 str.split('').map(item=> +item)

// 先分割然后遍历强制想转换
// arr    [0, 1, 0, 1, 0, 1, 0, 1, 0, 0, 1, 1]

数组转为字符串

与后台交互需要为数值类型， 需要将二进制转为十进制 即1010转为10

    var val = parseInt(arr.join(''), 2)
    // join()操作 可以将数组转化为字符串  
    // parseInt(str,2) 可以将字符串中的数字作为二进制转化后输出

数组中移动

例子中将数字左移右移操作，就是将数组中的第一位删除，然后将删除掉的元素加到数组末尾
比如： 左移操作

    var arr = [1,0,0,0,0,0]
    //记录第一位数
    var value = arr[0]
    // 删除第一个元素并保存  注意这里返回的数据是删除的数据类型是数组而不是原数据arr
    arr.splice(0,1);
    // 将删除数据添加到最后一位
    arr.splice(arr.length,0,value)
    // [0, 0, 0, 0, 0, 1]

Array.splice() 方法用于插入、删除或替换数组的元素。
array.splice(index,howmany,item1,.....,itemX)
index 从第几位开始删除，
howmany 删除多少 可以为0
items 需要添加到该位置的元素

数组中求和

举个例子：

这里写图片描述

案例中：第一个旋钮仅做展示用不可操作，
2~6旋钮最大值不可操作 255
将旋钮数据保存在数组中，每次执行旋钮操作时判断值是否大于255即可

    var arr = [10,20,30,40]
    // 第一种方式 reduce
    arr.reduce((total,curVal) => total+curVal)

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
total 初始值
currentValue 循环中的当前数据
currentIndex 循环中的当前index
arr 当前数组

暂时就这些，遇到再总结