Javascript
Javascript function declarations vs function operators
on 14 Jul 12
(4 comments)
A look at the differences between the javascript function declaration and the function operator syntax.
In languages like C# and Java you never really need to give a thought to the this operator. In javascript things are a little more complicated due to functions being first class objects.
How to use a tool called Packer.NET to build javascript minification into a MSBuild script.
Prototype chaining is used to build new types of objects based on existing ones. It has a very similar job to inheritance in a class based language.
The javascript object prototype is javascript’s way of sharing implementation across similar objects, much like the way classes are used to do this in many other languages. Although constructor functions look a lot like classes, javascript does not have a class based object system like C# or Java. Instead it has a prototype based object [...]
A neat little trick I learnt from Ting is a way to check whether a value was null or undefined using the or operator (||). It’s really simple. If valueThatMightBeEmpty has a value set, you get that value. If it is null you get the default. It’s just like the ?? operator in C#: var [...]
Javascript closures are a really powerful feature of the javascript language. Closures are created when a function that’s nested inside another function accesses a variable from its parent’s scope. This is really useful for passing state around your application when the inner function is called after the outer function has exited. Javascript supports functions nested [...]
The object literal syntax is great for setting up one off objects but sometimes you’ll want to mass produce objects that all have the same properties and methods. It would be a pain to have to set up each object individually so instead you can use a constructor function to do it for you. There’s [...]
In 2008 I did a talk at a .NET user group in Oxford about the nuts and bolts of how objects actually work in javascript. Here are the presentation slides and code samples.
Javascript anonymous functions
on 23 Aug 08
(46 comments)
Anonymous functions are functions that are dynamically declared at runtime. They’re called anonymous functions because they aren’t given a name in the same way as normal functions.
Functions in javascript are first class objects. This means that javascript functions are just a special type of object that can do all the things that regular objects can do. Really, just like any other variable Here are a few of the important objects things that you can do with a function in javascript. A [...]
Javascript objects are basically just hash tables, a group of related properties and functions that can be accessed by a key. Properties are dynamically added at runtime. Methods are just properties that happen to be functions. Building a simple object The simplest way to build objects in Javascript is by declaring a new variable of [...]
How javascript objects work
on
(9 comments)
A look at the features of the javascript that can be used to write object oriented code and how javascript objects really work at the language level. Useful for people writing bare metal javascript or to understand how you framework really works.
The document.querySelector javascript method queries a HTML document for DOM elements that match a CSS selector. It is built-in browser support for the selector query features that made javascript libraries like JQuery so popular. It is part of the W3C selectors api spec. This feature has excellent support in recent versions of all desktop browsers, [...]
Learnt something new today! There’s a repository of open source javascript code called JSAN modelled on the perl version. There’s a whole lot of interesting stuff on there like UI widgets, animations and AJAX. I haven’t tried any but it’s nice to know there’s somewhere you can see what other people are doing.
One recurring problem I’ve had when using a function from a custom javascript object as an event handler is that when the event handler is called the “this” property of the function no longer references the object it originally belonged to. To show you what I mean, take a look at this simple javascript object. [...]
I came across a weird feature of javascript last week, a way of spanning javascript strings over multiple lines. To do it you put a ‘\’ character just before the line break and javascript knows it should keep going on the next line: var mystring = "hello \ [...]
DIY javascript stack trace
on 12 May 07
(12 comments)
How to use arguments.callee to walk up the javascript call stack when you’re doing something that a debugger can’t help you with.
Something I really, really love at the moment is a little application called javascript lint. It’s a javascript syntax checker that’s built on top of the Mozilla javascript engine. You can run it over a javascript include file (I don’t know if it’ll work on inline javascript) and it’ll syntax check it for you without [...]
I found a link to a new page for the really useful drip tool which looks for IE memory leaks in javascript code. There’s also been a new revision of the program by the guy who’s hosting it.
I found a very interesting article about ASP.NET data binding that talks about exactly what’s happening when you call the DataBind() method on a templated control like the repeater. It’s got some really interesting stuff on how the templates are instantiated and how the child controls are built.
I don’t know if this will be useful to anyone else but I thought this was kind of a neat trick for messing around with ASP.NET page rendering for debugging purposes. My problem was I wanted to stop the rendering of a page at a certain point so I could see how the scripts were [...]
I ran into a weird problem with dynamically created ASP.NET 2.0 user controls yesterday. I was using the user control to populate a panel of a tab control which meant I didn’t actually have a reference to the user control object anywhere on my form. The only way I could get a reference to it [...]
IE has a pretty nice DOM property called currentStyle that you can use to find out the resolved style properties of a DOM object. This is neccessary because the style property will only tell you what style properties have been set, they won’t tell you what properties have been inherited from the element’s parent nodes. [...]
I found a useful little utility called Lint that checks for things in your javascript code that’s likely to introduce errors. I really like that it checks for undeclared variables because I always, always, always want to declare my variables before I use them. Considering that forgetting to declare the variable sets it global for [...]