Book Image

Object-Oriented JavaScript - Second Edition

Book Image

Object-Oriented JavaScript - Second Edition

Overview of this book

JavaScript is the behavior, the third pillar in today's paradigm that looks at web pages as something that consists of clearly distinguishable parts: content (HTML), presentation (CSS) and behavior (JavaScript). Using JavaScript, you can create not only web pages but also desktop widgets, browser and application extensions, and other pieces of software. It's a pretty good deal: you learn one language and then code all kinds of different applications. While there's one chapter specifically dedicated to the web browser environment including DOM, Events and AJAX tutorials, the rest is applicable to the other environments Many web developers have tried coding or adopting some bits of JavaScript, but it is time to "man up" and learn the language properly because it is the language of the browser and is, virtually, everywhere. This book starts from zero, not assuming any prior JavaScript programming knowledge and takes you through all the in-depth and exciting futures hidden behind the facade. Once listed in the "nice to have" sections of job postings, these days the knowledge of JavaScript is a deciding factor when it comes to hiring web developers. After reading this book you'll be prepared to ace your JavaScript job interview and even impress with some bits that the interviewer maybe didn't know. You should read this book if you want to be able to take your JavaScript skills to a new level of sophistication.
Table of Contents (19 chapters)
Object-Oriented JavaScript Second Edition
About the Authors
About the Reviewer
Built-in Functions
Regular Expressions


The String() constructor creates string objects. Primitive strings are turned into objects behind the scenes if you call a method on them as if they were objects. Omitting new gives you primitive strings.

Creating a string object and a string primitive:

> var s_obj = new String('potatoes'); 
> var s_prim = 'potatoes';
> typeof s_obj;
> typeof s_prim;

The object and the primitive are not equal when compared by type with ===, but they are when compared with == which does type coercion:

> s_obj === s_prim;
> s_obj == s_prim;

length is a property of the string objects:

> s_obj.length;

If you access length on a primitive string, the primitive is converted to an object behind the scenes and the operation is successful:

> s_prim.length;

String literals work fine too:

> "giraffe".length;

Members of the String constructor



String.fromCharCode (code1, code2, code3, ...)

Returns a string created using the Unicode values of the input:

> String.fromCharCode(115, 99, 114, 
    105, 112, 116);

The String.prototype members




The number of characters in the string.

> new String('four').length;


Returns the character at the specified position. Positions start at 0.

> "script".charAt(0);

Since ES5, it's also possible to use array notation for the same purpose. (This feature has been long supported in many browsers before ES5, but not IE)

> "script"[0];


Returns the numeric code (Unicode) of the character at the specified position.

> "script".charCodeAt(0);

concat(str1, str2, ....)

Return a new string glued from the input pieces.

> "".concat('zig', '-', 'zag');

indexOf(needle, start)

If the needle matches a part of the string, the position of the match is returned. The optional second parameter defines where the search should start from. Returns -1 if no match is found.

> "javascript".indexOf('scr');
> "javascript".indexOf('scr', 5);

lastIndexOf(needle, start)

Same as indexOf() but starts the search from the end of the string. The last occurrence of a:

> "javascript".lastIndexOf('a');


Compares two strings in the current locale. Returns 0 if the two strings are equal, 1 if the needle gets sorted before the string object, -1 otherwise.

> "script".localeCompare('crypt');
> "script".localeCompare('sscript');
> "script".localeCompare('script');


Accepts a regular expression object and returns an array of matches.

> "R2-D2 and C-3PO".match(/[0-9]/g);
["2", "2", "3"]

replace(needle, replacement)

Allows you to replace the matching results of a regexp pattern. The replacement can also be a callback function. Capturing groups are available as $1, $2,...$9.

> "R2-D2".replace(/2/g, '-two');
> "R2-D2".replace(/(2)/g, '$1$1');


Returns the position of the first regular expression match.

> "C-3PO".search(/[0-9]/);

slice(start, end)

Returns the part of a string identified by the start and end positions. If start is negative, the start position is length + start, similarly if the end parameter is negative, the end position is length + end.

> "R2-D2 and C-3PO".slice(4, 13);
"2 and C-3"
> "R2-D2 and C-3PO".slice(4, -1);
"2 and C-3P"

split(separator, limit)

Turns a string into an array. The second parameter, limit, is optional. As with replace(), search(), and match(), the separator is a regular expression but can also be a string.

> "1,2,3,4".split(/,/);
["1", "2", "3", "4"]
> "1,2,3,4".split(',', 2);
["1", "2"]

substring(start, end)

Similar to slice(). When start or end are negative or invalid, they are considered 0. If they are greater than the string length, they are considered to be the length. If end is greater than start, their values are swapped.

> "R2-D2 and C-3PO".substring(4, 13);
"2 and C-3"

> "R2-D2 and C-3PO".substring(13, 4);
"2 and C-3"



Transforms the string to lowercase.

> "Java".toLowerCase();



Transforms the string to uppercase.

> "Script".toUpperCase();

ECMAScript 5 additions to String




Instead of using a regular expression to remove whitespace before and after a string (as in ES3), you have a trim() method in ES5.

> " \t beard \n".trim();
Or in ES3:
> " \t beard \n".replace(/\s/g, "");