|
|
|
|
Issue #39 (Invoking functions + Learning Tools)04/17/14
Early in their book Secrets of the JavaScript Ninja, John Resig and Bear Bibeault include a chapter covering functions. I highly recommend the book for all JavaScript developers, and I thought I would summarize here part of their section on invoking functions in JavaScript.
They describe 4 ways to invoke a function, all of which are valuable and practical in some way. Below I briefly describe each technique.
As a function. This is the most straightforward manner to invoke a function:
function doSomething () {
// stuff here
}
doSomething();
var doSomethingElse = function () {
// stuff here
}
doSomethingElse();
|
When invoked like this, the function context is the global context, which is the window object in the browser. The two invocations above are equivalent to window.doSomething() or window.doSomethingElse().
As a method. This is when a function is assigned to a property of an object:
var obj = {};
obj.doSomething = function () {
// stuff here
};
obj.doSomething();
|
This allows the parent object of the method to be referenced inside the method using the this keyword (just as this would refer to the window object in the previous example).
As a constructor. This uses the new keyword:
function Constructor () {
// stuff here
}
new Constructor();
|
When a constructor is invoked, a new empty object is created, the object gets passed to the constructor as the this parameter, and the new object is returned as the constructor's value.
With apply() and call(). I'm going to save this last one for another issue or maybe an article elsewhere, but in a nutshell, these native methods allow you to change the function context that normally occurs with the other invocation methods mentioned above.
Definitely get the book for the full explanation on what I've basically glossed over in this brief intro.
Now on to this week's learning tools!
Interactive Tools and Tutorials
Untrusted
This is really cool. A user JavaScript adventure game. "You must literally edit and re-execute the very JavaScript running the game in your browser to save Dr. Eval from this dark and confusing reality."
RegExr
"An online tool to learn, build, & test Regular Expressions."
CSS Diner
A very nicely designed game to learn CSS selectors.
Koding
A full-featured, collaborative service for learning to program in a number of languages. You can interact with VMs, work with a team, and more. The 2-min. video is a good starting point.
Practice
Not necessarily "interactive", but a simple website to get random inspiration for ideas to help you learn new things.
What the color?
A simple little game that chooses a random color for you and then you have to guess what it is in code (RGB, etc). It gives you percentage closeness hints so you know when you're close.
JavaScript Puzzlers
"A JavaScript quiz based on the behaviour as of ECMA 262 (5.1) in a browser environment."
QuizPoint
"Quizzes for web geeks."
Learn CSS Selectors
A very simple page to help you learn selectors by displaying the markup with color coding under a CSS example.
Screencast Series and Video Courses
WatchMeCode.net
A screencast series subscription service by Derick Bailey "dedicated to bringing you the latest and greatest in JavaScript."
Fluent Conference 2014 Videos
YouTube channel for O'Reilly's conference, with talks from Lea Verou, Brendan Eich, Paul Irish, Ilya Grigorik, and loads more.
tagtree.tv
"Grow your expert full-stack JavaScript skills with tagtree screencasts."
Code.org Flappy Bird
A nice simple learning ground for kids or those very new to programming. Let's you build a Flappy Bird game step by step using drag and drop.
DevCasts
"Hand picked developer screencasts." A number of different technologies are covered.
The Happy Cog Way
8 video courses by Happy Cog, "teaching best practices and sharing an inside look at how we work. Learn HTML Prototyping, Responsive Web Design, how to build a type system, Sass, HTML5, CSS3, grids, and more."
Videry
Curated videos for web designers.
HTML5 & CSS3 on TheNewBoston
53 videos on HTML5 and CSS3. Some of this will be a little out of date, but lots here, and they have a number of other video series including jQuery, JS for beginners, and more.
Bitcast.io
"A community-driven marketplace for software development screencasts" covering Angular, Ember, Backbone, Sinatra, and more.
Podcasts and Newsletters
Sass Bites
A weekly YouTube podcast covering Sass.
Build Podcast
More of a screencast series, really, but looks cool. "Screencasts on tech tools" covering lots of neat stuff. Hasn't been updated in a few months, but has tons of stuff in the archive.
Modern Web Observer
"A free, biweekly email newsletter about current issues and trends in front-end web development."
The Back to Front Show
"A bi-monthly podcast hosted by Keir Whitaker and Kieran Masterton" covering all sorts of development topics from front-end to back-end.
Sass News
A weekly newsletter focused on Sass-based news, tools, demos, and tutorials, curated by Stu Robson.
Books for Developers
Sublime Productivity
"Packed with tips and tricks that turn painful editing chores into trivial tasks." Link includes a coupon code for 20% off the regular price, valid until end of April.
Speaking JavaScript
By Axel Rauschmayer. "The book’s target audience is programmers who want to learn JavaScript quickly and properly, and JavaScript programmers who want to deepen their skills and/or look up specific topics."
Understanding ECMAScript 6
By Nicholas C. Zakas. "A guide for the transition between ECMAScript 5 and 6. It is not specific to any JavaScript environment, so it is equally useful to web developers as it is Node.js developers."
jQuery Succinctly
By Cody Lindley. "To instill in you, the reader, practices that jQuery developers take as common knowledge. Each chapter contains concepts essential to becoming a seasoned jQuery developer."
Book of Modern frontend tooling
Multiple authors, still in progress. "A free, work-in-progress open-source book introducing you to the world of tooling for modern web applications."
JavaScript Application Design
By Nicolas Bevacqua. "Write clean JavaScript applications that deploy with the push of a button."
You Don't Know JS
By Kyle Simpson. A successfully-funded Kickstarter book series "diving deep into the core mechanisms of the JavaScript language."
A Tweet for Thought
True words from Guillermo Rauch on the future of development, testing, depoyment, etc.
Suggestions / Corrections
Made something? Send links via Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions, corrections, or improvements, feel free to reply to this email.
Before I Go...
Gotta love this humorous repository: Semicolon.js.
Thanks to all for subscribing and reading!
Keep tooling,
Louis
webtoolsweekly.com
@WebToolsWeekly
|
|
|
|
|
|
|
