The Csv file generator is almost done. All we need to do is to enclose and escape certain special characters. Values containing the
separator need to be enclosed in double quotes. Values containing double quotes need to be escaped and, just to be sure, enclosed
in double quotes.
Two more requirements and two more unit tests coming up...
Requirements
Values containing the current separator must be enclosed in double quotes.
Values containing double quotes must be escaped (by doubling the double quote characters), and also enclosed in double quotes.
There. The first three unit tests are already passing. Next up is the first version of the getFileContents method.
// getFileContents implementationCsv.prototype.getFileContents = function(separator, includePropertyNames) {
vartextLines = [];
// Add the auto-generated headerif (includePropertyNames) {
textLines.push(this.propertyOrder.join(separator));
}
// We step through every item in the items arraythis.items.forEach(function(item) {
// We create one line of text using the propertyOrder// First create an array of text representationsvarvalues = [];
this.propertyOrder.forEach(function(name) {
values.push(item[name].toString());
});
// Then join the fields togethervarlineOfText = values.join(separator);
textLines.push(lineOfText);
}).bind(this);
// Return the complete filereturntextLines.join("\r\n");
};
The only thing left to do now is the saveAs method. Since this requires a functioning window.saveAs implementation to be available, the method is really simple.
// saveAs implementationCsv.prototype.saveAs = function(filename, separator, includePropertyNames) {
varfileContents = this.getFileContents(separator, includePropertyNames);
// Create a blob, adding the Unicode BOM to the beginning of the filevarfileAsBlob = newBlob(["\ufeff", fileContents], {type:'text/csv'});
window.saveAs(fileAsBlob, filename);
};
There! It's done! The only thing left to do is some extra text escaping, but I leave that for next part. EDIT: The finished code can be found on github at /lbrtw/csv.
I came across the need to generate CSV files locally using JavaScript, and set out to create a simple tool for that. It should be small, simple and should just get the job done.
I would like to be able to use the CSV generator something like this:
/// Requirement code visionvarpropertyOrder = ["name", "age", "height"];
varcsv = newCsv(propertyOrder);
csv.add({ name : "Anders",
age : 38,
height : "178cm" });
csv.add({ name : "John Doe",
age : 50,
height : "184cm" });
csv.saveAs("people.csv");
First things first, so let's start with some unit tests. I use the unit test framework that I have covered in earler posts.
Requirements
The only parameter for the constructor is the order of the properties. This order should be saved.
The add method should add one item to the list of items to export.
For this purpose, the Csv object should contain an items property, containing all added items.
The saveAs method should use the window.saveAs function, requiring a FileSaver shim to be in place.
Mostly for testing purposes, the text content of the file to be generated should be accessible through the getFileContents method.
When calling saveAs or getFileContents, I should be able to specify which field separator to use. The default should be a comma.
When calling saveAs or getFileContents, I should be able to have the property names added automatically as a header row. The default should be not to.
For interoperability purposes, the saved file should contain the correct Byte Order Mark.