James Fishwick

  •  Minimal
  •  CSS Tomfoolery

Converting Strings into Numbers

Code Snippet, Javascript, Note to Self

No Comments


Share this post

You need to convert a string to a number.  Several ways, with varying purposefulness:

Number constructor called as a function simply performs type conversion:

// type conversion
Number("911");        // 911
Number("20px");       // NaN
Number("2e1");        // 20, exponential notation
Number("010");        // 10 (The Number constructor doesn't detect octals)
Number("8,569")       // Nan
Number(8,569)         // 8
Number("8.569")       // 8.569
Number("0xF");        // 15 (But it can handle numbers in hexadecimal notation)
Number("false");      // NaN
Number(true)          // 1

parseInt() performs parsing into an integer*:

// parsing:
parseInt("999");        // 999
parseInt("20px");       // 20 (will stop parsing and drop any part of the string it can't figure out)
parseInt("fi5e")        // NaN (string has to start making some sense right away)
parseInt("10100", 2);   // 20
parseInt("2e1");        // 2
parseInt("010");        // 8 (if parseInt detects a leading zero on the string, it will parse the number in octal base)
parseInt("010", 10);    // 10 (decimal radix used)
parseInt("0xF");        // 15 (can also handle numbers in hexadecimal notation
parseInt("22.5")        // 22 (because the decimal point is an invalid character for an integer)
Number("false");        // NaN
Number(true)            // NaN

*It’s always a good idea to supply a radix to parseInt(value, radix) that way you don’t have accidental octal mode conversions.

The parseFloat() method works in a similar way to parseInt() however the string must represent a floating-point number in decimal form, not octal or hexadecimal.

parseFloat("1234blue"); 	// 1234.0
parseFloat("0xA"); 	// NaN
parseFloat("22.5"); 	// 22.5
parseFloat("22.34.5"); 	// 22.34
parseFloat("0908"); 	// 908
parseFloat("James1980"); 	// NaN

The Unary Plus method (+num) is basically a short cut for casting to a number via Number(). Just a nice shortcut really.

+"911"; // 911
+"20px";       // NaN
//etc etc
num = 1 + +"2"; // num is assigned the value 3
+true; // 1 (just saying...)

Finally, you can attempt some simple math on your string, does the same as the above.

"123" / 1; // 123
"123.987" * 1; // 123.987

You can use num / 1;, num * 1;, 0 + num; or 1 * num;.

If you’re interested in a speed comparison, see this test case (this would only matter for huge numbers of conversions. HUGE.)

Read more

Modernizr and jQuery and wp_enqueue_script oh my

Code Snippet, Javascript, Note to Self, WordPress

No Comments


Share this post

Some questions on the best way to use Modernizr with jQuery in the context of WordPress…

I want to be able to use jQuery in my complete callbacks. I, of course, want to be able to use wp_enqueue_script.

Read more

Get the filename with javascript

Code Snippet, Javascript, Note to Self

No Comments


Share this post

A couple ways, then explanation:

var filename = window.location.pathname.split( '/' ).pop();

and

var filename = window.location.pathname.substr(window.location.pathname.lastIndexOf("/") + 1);

Read more

Javascript redirects

Code Snippet, Javascript, Note to Self

No Comments


Share this post

There are quite a few ways to use JavaScript to take the user to a new page. Usually you’ll either see window.location.replace or window.location.href. But don’t assume the two work exactly the same. The subtle difference between the two is how they effect your session history.

If you want to simulate someone clicking on a link, use location.href. If you want to simulate an HTTP redirect, use location.replace.

// simulates similar behavior as an HTTP redirect, does not put redirect page in the browser history
window.location.replace("http://www.jamesfishwick.com");

// simulates similar behavior as clicking on a link, redirect page goes into history
window.location.href = "http://www.jamesfishwick.com";

If you’re doing a simple redirect, you’d always want to use window.location.replace, since the other alternative would setup the user for endless back button loop. However, if the redirect happens as the result of a user action, then you might want to use window.location.href so they can go back to the page where they perform said action.

Read more