WPS JS宏编程教程（从基础到进阶）-- 第五部分：JS数组与WPS结合应用

摘要

本章深入探讨了 JavaScript 数组在 WPS 表格自动化中的高级应用，旨在帮助读者掌握数组操作的核心技巧，轻松处理复杂数据并提升工作效率。通过详细的代码示例和逐行解析，本章内容涵盖了数组的归并、打平、合并、切片、排序以及综合应用等多个方面。

首先，介绍了 reduce 方法的强大功能，它能够将数组中的所有元素归并为一个单一值，适用于求和、求平均值、求最大值和最小值等场景。通过实例代码，展示了如何利用 reduce 对数组进行高效计算，例如统计销售额总和、计算平均分以及筛选极值记录。

接着，探讨了如何使用 flat 和 flatMap 方法将嵌套数组打平为一维数组，这对于处理多层嵌套数据（如二维表格）非常实用。通过示例代码，展示了如何将复杂的嵌套结构简化为一维数组，以便后续操作。

此外，还详细讲解了 concat 方法的使用，用于将多个数组或值合并为一个新数组。这一方法在合并多列数据或扩展数组时尤为高效。通过实例，展示了如何利用 concat 实现数组的灵活合并。

在数组元素的添加与删除部分，介绍了 push、pop、unshift 和 shift 方法的使用，分别实现了栈（后进先出）和队列（先进先出）的操作。通过代码示例，展示了如何利用这些方法动态管理数组数据。

本章还重点介绍了 slice 方法的灵活应用，用于从数组中提取子数组。通过实例，展示了如何利用正索引、负索引或混合索引提取特定范围的数据，适用于数据分析和展示场景。

最后，通过多个综合实例，展示了如何将这些方法结合使用，解决实际工作中的复杂问题。例如，如何从多列数据中筛选满足条件的记录并排序，如何将不规范数据整理为结构化数据，以及如何从字符串中提取最大值记录等。这些实例不仅展示了数组方法的强大功能，还提供了实际操作的完整流程。

通过学习本章内容，读者将能够熟练掌握 JavaScript 数组在 WPS 表格中的高级应用，轻松应对各种数据处理需求，显著提升工作效率。无论是初学者还是有一定基础的开发者，都能从这些实用技巧中获益匪浅。

---

所有章节教程word文件可以点击如下链接获取
wps-excel办公+JS宏编程教程基础到进阶+函数使用手册

第5章 JS数组与WPS结合应用

---

5-1 JS数组的核心特性

数组是JavaScript中用于存储有序数据的核心结构，其特性决定了它在WPS表格自动化中的高效性。

核心特性解析

1. 动态性：数组长度可自由扩展或收缩，无需预定义大小。
2. 元素多样性：支持任意类型数据（数字、字符串、对象、甚至嵌套数组）。
3. 索引机制：元素位置从0开始编号，支持快速随机访问。
4. 稀疏性：允许存在空元素（如[1,,3]），节省内存空间。
5. 一维本质：JS只有一维数组，但可通过嵌套模拟多维结构。

---

5-2 数组的两种创建方式（字面量与扩展操作符）

1. 字面量创建

function test1() {
   
    var arr1 = [];               // 空数组
    var arr2 = ["张三", 24, 100]; // 混合类型元素
    var arr3 = [78, , 12];       // 稀疏数组（中间空元素）
}

注释：

• arr1：空数组，常用于初始化。
• arr2：包含字符串、数字、甚至表达式的动态数组。
• arr3：稀疏数组，第二个元素未定义（显示为empty）。

2. 扩展操作符创建

function test2() {
   
    var arr1 = [1, 2, 3];
    var arr2 = [...arr1];        // 复制数组：[1,2,3]
    var arr3 = [..."12345"];     // 字符串转数组：["1","2","3","4","5"]
    var arr4 = [...arr3, 6, 7];  // 合并数组：["1","2","3","4","5",6,7]
}

解析：

• ...操作符可将可迭代对象展开，常用于复制或合并数组。
• 输入类型：数组、字符串、Set等可迭代对象。
• 输出类型：新数组。

---

5-3 数组创建应用：提取字符串中的数字

需求说明

从混合字符串中提取数字（如“曾贤志89”提取为[8,9]）。

代码实现

function test() {
   
    var newarr = [];                          // 初始化结果数组
    var Rngs = Range("A2", Cells(999, 1).End(xlUp)); // 获取A列数据区域
    for (var Rng of Rngs) {
                      // 遍历每个单元格
        var arr = [...Rng.Value()];           // 将单元格值转为字符数组
        for (var ar of arr) {
                    // 遍历每个字符
            if (Number(ar) > -1) {
               // 判断是否为数字
                newarr = [...newarr, ar];     // 将数字加入结果数组
            }
        }
        Rng.Offset(0, 1).Value = newarr.join(","); // 写入相邻单元格
        newarr = [];                          // 清空临时数组
    }
}

逐行解析：

1. Range("A2", Cells(999, 1).End(xlUp))：动态获取A列数据区域，避免处理空单元格。
2. [...Rng.Value()]：将单元格内容（如“A89”）拆分为字符数组["A","8","9"]。
3. Number(ar) > -1：过滤非数字字符（如字母返回NaN，条件不成立）。
4. join(",")：将数组转换为以逗号分隔的字符串，便于写入单元格。

---

5-4 用函数创建数组（new Array、Array.of、Array.from）

1. new Array

function test1() {
   
    var arr1 = new Array();      // 空数组：[]
    var arr2 = new Array(5);     // 长度5的空数组：[empty ×5]
    var arr3 = new Array(10,4,8);// 含元素的数组：[10,4,8]
}

注意：new Array(5)会创建稀疏数组，直接访问元素返回undefined。

2. Array.of

function test2() {
   
    var arr1 = Array.of();       // 空数组：[]
    var arr2 = Array.of(5);      // 单元素数组：[5]
    var arr3 = Array.of(10,4,8); // 多元素数组：[10,4,8]
}

与new Array区别：Array.of(5)创建的是[5]而非长度为5的空数组。

3. Array.from

function test3() {
   
    var arr = [1, 3, 5];
    var arr1 = Array.from(arr);              // 复制数组：[1,3,5]
    var arr2 = Array.from("9527");           // 字符串转数组：["9","5","2","7"]
    var arr3 = Array.from([3,4,9], x => x*10); // 映射转换：[30,40,90]
}

参数解析：

• 第一个参数：可迭代对象（如数组、字符串）。
• 第二个参数（可选）：映射函数，对每个元素进行处理。

---

5-5 函数创建数组应用：按条件格式化数据

需求说明

筛选成绩≥90分的数据，并计算其占总分的比例。

代码实现

function test() {
   
    var Rngs = Range("A2", Range("A9999").End(xlUp)); // 获取数据区域
    for (var Rng of Rngs) {
                             // 遍历每行
        var arr = Rng.Offset(0,1).Resize(1,12).Value()[0]; // 读取12个月数据
        var newarr = [];
        var wsf = WorksheetFunction;
        for (var ar of arr) {
                           // 筛选≥90的数据
            if (ar >= 90) newarr.push(ar);
        }
        var total = wsf.Sum(newarr);                 // 计算总分
        var arr1 = Array.from(newarr, x => `${
     x}（${
     wsf.Text(x/total, "0%")}）`);
        Rng.Offset(0,13).Value2 = arr1.join(", ");   // 写入结果
    }
}

关键点解析：

• Resize(1,12)：从当前行向右扩展12列，读取月度数据。
• Array.from映射：将分数转换为分数（占比）格式，如"90（25%）"。

---

5-6 数组元素的读写改操作

核心操作解析

数组通过索引直接访问或修改元素，支持动态扩展和类型混合存储。

代码示例

function test1() {
   
    var arr = [100];          // 初始化数组：[100]
    arr[0] = 199;             // 修改第一个元素：[199]
    arr[1] = "JS";            // 动态扩展数组：[199, "JS"]
    arr[4] = 1000;            // 跳过索引2-3，直接赋值索引4：[199, "JS", empty ×2, 1000]
    Console.log(arr[3]);       // 输出：undefined（空元素）
}

输入输出说明

• 输入类型：任意数据类型。
• 输出类型：数组元素按索引位置返回。
• 数据示例：
  • 初始数组：[100]
  • 修改后：[199, "JS", empty ×2, 1000]

---

5-7 单元格区域与JS数组的交互

需求说明

将WPS表格中的单元格数据读取为数组，或将数组写入单元格区域。

代码实现

function 读取() {
   
    // 读取单行数据（A2:E2）
    var arr1 = Range("A2:E2").Value();        // 返回二维数组：[[A2,B2,C2,D2,E2]]
    // 读取单列数据（A2:A9）
    var arr2 = Range("A2:A9").Value();        // 返回二维数组：[[A2],[A3],...,[A9]]
    // 读取多行多列数据（A2:E9）
    var arr3 = Range("A2:E9").Value();        // 返回二维数组（5行5列）
}

function 写入() {
   
    // 将一维数组写入A1:C1
    Range("A1:C1").Value2 = [1, 2, 3];        // A1=1, B1=2, C1=3
}

表格结构示例

	A	B	C	D	E
2	数据1	数据2	数据3	数据4	数据5
3	数据6	数据7	数据8	数据9	数据10

• 读取结果：arr3 = [["数据1","数据2","数据3","数据4","数据5"], ["数据6","数据7","数据8","数据9","数据10"]]

---

5-8 单元格与数组应用：提取首个满足条件的数据

需求说明

从月度销售数据中提取第一个销售额≥100的月份及数值。

代码实现

function test() {
   
    var LastCell = Range("A9999").End(xlUp);  // 获取最后一行
    var Rngs = Range("A2", LastCell);         // 数据区域（A2到末尾）
    for (var Rng of Rngs) {
                      // 遍历每行
        var arr = Rng.Offset(0, 1).Resize(1, 12).Value()[0]; // 读取12个月数据
        var arr1 = Array.from(arr, x => x >= 100);           // 生成布尔数组
        var num = WorksheetFunction.Match(true, arr1, 0);    // 查找第一个true的位置
        var val = Rng.Offset(0, num).Value();                // 获取对应值
        Rng.Offset(0, 13).Value2 = `${
     val}（${
     num}月）`;     // 写入结果
    }
}

输入输出示例

• 输入表格片段（B2:M2）：

  1月	2月	3月	…	7月	…
  84	73	73	…	100	…

• 输出结果：100（7月）

---

5-9 数组长度控制与切片功能

核心功能

通过修改数组的length属性实现动态截断或扩展。

代码示例

function test() {
   
    var c = [2, 3, 5, 7, 9];  
    c.length = 3;            // 截断为前3个元素：[2,3,5]  
    c.length = 5;            // 扩展为长度5：[2,3,5, empty ×2]  
}

应用场景

动态调整数据规模，例如仅保留有效数据部分。

---

5-10 数组元素的添加与删除

栈与队列操作

function test1() {
   
    var arr = [];
    arr.push("a");          // 尾部添加元素：["a"]
    arr.push("b", "c");     // 添加多个元素：["a","b","c"]
    arr.pop();              // 删除尾部元素：["a","b"]
}

function test2() {
   
    var arr = ["a","b","c","d","e"];
    arr.shift();            // 删除头部元素：["b","c","d","e"]
    delete arr[1];          // 删除索引1元素：["b", empty, "d","e"]
}

方法对比

• push/pop：栈结构（后进先出）。
• shift/unshift：队列结构（先进先出）。

---

5-11 添加删除应用1：提取求和最大记录

需求说明

从季度销售数据中提取总销售额最大的员工记录。

代码实现

function test() {
   
    var wsf = WorksheetFunction;
    var newarr = [];
    var counter = wsf.CountA(Range("A:A"));            // 统计A列非空单元格数
    for (var num = 2; num <= counter; num++) {
            // 遍历数据行（从第2行开始）
        var arr = Range(`B${
     num}:E${
     num}`).Value()[0]; // 读取B-E列季度数据
        newarr.push(wsf.Sum(arr));                     // 计算季度总和并存入数组
    }
    var mx = wsf.Max(newarr);                          // 找到最大值
    var pos = wsf.Match(mx, newarr, 0);                // 获取最大值位置
    var na = Range("A" + (pos + 1)).Value();           // 获取对应员工姓名
    alert(`最大值：<h1 style='color:red'>${
     mx}</h1>\n对应员工为：${
     na}`);
}

输入表格示例

	A	B	C	D	E
1	姓名	Q1	Q2	Q3	Q4
2	张三	121	127	130	106
3	李四	94	148	121	131
4	王二麻	150	150	108	109

输出结果

• 最大值：150 + 150 + 108 + 109 = 517
• 对应员工：王二麻

---

5-12 添加删除应用2：二维区域转嵌套数组

需求说明

将二维表格区域转换为嵌套数组结构（每3行一组）。

代码实现

function test() {
   
    var bigarr = [], smallarr = [];
    var Rngs = Range("A2:C7");                  // 定义数据区域（A2-C7）
    for (var Rng of Rngs) {
                        // 遍历每个单元格
        smallarr.