background preloader

JavaScript

Facebook Twitter

Learning JavaScript Visually with Diagrams. Learning Javascript with Object Graphs (Part III) Static Version Part I of this series explained basic object graphs and visually described references, closures, and basic inheritance in JavaScript.

Learning Javascript with Object Graphs (Part III)

Part II compared different styles for doing object-oriented programming in JavaScript. Now in Part III we'll get creative and look as Ruby's object model and compare it to how JavaScript works. Also I'll show how to implement some Ruby style classes. JavaScript is a very flexible language and can support about any object model you want with enough understanding and creativity. Why Ruby Ok, I'll admit, I used to be a ruby guy. Also I chose ruby because I've noticed that several newcomers to the node.js community come from ruby and other languages with similar object systems.

What are Objects Both languages are object oriented languages. Methods versus Functions Probably the biggest difference between the object models when you get down to it and ignore syntax is the fact that Ruby has methods and JavaScript has first-class functions. A String. Learning Javascript with Object Graphs (Part II) Static Version The first article using graphs to describe JavaScript semantics was so popular that I've decided to try the technique with some more advanced ideas.

Learning Javascript with Object Graphs (Part II)

In this article I'll explain three common techniques for creating objects. Essential JavaScript Design Patterns For Beginners. I would like to thank Rebecca Murphey for inspiring me to open-source this mini-book and release it for free download and distribution - making knowledge both open and easily available is something we should all strive for where possible. I would also like to extend my thanks to the very talented Alex Sexton who was kind enough to be the technical reviewer for this publication. I hope that it helps you learn more about design patterns and the usefulness of their application to JavaScript. Volume 2 of Essential JavaScript Design Patterns is currently being written and will be more detailed than this first edition. The ETA for it's online release is late Q4, 2011.

For more detailed coverage of specific patterns, you may be interested in my posts on the Pub/Sub (Observer) or Decorator patterns. At the beginning of this book I will be focusing on a discussion about the importance and history of design patterns in any programming language. Patterns are not an exact solution. Eloquent JavaScript: A Modern Introduction to Programming. Learning Javascript with Object Graphs. HEADS UP!

Learning Javascript with Object Graphs

This article was written for an older version of node. More up-to-date information may be available elsewhere. One of the secrets to being a super effective JavaScript developer is to truly understand the semantics of the language. This article will explain the basic elemental parts of JavaScript using easy to follow diagrams. References Everywhere A variable in JavaScript is simply a label that references a value in memory somewhere. Local Variables In the following example, we will create four local variables in the top-level scope and point them to some primitive values: variables.js // Let's create some local variables in the top scopevar name = "Tim Caswell";var age = 28;var isProgrammer = true;var likesJavaScript = true;// Test to see if the two variables reference the same valueisProgrammer === likesJavaScript; Notice that the two boolean variables point to the same value in memory.

The outer box represents the outermost closure scope. Objects and Prototype Chains. JavaScript from Null. The Best Way to Learn JavaScript. Learning something new is scary.

The Best Way to Learn JavaScript

For me, the biggest issue with picking up a new skill is that I don’t know what I don’t know. Given that, it’s often useful to find a plan for learning whatever you’re interested in. That’s what this post is: your blueprint, your roadmap, your plan of action for learning JavaScript! You don’t have to worry about finding the best resources, sorting out the bad ones, and figuring out what to learn next. It’s all here. JavaScript is the language of the browser. Expanding Text Areas Made Elegant. An expanding text area is a multi-line text input field that expands in height to fit its contents.

Expanding Text Areas Made Elegant

This UI element is commonly found in both desktop and mobile applications, such as the SMS composition field on the iPhone. Examples can also be found on the web, including on Facebook, where it’s used extensively.