參考
js-xlsx github源碼
在 Node.js 中利用 js-xlsx 處理 Excel 文件
在瀏覽器和node中使用 GitHub的js-xlsx庫進行Excel文件處理(一)
一、讀取單元格
參考nodejs 操作 excel
在 sheet 中讀單元格是通過索引下標的形式,像這樣:sheet["A1"] 表示讀取第一個單元格(下文用 A1 泛指這種表示方法)。這種方式保持了 excel 軟件里面的用法,很好理解,但是不利于程序編碼。通常處理二維數據,最容易想到的就是通過行列索引直接定位一個單元格,但是 sheet 并不支持這種方式,好在 xlsx 提供了幾個函數,方便在行列索引和“A1”索引相互轉換:
-
xlsx.utils.encode_row(row_index)
將基于 0 的索引轉換為基于 1 的索引,之所以有這個方法是因為,程序里面下標都是從 0 開始計算,而 excel 軟件卻是從 1 開始計算,下同 -
xlsx.utils.decode_row(row)
與上個方法相反,將基于 1 的索引轉換為基于 0 的索引 -
xlsx.utils.encode_col(col_index)
將基于 0 的索引轉換為 ABCD 這種列;excel 表格軟件中,列的表示是A, B, C, D,這個函數將 A, B, C, D 對應到 0, 1, 2, 3 -
xlsx.utils.decode_col(col)
與上個方法相反,將 ABCD 這種列索引轉換為基于 0 的索引 -
xlsx.utils.encode_cell(object)
將一個行列對象轉換為 A1 這種字符串 -
xlsx.utils.decode_cell(addr)
與上個方法相反,將 A1 這種字符串轉換為一個行列對象 -
xlsx.utils.encode_range(obj)
將一個范圍對象轉換為 A1:G8 這種字符串 -
xlsx.utils.decode_range(addr)
與上個方法相反,將 A1:G8 這種字符串轉換為行列對象
舉個栗子,假設要讀第 8 行第 8 列這個單元格的數據,首先得到它的 A1 表示法:
// =========== 第一種方法 ==============
var row = xlsx.utils.encode_row(7);
//輸出:'8'
var col = xlsx.utils.encode_col(7);
//輸出:'H'
var addr = col + row;// => H8
// =========== 第二種方法 ==============
//注意這里的行列對象表示形式
var addr = xlsx.utils.encode_cell({r: 7, c: 7});
//輸出:H8
//如果執行 xlsx.utils.decode_cell('H8'); 則
//輸出:{r: 7, c: 7}
其實,第二種方法就是第一種方法的升級版,可以少寫一些代碼。
再舉個栗子,假設已知需要獲取 B4:D9 范圍的數據,也就是 B, C, D 3 列和 4 5 6 7 8 9 6 行的交叉區域:
var range = xlsx.utils.decode_range('B4:D9')
//輸出:
{
s: { c: 1, r: 3 },
e: { c: 3, r: 8 }
}
我不知道看到這里的客官您的內心感受,但是我已經忍不住吐槽了,盡管我已經理解了這個萬惡的輸出對象,但還是要說,這他媽的的什么玩意啊。。。用戶體驗太差了吧。
解釋下吧。輸出中的 s, e 表示 start, end。也就是說這個輸出表示了開始的行索引和列索引,結束的行索引和列列索引。剩下的就是你自己循環得到它的數據了。 最后強調下,使用 A1 這種下標索引的時候,A1 一定要寫成 A1,寫成小寫的就不對了。
艱難的了解了如何獲取單元格,現在說說單元格的秘密。你可能會說:單元格不就是一串文本嗎,有什么秘密呢?在我使用這個庫之前,我也是有這種想法的,但是最終看到單元格的表示形式之后,我才明白我錯了。先上代碼:
var cell = sheet['A1'];
console.log(cell);
輸出:
{
"v": "單元格的原始值",
"w": "單元格格式化之后的文本",
"t": "數據類型",
"f": "cell formula",
"r": "富文本",
"h": "富文本的HTML表示形式",
"c": "注釋",
"z": "數字格式化模板",
"l": "如果當前單元格內容是超鏈接,這里存儲了超鏈接內容",
"s": "單元格樣式"
}
看到了吧,不要以為獲取到單元對象,就沒事了,這里還有一堆屬性等著你臨幸呢。每個屬性的解釋以屬性值得形式給出了。通常,獲取到的單元格可能不會有上面全部的屬性,如:純文本單元格就沒有 "r", "h", "l" 等屬性。
還有,日期單元格的原始值 v 和格式化值 w 不一樣,因為日期在 excel 以數字形式存儲;超鏈接單元格的文本是 v,而鏈接是 l.Target。
平時使用單元格的時候,如果處理的表格不是很復雜,獲取 v 屬性的值就 OK 了。如果太復雜,還是用 excel 軟件處理吧,這里就不深入這個單元格了。
二、基本概念
1.workbook 對象,指的是整份 Excel 文檔。我們在使用 js-xlsx 讀取 Excel 文檔之后就會獲得 workbook 對象。
2.worksheet 對象,指的是 Excel 文檔中的表。我們知道一份 Excel 文檔中可以包含很多張表,而每張表對應的就是 worksheet 對象。
3.cell 對象,指的就是 worksheet 中的單元格,一個單元格就是一個 cell 對象。
它們的關系如下:
// workbook
{
SheetNames: ['sheet1', 'sheet2'],
Sheets: {
// worksheet
'sheet1': {
// cell
'A1': { ... },
// cell
'A2': { ... },
...
},
// worksheet
'sheet2': {
// cell
'A1': { ... },
// cell
'A2': { ... },
...
}
}
}
4.讀取 Excel 文件
import XLSX from 'xlsx';
const workbook = XLSX.readFile('someExcel.xlsx', opts);
5.獲取 Excel 文件中的表
// 獲取 Excel 中所有表名
const sheetNames = workbook.SheetNames; // 返回 ['sheet1', 'sheet2']
// 根據表名獲取對應某張表
const worksheet = workbook.Sheets[sheetNames[0]];
6.通過 worksheet[address] 來操作表格,以 ! 開頭的 key 是特殊的字段。
// 獲取 A1 單元格對象
let a1 = worksheet['A1']; // 返回 { v: 'hello', t: 's', ... }
// 獲取 A1 中的值
a1.v // 返回 'hello'
// 獲取表的有效范圍
worksheet['!ref'] // 返回 'A1:B20'
// 返回 range 對象,{ s: { r: 0, c: 0}, e: { r: 100, c: 2 } }
worksheet['!range']
// 獲取合并過的單元格
// 返回一個包含 range 對象的列表,[ {s: { r: 0, c: 0 }, c: { r: 2, c: 1 } } ]
worksheet['!merges']
三、其它
1.xlsx.js使用了ES5的功能,比如Array和forEach等,為了兼容低版本的瀏覽器,使用了shim技術。在加載xlsx.js文件之前加載shim.js(在dist/ directory文件夾里面),還有xlsx只能解析xls,也就是97-03的excel表格,如果要解析xlsx,也就是03之后的excel表格,需要引入jszip.js文件,而且需要在xlsx之前加載。
2.worksheet到底是什么
var worksheet = workbook.Sheets[Sheet1];
console.log(“打印sheet1:\n”,worksheet);
可以看出,worksheet是一個對象,里面包含名稱/值對,值對的值仍然是對象。要獲取A1單元格的值,這樣:
var desired_cell = worksheet[A1];
var desired_value = desired_cell.v;
四、DEMO
/**
* 轉換 excel 為 HTML 文件
*
* @file xlsx2json.js
* @author mystorp@gmail.com
*
*/
var fs = require('fs'),
xlsx = require('xlsx');
/**
* 解析 excel 為 JSON 對象,每個 excel 有多個 sheet 頁,
* 每個 sheet 頁里面有多行數據,每行數據有多列,最終 sheet
* 的數據存儲為二維數組。
* 返回格式:
* {
* "Sheet 1": [
* [col1, col2, col3, ...],//第一行數據
* [col1, col2, col3, ...],//第二行數據
* ...
* ],
* "Sheet 2": []
* }
*
* @param {String} input - 要處理的 excel 源文件
* @return {Object} 返回
*/
function parse(input) {
var book = xlsx.readFileSync(input), result = {};
//循環工作表中的每個 sheet 頁
book.SheetNames.forEach(function(name){
//拿到當前 sheet 頁對象
var sheet = book.Sheets[name],
//得到當前頁內數據范圍
range = xlsx.utils.decode_range(sheet['!ref']),
//保存數據范圍數據
row_start = range.s.r, row_end = range.e.r,
col_start = range.s.c, col_end = range.e.c,
rows = [], row_data, i, addr, cell;
//按行對 sheet 內的數據循環
for(;row_start<=row_end;row_start++) {
row_data = [];
//讀取當前行里面各個列的數據
for(i=col_start;i<=col_end;i++) {
addr = xlsx.utils.encode_col(i) + xlsx.utils.encode_row(row_start);
cell = sheet[addr];
//如果是鏈接,保存為對象,其它格式直接保存原始值
if(cell.l) {
row_data.push({text: cell.v, link: cell.l.Target});
} else {
row_data.push(cell.v);
}
}
rows.push(row_data);
}
//保存當前頁內的數據
result[name] = rows;
});
return result;
}
/**
* 根據模板頁生成最終的頁面
*
* @param file 要生成文件的路徑
*/
function createPage(file, head, catalogs) {
var src = fs.readFileSync('template.html', {encoding: 'utf-8'}), o;
o = {head:head, catalogs: catalogs};
src = src.replace(/\{(.*?)\}/g, function(_, key){
return (key in o) ? JSON.stringify(o[key]) : _;
});
fs.writeFileSync(file, src);
}
if(module === require.main) {
var files = [
{filename: '1.xls', text: 'jhs', html: 'index_jhs.html'},
{filename: '2.xls', text: 'tm', html: 'index.html'}
];
var prefix = "./";
files.forEach(function(c){
var result = parse(c.filename), dir = prefix + c.text, k, catalogs = [], i;
fs.existsSync(dir) || fs.mkdirSync(dir);
i = 1;
for(k in result) {
fs.writeFileSync(dir + '/' + i + '.json', JSON.stringify(result[k]));
catalogs.push([k, i]);
i++;
}
createPage(prefix + c.html, c, catalogs);
});
}
end