Newer posts are loading.
You are at the newest post.
Click here to check if anything new just came in.

December 06 2010

20:35

JavaScript from Null: Utility Functions and Debugging


Our JavaScript University continues as we develop our first utility function that will allow us to filter and retrieve only the unique values from an array. Along the way, I’ll teach you how to use the excellent Firebug to debug your code.


Catch Up


Utility Functions and Debugging


Final Code from the Video:

var unique = function(origArr) {
    var newArr = [],
        origLen = origArr.length,
        found,
        x = 0; y = 0;

    for ( x = 0; x < origLen; x++ ) {
        found = undefined;
        for ( y = 0; y < newArr.length; y++ ) {
            if ( origArr[x] === newArr[y] ) {
              found = true;
              break;
            }
        }
        if ( !found) newArr.push( origArr[x] );
    }
   return newArr;
}

// Test it out
var myarray = ['jeffrey', 'allie', 'patty', 'damon', 'zach', 'jeffrey', 'allie'];
myarray = unique(myarray);
console.log(myarray); // jeffrey, allie, patty, damon, zach

August 27 2010

19:29

JavaScript from Null: Cross-Browser Event Binding


In chapter five of this series, we jumped into the muddy world of event listeners. In that episode, we only got our feet wet; however, today, we’ll take things a step further as we implement a far more efficient solution. Along the way, we’ll learn a plethora of new techniques.

As with every JavaScript from Null screencast, it’s not essential that you view the previous entries in the series before watching.

Catch Up


Chapter 6: Cross-Browser Event Binding

Premium Members: Download this Video ( Must be logged in)

Our Final Code

var addEvent = (function( window, document ) {
	if ( document.addEventListener ) {
		return function( elem, type, cb ) {
			if ( elem && !elem.length ) {
				elem.addEventListener(type, cb, false );
			}
			else if ( elem && elem.length ) {
				var len = elem.length;
				for ( var i = 0; i < len; i++ ) {
					addEvent( elem[i], type, cb );
				}
			}
		};
	}
	else if ( document.attachEvent ) {
		return function ( elem, type, cb ) {
			if ( elem && !elem.length ) {
				elem.attachEvent( 'on' + type, function() { return cb.call(elem) } );
			}
			else if ( elem.length ) {
				var len = elem.length;
				for ( var i = 0; i < len; i++ ) {
					addEvent( elem[i], type, cb );
				}
			}
		};
	}
})( this, document );

// Example Usage
var lis = document.getElementsByTagName('li');
addEvent( lis, 'click', function() {
	this.style.border = '1px solid red';

});
Sponsored post
soup-sponsored
20:53
Reposted byLegendaryy Legendaryy

January 30 2010

02:45

JavaScript from Null: Chapter 5 – Events

As we move forward with JavaScript University, today, we’ll learn how to add event handlers to elements on the page. Unfortunately, this can be more cumbersome than we’d hope, due to the fact that Internet Explorer must always be the black sheep. Nevertheless, we’ll learn how to abstract these inconsistencies away to our custom utility function.

As with every JavaScript from Null screencast, it’s not essential that you view the previous entries in the series before watching.

Catch Up

In this Screencast, you’ll Learn About:

  • Working with .addEventListener
  • Working with IE’s .attachEvent
  • Differences in the way browsers handle events.
  • Capturing phase vs. event bubbling
  • Building a utility function to abstract our cross-browser event handling.

Chapter 5: Events

Other Viewing Options

Ready to take your skills to the next level, and start profiting from your scripts and components? Check out our sister marketplace, CodeCanyon.

CodeCanyon



December 30 2009

10:30

JavaScript from Null: Chapter 4

JavaScript University continues today as we learn about methods of the Array object, how to return values from functions, scope, and even your first animation.

Remember – though each new chapter builds upon the previous ones, you can still follow along perfectly well if you haven’t watched the other entries in the series!

Catch Up

In this Screencast, you’ll Learn:

  • Methods of the Array object: push, pop, unshift, shift
  • Pull values outside of functions
  • Reducing your “global footprint” by creating an object
  • SetInterval
  • Create your first animation
  • Methods of the String object.

Chapter 4: Arrays, Functions, and your First Animation

Other Viewing Options

Ready to take your skills to the next level, and start profiting from your scripts and components? Check out our sister marketplace, CodeCanyon.

CodeCanyon



December 19 2009

01:34

JavaScript from Null: Chapter 3

Continuing on with our JavaScript training, in this week’s screencast, we’ll review if, for, and while statements. Secondly, you’ll be introduced to the ternary operator, as well as a handful of the most useful methods of the String object.

Catch Up

In this Screencast, you’ll Learn:

  • If statements – long, and short-hand forms.
  • For statements
  • While statements
  • Working with arrays, and loop through them.
  • Ternary operator
  • Methods of the String object.

Chapter 3: Conditional Statements

Other Viewing Options

Ready to take your skills to the next level, and start profiting from your scripts and components? Check out our sister marketplace, CodeCanyon.

CodeCanyon



December 11 2009

21:27

JavaScript from Null: Chapter 2

Continuing on from chapter one, we’ll now take things a step further as we learn about primitive datatypes, operators, if statements, and naming conventions.

Catch Up

In this Screencast, you’ll Learn:

  • camelCase naming
  • Primitive data types: String, Number, Boolean
  • Difference between = and ===, and != and !==
  • How a string can have methods available to it, like toUpperCase() and length.
  • If statements.
  • JavaScript native functions: parseFloat, and encodeURIComponent
  • Basic Math operations
  • Incrementing numbers

Chapter 2: Data Types

Other Viewing Options

Ready to take your skills to the next level, and start profiting from your scripts and components? Check out our sister marketplace, CodeCanyon.

CodeCanyon



Older posts are this way If this message doesn't go away, click anywhere on the page to continue loading posts.
Could not load more posts
Maybe Soup is currently being updated? I'll try again automatically in a few seconds...
Just a second, loading more posts...
You've reached the end.
(PRO)
No Soup for you

Don't be the product, buy the product!

close
YES, I want to SOUP ●UP for ...