是否可以动态重写您的JavaScript

Question

I would like to edit my if else statement in javascript dynamically.

So after one if statement is used, it could be removed. I get this maybe isn't possible but after a search online failed, my curiosity begged me to ask.

For instance:

if (x > 200 && x % 25 === 0) {
  doSomething1();
} else if (x > 300 && !inRange) {
  doSomething2();
} else if (x > 400 && x % 7 === 0) {
  doSomething3();
}

There are eight if else statements within this loop. The loop determines which object to create. There are 2000 objects created over the course of a couple minutes. If on average we reach the fourth statement before it breaks, then there are 8,000 calculations being performed just within this one set of statements.

I want to streamline the script for speed and again, curiosity if we can actually write javascript dynamically without using separate functions etc. After an if statement fails, it is often not required anymore. The next statement could I suppose, include code to remove its predecessor dynamically. This might save 3 or 4 thousand calculations - not huge I know, but worthy of consideration given that there are lots of other things going on as well.

Is there a way to remove them dynamically or does anyone have any tricks or patterns up their sleeves?

Also, even if this is not available in js, what would this be called?

Answer 1

Why would you want to remove them dynamically? Altering the code dynamically is unnecessary and a bag of worms that's overdoing it for this situation. You should be using a flag.

I'll answer separately for whether you're trying to skip a large group of if statements, or an individual if statement.

Foreword

As mentioned in the comments on your question, run profiling to make sure you know where your performance problems are!

You mention your aversion to simply using boolean flags to make an if statement not run in your answer. This is fine, and it's what people normally do. This should not be an actual performance concern, and profiling will probably show your performance problems lie elsewhere. If they don't and this boolean flag check is genuinely your bottleneck - you have bigger problems, such as expecting too much from your JavaScript code, or that you didn't use the profiling tool correctly, or misinterpreted its results.

If you're trying to avoid running the body of an if statement, or its conditions, those are a bigger performance concern to you than the boolean flag check itself.

For skipping a large group of if statements

Wrap your bunch of if statements in a condition.

if (runBunchOfIfStatements) {
    // all those if statements here
}

When you're past the point of wanting those if statements to run, set the runBunchOfIfStatements flag to false (of course, you should probably pick a more meaningful name than that).

That said, 8 or 9 if statements is a code length issue, and more than likely means nothing at all for performance concerns - unless those if statements happen to involve very intensive checks. If you're worried just because there's a lot of if checks, you're probably looking in the wrong place.

For individual if statements

Say you have only one if statement you want to skip. You had this code in your answer:

} else if (x > 300 && !doneSomething2) {
  doSomething2();
  doneSomething2 = 1;
}

This is fine. You're just making a tiny check: see the foreword. Look elsewhere for your performance concern. It could be rewritten slightly to more closely follow convention (which I'm about to get to), but in this situation, the change will have negligible impact.

Let's take a situation where there is actually a performance concern here. Suppose that instead of checking x > 300 you're doing something more intensive like calculateSeveralSquareRoots() . Generally, you do take this approach, but you rearrange it like this:

} else if (needCalculations && calculateSeveralSquareRoots() {
    // do stuff
    needCalculations = false;
}

The difference here is the needCalculations flag comes first , not second. JavaScript's comparison operators have short circuit evaluation . This means that when evaluating a && b , if a is false, b never even gets checked - we already know the result will be false. If the flag comes first, that means calculateSeveralSquareRoots() never gets run, and you save time on the check.

If the flag came second, then you're potentially wasting a lot of time on that function for a condition that might almost always resolve to false anyway thanks to that flag.

So in your original, you could have the flag come before the x > 300 evaluation, just to follow convention. But again... if an if statement like this is a real and significant performance concern for you, then you have bigger issues.

Answer 2

No. And the need for such would indicate poor design.

You should use a conditional expression to determine when which code segment should be run, as you mention. If you pass a certain threshold within your code after which you no longer want a condition to be executed in your loop, why not simply break the loop and have a new code block handling the doSomethingElse clause. If you're using setInterval , that's the point at which you would call clearInterval , and then trigger some new action if necessary. Anyway, running a single (or even a few) simple conditional statement doesn't add much overhead, and isn't likely to be the limiting factor in your optimization anyway.

Answer 3

Ignoring the fact that I doubt this is a bottleneck in modern browsers that JIT the JavaScript (CPUs are very good at predictive branching) as shown because simple number comparison is not going to be expensive even in large iterations with smart predictions once it's compiled.

You can do this by injecting a different function:

checker: function(x) {
    if (x > 200) {
        doSomething1();
    }
    else if (x > 300) {
        doSomething2();
    }
    else if (y > 400) {
        doSomething3();
    }
}

Can be changed to

checker: function(x) {
    if (x > 200) {
        doSomething1();
    }
    else if (x > 300) {
        doSomething2();
        this.checker = smallerChecker;
    }
    else if (y > 400) {
        doSomething3();
    }
}

function smallerChecker(x) {
    if (x > 200) {
        doSomething1();
    }
    else if (y > 400) {
        doSomething3();
    }
}

Fundamentally, you simply need to make the behavior injectable, and then you change it however you see fit. Be-it by replacing the function doing the checking outright (the functional way) as I did above, or enabling an object to replace it (the OO way).

Answer 4

Order them in order of likelihood (so if >400 is most common, check for that first, and if x<200 is next most common, check for that, etc.) The example code is in order of increasing boundaries.

Next, your code doesn't show it and you just imply it, this is in a loop. (And if it isn't a loop, then this isn't a perf issue of interest) You could try fancy loops like Duff's device.

And figuring out what code can be changed to use more native API's is going to make a magical difference, whereas code optimizations like this will likely make only a marginal difference.

Answer 5

If you want it to be dynamic, you could always have a collection of conditions associated with actions and as soon as executed, these gets removed from the collection. However, I doubt it will lead to faster code execution, but you would have to create a jsperf test to know for sure.

DEMO: http://jsfiddle.net/a2ZEj/1/

function doSomethingA() {}
function doSomethingB() {}

var doOperation = (function doOperation() {
    var operations = [
        {
            check: function (someArg) {
                return someArg > 100;
            },
            exec: doSomethingA
        },
        {
            check: function (someArg) {
                return someArg > 100 && someArg < 200;
            },
            exec: doSomethingB
        }
    ];

    return function (someArg) {
        var i = 0,
            len = operations.length,
            item;

        for (; i < len; i++) {
            if ((item = operations[i]).check(someArg)) {
                item.exec();
                operations.splice(i, 1);
                console.log('executed ' + item.exec.name);
                return;
            }
        }
    };
})();

doOperation(101); //calls doSomethingA
doOperation(101); //calls doSomethingB
doOperation(101); //does nothing

Answer 6

You can create a method as below and create dynamic conditions

function buildCond(lhv1,rhv1,lhv2,rhv2) 
{
    var condition1,condition2;
    condition1 = condition2 = '';
    if(rhv1 !== -1){
        condition1 =  lhv1 + " == " + rhv1 + " && ";
    } 
    if(rhv2 !== -1){
        condition2 =  lhv2 + " == " + rhv2 + " && ";
    }
    return condition1 + condition2;
}

And then call this method with eval to execute

if(eval(buildCond(var1,value1,var2,value2)) === true){
    //do stuff
}