How to protect an API Key when using JavaScript?
Short answer: No
What ever you do to obfuscate the key, you still have to send it to make it available on the client somehow, and therefore it will be possible to extract it using fx. Firebug.
Even if you devise an awesome magical way to keep the key secret, at some point you would have to make the actual API-request, and as it would have to be sent from the browser, an attacker would be able to read out the key in plain text from Firebugs net tab.
The right thing to do is to create a PHP wrapper around the API calls that require keys, and then call that wrapper from Javascript.
My solution right now is to write a little wrapper in rust, and throw it in the /cgi-bin and make calls to that. That should keep the api-key, api creds and session data separate from the client.