Conditional Compilation Comments

JScript implementations in Internet Explorer 4.0 and higher include a preprocessor-style language syntax called conditional compilation comments. No other browsers support conditional compilation comments, so anything you do with this is pretty much restricted to IE-only. The syntax is pretty simple:

/*@ multiLine @*/
//@ singleLine

There are only three conditional compilation statements: @cc_on, @if, and @set. These statements don’t have to be within conditional-compilation comments, but if you have them outside the comments, you guarantee that your code will throw script errors in non-IE browsers. It is very important to note that conditional compilation comments are ignored until conditional compilation is first turned on. The best way to turn it on is with the @cc_on statement:

//@cc_on

It’s a good idea to put that near the top of your code if you’re going to use a lot of conditional compilation comments later. The other way to turn this feature on is to have an @if or @set statement outside of comments; but again, that makes your code unusable in non-IE browsers so I don’t recommend it.

The @if statement has more in common with certain other languages than it does JavaScript. The bare minimum is the @if keyword, a parenthesized condition, a block of statements to execute if the condition clause is true, and an @end statement to close it all out. There can be zero or more optional @elif clauses (each with their own parenthesized conditions), and an optional @else clause.

/*@if (condition)
    // true statements
@elif(condition)
    // else-if statements
@else@*/
    // else statements
/*@end@*/

Notice how I closed the conditional comment after the @else keyword and started it up and closed it around the @end? That is a common pattern that allows the @if and @elif clauses to execute in IE for the appropriate conditions while being ignored by other browsers (because they think it’s all a big comment), but still leaves the @else block for non-IE browsers (and any IE browsers that don’t meet any of the previous conditions).

There are a bunch of useful pre-defined conditional compilation variables you can use in your conditions, but you can also set your own variables using the @set statement:

//@set @myvar = 42

Custom conditional compilation variables have limited usefulness: they can only have numeric or Boolean values (no strings) and they are pretty much only good within other conditional compilation comments. Another thing to keep in mind is that if you assign an expression to the variable, it needs to be placed inside parentheses:

//@set @othervar = (@_jscript_build * 1000)

However, this isn’t going to be a tutorial on how to write great code using conditional compilation on IE. Please go to MSDN if you want to learn more, or just Bing it.

 

Using Conditional Compilation with Ajax Minifier

In general, AjaxMin only supports statement-level conditional compilation comments. That means the conditional compilation comment needs to be at the start of a new statement, and can contain only whole statements. For instance:

var a = 10;
/*@cc_on@if(@_jscript_version > 5.6)
    alert("IE7 or higher");
@else@*/
    alert("non-IE [or IE6 or earlier]");
//@end
alert(a);

Stick to that pattern and you should be just fine. If any conditional compilation comments are encountered in situations that are not explicitly noted here, they will be ignored. This is important! AjaxMin will throw a warning whenever it encounters a conditional compilation comment that it ignores, but the severity will be sufficiently low to not show up by default unless you bump the warning level (or use the –analyze switch). When developing your application, I strongly urge you to use the –analyze switch to catch errors in your code.

 

Special-Case Exceptions

In all honesty, I’m a bit of a JavaScript purist and don’t particularly care for JScript conditional-compilation. However, it can be useful sometimes as a super-easy and 100% effective way of determining if you are running in Internet Explorer, since it is the only browser that supports this syntax. Relying on things like document.all or [heaven forbid] user-agent sniffing can sometimes give you the wrong answer. As such, there are a couple nifty ways to use conditional compilation that are special-cased within AjaxMin.

First off, inside a var-statement, you can use conditional compilation around the assignment operator and the initializing expression. For example:

var isIE/*@cc_on=1@*/;

After this statement is executed, the variable “isIE” will be 1 (true-equivalent) for Internet Explorer browsers, and undefined (false-equivalent) if not. You can then do something like the following:

var isIE/*@cc_on=1@*/;
if (isIE)
{
    // ie-specific code
}
else
{
    // non-ie code
}

As of version 4.29, AjaxMin also special-cases the !-operator (logical not) if – and only if – it is the only thing within the conditional comment (other than an optional initial @cc_on statement). You could therefore write something like this:

if (/*@cc_on!@*/0)
{
    // ie-specific code
}
else
{
    // non-ie code
}

Other than those instances, sticking to statement-level conditional-compilation statements is the way to go, if you absolutely need to use them.

Last edited May 8, 2013 at 12:45 AM by ronlo, version 3

Comments

No comments yet.