🏠 back to Observable

When is it allowed to use white space in JS object key? Supplying headers to Tom's Table


#1

In trying out Tom’s tables, I have referenced a google sheet as a TSV files, following @bgchen’s tutorial .

My table headers have a space in the name – is there a way to get this to work? I can’t seem to figure it out (the internet sends me in wild directions). ‘Common tricks’ that I find don’t seem to work:

'original file name'
"original file name"
[original file name]
["original file name"]
Object["original file name"]
Obj["original file name"]
originalFileName: 'Object'

And here’s the line where the code breaks:

ip_research_table = ip_research.map(({key, 'original file name', Year }) => ({
  key,
  'original file name',
  Year
}))

Any tips on how to debug these sorts of things?

Here’s where I’m at:

With thanks,

Aaron


#2

Hi Aaron, glad you’re finding the Google sheet notebook useful!

It looks like the following works:

ip_research_table = ip_research.map(({key, "original file name":originalFileName, Year }) => ({
  key,
  originalFileName,
  Year
}))

As for debugging, I knew that the syntax we were trying to use here was called “Object destructuring”, but I didn’t know off the top of my head how to deal with keys with spaces, so I did a few google searches and eventually found this SO question "How to destructure object properties with key names that are invalid variable names? with a few nice answers.

(I couldn’t get the “destructuring with variables” to work but I also didn’t try very hard once I saw that the other solution did the trick.)


#3

Nice Bryan, and thank you! Looks like I was getting close with my last try, but the ‘direction’ was backward :wink: Thanks for cluing me into ‘Object destructuring’ as well.

Now it’s on to the table! :slight_smile: Thank you!


#4

As a side note, this fork contains a fix for the sorting procedure that doesn’t work in Tom’s implementation (not yet merged by Tom):


#5

Thanks Philippe! Struggling a bit with importing from a shared, unpublished notebook still :open_mouth:


#6

Yeah and auto-prettier complicated things a bit too…


#7

The syntax for importing from a shared notebook is this (the code below imports from @ehouais’s fork):

import {table} from "1e70540aa08c9094"

The lack of a d/ is indeed a little unintuitive.

P.S.: There are some useful notebook-name-related functions in this notebook of mootari’s. See also my fork of it for some other convenient functions.


#8

Quick note - sorry for the delay, I’ve now merged this suggestion.