[TOC] > Wed May 26 2021 22:00:24 GMT+0800 (GMT+08:00) 本節涉及 Javascript Array 對象的相關知識，不熟悉的小伙伴可以多研究下 Array 的相關屬性和方法。 本小節來看看單元格區域的 Value() 吧。測試數據如表： _|A|B|C --|--|---|-- 1|A|B|C 2|D|E|F 3|G|H|I ## 測試 這里測試3種情形。行列混合；單行；單列。 ### 行列混合 ```js function t(){ let rng = Range("A1:C3") let rng_address = rng.Address() // 單元格區域地址 let rng_value = rng.Value() // 單元格區域的值 Console.log(`${rng_address}==>${JSON.stringify(rng_value)}`) } ``` 結果： ``` $A$1:$C$3==>[["A","B","C"],["D","E","F"],["G","H","I"]] ``` ### 單行測試 ```js function t(){ let rng = Range("A1:C1") let rng_address = rng.Address() let rng_value = rng.Value() Console.log(`${rng_address}==>${JSON.stringify(rng_value)}`) } ``` 結果： ``` $A$1:$C$1==>[["A","B","C"]] ``` 挺正常的。 ### 單列測試 ```js function t(){ let rng = Range("A1:A3") let rng_address = rng.Address() let rng_value = rng.Value() Console.log(`${rng_address}==>${JSON.stringify(rng_value)}`) } ``` 結果： ``` $A$1:$A$3==>[["A"],["D"],["G"]] ``` ## 結論 以 **`行`** 作為基礎數組對象來描述多行列單元格區域。有幾行就有幾個子數組對象，也可以看作有幾行就有幾個內嵌`[]`。行內的單元格均被 `[]`包裹。 > 這符合人們常規理解的表格行、列結構的描述邏輯。在早期版本的 wps js宏中沒有體現這一點。 1. 行內單元格的值被 `[]` 包裹；被子數組對象包含的值均在同一行。 ## 扁平化 > 這部分涉及 JavaScript Array 對象的扁平化處理知識。參考：`Array.prototype.flat()` 方法。 雖然現在的單元格區域的值容易理解，但我們還是稍稍再拓展下。 1. 按照結論，比如單個單元格的值可以描述為 `[["A"]]`,扁平化之后得到 `"A"`；所以單個單元格的值不是數組對象而是具體的值。 >示例： ```js function t2(){ let arr = [["A"]] Range("A4").Value2 = arr; } ``` 2. 比如 `["A", "B", "C"]` 可以看作 `[["A", "B", "C"]]` 扁平化之后的結果，表示 1 行內連續的 3 個單元格。 3. 雖然經過 `Array.flat()` 處理之后，`[["A"], ["B"], ["C"]]`（表示 3 行 1 列） 也能變成 `["A", "B", "C"]`。但根據結論，這樣處理后行、列結構已經變化，變成了 1 行 3 列。 從以上幾點可以看出，在單元格區域中，`[]`是單元格的核心結構，你做的處理（扁平化、擴展處理)需要注意是否會導致原有單元格區域行、列結構發生變化！ > 當然，有時候我們需要這種變化！比如多行變單行。 同時也提示我們：在用 Array 的 flat 方法時應當小心！尤其是在單元格區域讀值時。 ## 單元格區域的賦值（寫入） 有個通用的方法可以較準確地將數組寫入單元格區域： ```js /** * 單元格區域寫入 * @param {Array} arr 要寫入的數組。 * @param {Range} topRange 要寫入的單元格區域的首個單元格 */ function writeArea(arr,topRange){ // 判斷首元素是不是數組 // 實質就是判斷是否為多行結構 let isArrayItem = Array.isArray(arr[0]) // 如果首元素是數組，即多行。 if(isArrayItem){ // arr.length 行數 // arr[0].length 列數 //（在多行列單元格區域中，每行的列數可定是相同的） topRange.Resize(arr.length, arr[0].length).Value2 = arr; }else{ // 否則為單行多列 topRange.Resize(1,arr.length).Value2 = arr; } } ``` > 這個方法足以應對絕大多數場景，如果參數 arr 的初始數組是比較復雜的結構請自行理順，使其符合單元格區域的讀值的相似結構。 我們接著看下面的例子： ```js function t3(){ let arr = ["A", "B", "C"] Range("E1").Resize(1,3).Value2 = arr // 1 行 3 列；成功賦值 Range("H1").Resize(3,1).Value2 = arr // 3 行 1 列；"B"、"C"丟失，賦值目的未達到 } ``` 從例子可以看出，能否將數組內的元素完整寫入目標單元格區域，取決于**數組結構所表示的行、列結構** 與 **目標單元格行、列結構是否一致**。 ### 拓展數組行、列結構 有時候數組內的元素不能滿足我們寫入單元格區域的行列結構，我們可以數組進行拓展。 #### 單行變多行 單行單元格區域怎么變多行單元格區域，看例子： ```js function t4(){ let arr = ["A", "B", "C"] let brr = arr.map(e=>[e]) // [["A"], ["B"], ["C"]] Range("R1").Resize(brr.length, 1).Value2 = brr } ``` #### 多行變單行 我們用開頭的例子： ```js function R2C(){ let arr = [["A", "B", "C"], ["D", "E", "F"], ["G", "H", "I"]] let brr = arr.flat() Range("L1").Resize(brr.length, 1).Value2 = brr.map(e=>[e]); } ``` 變成每行兩格： > 自行導入 lodash.js 或者自行解決數組分組的問題。 ```js function R1C2(){ let arr = [["A", "B", "C"], ["D", "E", "F"], ["G", "H", "I"]] let brr = arr.flat() // 偷懶，使用 lodash.js 的 chunk 方法 let crr = _.chunk(brr,2) // [["A", "B"], ["C", "D"],...] Range("K1").Resize(crr.length, crr[0].length).Value2 = crr; } ```