每日 30 秒 ⏱ 數組轉CSV表格數據

簡介

數組、CSV、表格、工具javascript

將一個數組轉化爲逗號爲分割符的字符串(CSV)即表格數據。html

// 該源碼來自於 https://30secondsofcode.org
const arrayToCSV = (arr, delimiter = ',') =>
  arr.map(v => v.map(x => `"${x}"`).join(delimiter)).join('\n')
複製代碼

代碼分析

這個代碼利用了 Array.prototype.map()Array.prototype.join() 兩個函數,實現了一個簡單的數組轉化爲 csv 文件類型的代碼。分別對代碼進行兩次遍歷,第一層是遍歷整個數組的項目,並在項目尾部添加換行符。第二層遍歷爲遍歷數據行的值,並添加分隔符(分隔符定義時默認值爲 ,)。java

使用場景

將頁面上用戶數據導出爲 Excel 表格,而且提供下載。git

<a id="download-user-data" onclick="downloadUserData(this)" download="downlaod.csv" href="#">download</a>
複製代碼
const title = [
    '姓名', '年齡', '性別'
]

const users = [
    { name: 'xiaoer', age: 24, sex: '男' },
    { name: 'xiaosi', age: 8, sex: '男' },
    { name: 'menty', age: 18, sex: '女' },
]

function downloadUserData(target) {
    const data = [
        title,
        ...(users.map((i) => [ i.name, i.age, i.sex ])),
    ]

    const csv = arrayToCSV(data)
    target.href = `data:text/csv;charset=utf-8,\ufeff${csv}`
}
複製代碼

一塊兒成長

在困惑的城市裏總少不了並肩同行的 夥伴 讓咱們一塊兒成長。github

  • 若是您想讓更多人看到文章能夠點個 點贊
  • 若是您想激勵小二能夠到 Github 給個 小星星
  • 若是您想與小二更多交流添加微信 m353839115

微信公衆號

本文原稿來自 PushMeTop數組

相關文章
相關標籤/搜索