Struggling for Competence

Javascript Objects

I've been trying to learn some JavaScript (again). I've got a couple of books which are both pretty useful JavaScript: The Good Parts and The Art & Science of JavaScript. I would also strongly recommend reading JavaScript, 5 ways to call a function; an excellent blog post.


Command Line

Firebug has a JavaScript command line, which is useful for trying things out. For it to work correctly you need to be pointing at a real web page. To reset the state of the script, you simply refresh the web page.

The same tab also has a console which you can log too. It can do a bunch of stuff, but the most useful commands are:


JavaScript primitive types are bool, string and number. Everything else, including function, is an Object. An object is effectively a hash. The hash can have keys (properties) of any type, though they are normally strings. The values can be any type, including other objects and functions.

Object literals are a convenient way to make new objects:

//Empty object
var myPaper  = {};   

//Square bracket notation can get\set keys of any type
myPaper['newspaper'] = 'The Telegraph';
//The dot notation can get\set string keys (aka expando properties)
myPaper.cost = 1.2;
//A function can be assigned to a property
myPaper.gravitas = function(){
	console.log("I have it");

//The for-in loop is used to examine properties on an object
for(key in myPaper){

An object literal can also define the properties in-line:

//Can define the properties within the object literal
var yourPaper = {
	newspaper: "The Sun",
	cost: 0.3,
	gravitas: function(){
		console.log("You dont");
//Can examine the object with console.dir


Functions are a type of object. They can be assigned to properties, variables and passed to other functions. When a function is created, it is given a prototype property which is itself an object.

//named function
function add(a, b) {
    return a+b;
// => 8
// => prototype   Object{}
// anonymous function assigned to variable
var myFunc = function(a, b) {
    return a+b;
// => 18
// => prototype   Object{}


Another way to make objects is with the new operator. New is called on a function. When a function is called this way its behaviour is changed:

function Foo() { };
Foo.prototype = {
    write: function() {
    writeAll: function() {
var myFoo = new Foo();
//=> woop

And that's the basic mechanics of creating objects in JavaScript.