How to extract information in a TSV file and save it in an array in JavaScript ?

Question

I'm running into a problem. If I have only tsv's file name. How can i extract all its information and save it in an array, say X, where each row in the tsv file is represented by an array, say y, where X is an array of ys.

ALso how can i do this if i don't know the headers of columns names ?

Answer 1

You're going to need to use AJAX or just pure XMLHttpRequest.

http://d3js.org/ has a built-in tsv reader that does basically exactly what you want.

The syntax is

d3.tsv("file.tsv", function(data) {
    // use data here
});

The data variable is an array of objects with key/value pairs where the first row in the file is read in as the keys. So, for example

Number Awesomeness
1      5
2      3

will return [{"Number":1, "Awesomeness":5}, {"Number":2, "Awesomeness":3}] .

Answer 2

// get file contents, store in var str
var x = str.split('\n');
for (var i=0; i<x.length; i++) {
    y = x[i].split('\t');
    x[i] = y;
}

console.debug(x);

For help on how to get the file contents, you'll need to specify where these files will be located (on the client machine, server, etc.).

If the files are located on the client machine, you might have a rough road ahead of you.

If the files are located on the server, you'll need to do an AJAX request to get the file contents.

Answer 3

Sticking this here so I can find it next time I need it:

// parse_tsv(tsvstring, function (row) { do something with row })
function parse_tsv(s, f) {
  var ix_end = 0;
  for (var ix=0; ix<s.length; ix=ix_end+1) {
    ix_end = s.indexOf('\n', ix);
    if (ix_end == -1) {
      ix_end = s.length;
    }
    var row = s.substring(ix, ix_end-1).split('\t');
    f(row);
  }
}

It's better than the accepted answer because it doesn't force building an array of lines in memory, but rather build little arrays one by one. In situations with large TSV, this can be helpful. Of course you could still build the array with the callback if that's what you need.

Answer 4

You don't have to use D3, JQuery or any another framework for this. Plain and simple JavaScript (AJAX technique):

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
                var arrayWithValues = xhttp.responseText.trim().split('\t');
                console.log(arrayWithValues);
        };
};
xhttp.open("GET", "/some.tsv", true);
xhttp.send();

Answer 5

You can do it with Alasql library:

alasql('SELECT MATRIX * FROM TSV("mydata.tsv")',[],function(res){
    console.log(res);
});

Answer 6

$result = array();
$fp = fopen('/path/to/file','r');
if (($headers = fgetcsv($fp, 0, "\t")) !== FALSE)
  if ($headers)
    while (($line = fgetcsv($fp, 0, "\t")) !== FALSE) 
      if ($line)
        if (sizeof($line)==sizeof($headers))
          $result[] = array_combine($headers,$line);
fclose($fp);
print_r($result);